@charset "utf-8";

*{
padding: 0;
margin: 0;
outline: none;
}

body{
	font: 17px/30px Arial, Helvetica, sans-serif;
	letter-spacing: 3px;
	color: #fff;
	background: #000 url(../images/background.jpg) no-repeat center top;
}

	#wrapper{
	margin: 0 auto;
	width: 760px;
	}
			#header{
			width: 760px;
			height: 280px;
			}
				ul#nav{
				list-style: none;
				float: right;
				margin: 18px 32px 0 0;
				}
					ul#nav li{
					float: left;
					margin-right: 12px;
					}
						ul#nav li a{
						display: block;
						height: 15px;
						text-indent: -9999px;
						background-repeat: no-repeat;
						overflow: hidden;
						}
						ul#nav li a#home{
						width: 48px;
						background: url(../images/sprite.jpg) 0px 0px;
						}
							ul#nav li a#home:hover{
								background-position: 0px -15px;
							}
						ul#nav li a#about{
						width: 77px;	
						background: url(../images/sprite.jpg) -48px 0px;
						}
							ul#nav li a#about:hover{
								background-position: -48px -15px;
							}
						ul#nav li a#portfolio{
						background: url(../images/sprite.jpg) -125px 0px;
						width: 67px;
						}
							ul#nav li a#portfolio:hover{
								background-position: -125px -15px;
							}
						ul#nav li a#contact{
						background: url(../images/sprite.jpg) -192px 0px;
						width: 64px;
						margin: 0;
						}
							ul#nav li a#contact:hover{
								background-position: -192px -15px;
							}
					
					
			#content-wrapper{
			width: 760px;
			background: url(../images/background_pattern.gif) repeat-y;
			}
				#content{
				width: 760px;
				overflow:auto;
				background: url(../images/background_deco.jpg) no-repeat;
				min-height: 526px;
				}
					#content p{
					color: #0ba687;
					margin: 0 45px 10px 45px;
					}
					
					#content p em{
						font-style: normal;
						color: #48F2D0;
					}
					
					#content p a, #content ul.list li a{
					color: #fff;
					text-decoration: none;
					padding: 0 3px;
					}
						#content p a:hover, #content ul.list li a:hover{
						background-color: #FFF;	
						color: #000
						}
					
					#content h1{
					margin: 45px 0 30px 45px;
					height: 62px;
					overflow: hidden;
					text-indent: -9999px;
					display: block;
					}
					
						#content h1#home{
						width: 396px;
						background: url(../images/welcome.jpg);
						}
						#content h1#about{
						width: 407px;
						background: url(../images/about.jpg);
						}
						#content h1#portfolio{
						width: 450px;
						background: url(../images/portfolio.jpg);
						}
						#content h1#contact{
						width: 387px;
						background: url(../images/contact.jpg);
						}
					
					#content h2{
					font-family: "Times New Roman", Times, serif;
					font-size: 24px;
					padding: 10px 45px 10px 45px;
					}
					
					#content h3{
					font-size: 16px;
					padding: 0 55px 5px 55px;
					}
						
					#content ul.list{
					list-style: url(../images/list-li.gif);	
					margin: 0 35px 10px 85px;
					}
					
						#content ul.list li{
						line-height: 25px;
						letter-spacing: 2px;
						height: 25px;
						font-size: 15px;
						color: #0ba687;
						}
					br.clear{
					height: 50px;	
					}
					
					#content table{
					width: 700px;	
					}
					
						#content table td{
						width: 350px;
						padding: 0 5px;
						}
						
						#content table td span{
						width: 200px;
						height: 15px;
						display: block;
						background: url(../images/graph_out.png) repeat-x;
						}
					
					dl#vocabulary {
					margin: 0 45px 0 45px;
					}
						dl#vocabulary dt {
						font-size: 34px;
						font-family: "Times New Roman", Times, serif;
						margin: 15px 0 0 -15px;
						}
						dl#vocabulary dd {
						color: #0ba687;	
						}
							dl#vocabulary dd strong {
							color: #40F2CE;
							}
						
					/* Gallery */
					ul.gallery {
					list-style: none;
					}
					
						ul.gallery li {
						float: left;
						margin: 10px;
						}
						
							ul.gallery li a {
							text-decoration: none;
							position: relative;
							padding: 10px;
							display: block;
							overflow: auto;
							background: url(../images/gallery.png) no-repeat;
							}
							
								ul.gallery li a img{
								width: 130px;
								height: 130px;
								float: left;
								border: none;
								}
								
								ul.gallery li a:hover {
								background: url(../images/gallery.png) no-repeat 0px -150px;
								}
							
							ul.gallery li a span {
								display: none;
								width: 130px;
								height: 15px;
								overflow: hidden;
								position: absolute;
								float: left;
								margin-top: 115px;
								
								color: #FFF;
								line-height: 15px;
								text-align: center;
								font-size: 11px;
								letter-spacing: 0;	
							}
							
								ul.gallery li a:hover span {
								display: block;
								background-color: #fd6c00;
								}
							
					/* Gallery end */
					/* Accordion */
					.concertina {
					  width: 700px;
					  margin-left: 30px;
					  }
					.concertina .trig {
					background: url(../images/acc_trig.png) no-repeat 0px -50px;
					height: 50px;
					cursor: pointer;
					display: inline-block;
					margin: 0;
					position: relative;
					
					font-family: "Times New Roman", Times, serif;
					text-align: center;
					line-height: 45px;
					font-size: 30px;
					}
					.concertina .trig {
					  display: block;
					  }
					.concertina .open {
						background: url(../images/acc_trig.png) no-repeat 0px 0px;
						cursor:                    pointer;
					  }
					.concertina .trig:hover {
					  background: url(../images/acc_trig.png) no-repeat 0px 0px;
					  }
					.concertina .targ {
					  border-top:                0 !important;
					  border-bottom:             0 !important;
					  margin-top:                0 !important;
					  margin-bottom:             0 !important;
					  padding-top:               0 !important;
					  padding-bottom:            0 !important;
					  position:                  relative !important;
					  display:                   inline-block;
					  
					  margin:                    0;
					  overflow:                  auto;
					  padding:                   0 10px;
					  }
					.concertina .targ {
					  display:                   block;
					  }
					/* Accordion end */
	#footer{
	background: url(../images/background_footer.jpg) no-repeat center top;	
	}
		#footer-content{
		margin: 0 auto;
		width: 760px;
		height: 567px;
		background: url(../images/background_linkhub.jpg) no-repeat center top;
		}
			ul#linkhub{
			list-style: none;
			}
				ul#linkhub li{
				float: left;
				margin-right: 12px;	
				}
						ul#linkhub li a{
						display: block;
						text-indent: -9999px;
						background-repeat: no-repeat;
						overflow: hidden;
						}
						ul#linkhub li a#youtube{
						margin: 208px 0 0 86px;
						width: 141px;
						height: 77px;
						background: url(../images/sprite.jpg) 0px -30px;	
						}
							ul#linkhub li a#youtube:hover{
							background-position: 0px -107px;
							}
						ul#linkhub li a#flickr{
						margin: 222px 0 0 68px;
						width: 146px;
						height: 52px;
						background: url(../images/sprite.jpg) 0px -184px;	
						}
							ul#linkhub li a#flickr:hover{
							background-position: 0px -236px;
							}
						ul#linkhub li a#deviantart{
						margin: 213px 0 0 67px;
						width: 139px;
						height: 67px;
						background: url(../images/sprite.jpg) -141px -30px;	
						}
							ul#linkhub li a#deviantart:hover{
							background-position: -141px -97px;
							}

/* Added later on */

#internet-hell{
display: none;
}

p#job{
color: #FC0;
background-color: #000;
border: 1px solid #713800;
padding: 10px;
line-height: 20px;
letter-spacing: 1px;
}
	
input{
 margin: 0 0 20px 45px;
 width: 200px;
 height: 25px;
 font-size: 18px;
 line-height: 25px;
 padding: 0 4px;
}

	input#submit{
	margin: 0 0 0 280px;
	height: 30px;
	padding: 0;
	}

textarea{
 margin: 0 0 20px 45px;
 font-size: 25px;
 height: 100px;
 width: 400px;
 font-size: 18px;
 line-height: 25px;
 padding: 4px;
}
	