/* -------------------------------------------------------------- 
  
   reset.css
   * Resets default browser CSS.
   
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}

body { 
  line-height: 1.5; 
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* Remove annoying border on linked images. */
a img div { border: none; }

a:active{utline: none;}

a:focus{-moz-outline-style: none;}
div:focus{-moz-outline-style: none;}
/*
END OF RESET
*/

html,body{height:100%;width:100%}
body{
	z-index:-1;
	background: #f8f7f3;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 14px;
}
#preloader{width:100%;height:346px;background:#FFF;}
#preloader img{margin-left:357px;margin-top: 165px;}

a{
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}


.clear{clear:both}

#bg_top{
	padding-top:1px;
	height: 17%;
	background:#e4e0d0;
	width:100%;
	position:relative;
	z-index: 10;


}
#bg_bottom{
	width:100%;
	z-index: 100;

}

#center_wrap{
	width:100%;
	height: 50px;
	position:absolute;
	bottom:24px;
	z-index: 9;
}

#header{
	width: 739px;
	height: 50px;
	margin:auto;
}

#logo{
	float:left;
}
		
#header ul{
	list-style:none;
	z-index: 2000;
}

#header #visual, #header #music, #header #radio{
	width:132px;
	height: 19px;
	padding: 1px 9px 3px 9px;
	position:absolute;
	color: #FFF;
	overflow:hidden;
	margin-top: 17px;
	top:0px;
	cursor:default;
	z-index: 8;
}



#header #visual{
	width:311px;
	background:url(../images/visual_bg.jpg) repeat-x;
	margin-left: 111px;
	padding-right:0px;
	overflow:visible;
}


			#header #visual h1{
				float: left;
				font-weight: bold;
			}
					
			#header #visual #prev{
				margin-top:3px;
				background:url(../images/prev.jpg) no-repeat;
				width:55px;
				height: 18px;
				float:right;
				cursor: pointer;		
			}
			#header #visual #next{
				margin-top:3px;
				margin-right:2px;
				background:url(../images/next.jpg) no-repeat;
				width:55px;
				height: 18px;
				float:right;	
				cursor: pointer;	
			}
			
			#drop_down{
				margin-top:3px;
				margin-right:2px;
				background: #ed8b5a;
				width:131px;
				height: 16px;
				float:right;
				z-index:3000;
			}
			
			#drop_down_selected{
					margin-left:3px;
					float:left;
					width:111px;
					font-size: 11px;
					font-weight:normal;
					line-height: 14px;
					display:inline;
					
				}
				
			#drop_down_arr{
					margin-top:2px;
					background:url(../images/drop_arr.jpg) no-repeat;
					width:14px;
					height: 12px;
					cursor: pointer;
					float:right;
					margin-right:2px;
				}
				
			#drop_down_list{
					display:none;
					clear:both;
					background: #ed8b5a;
					width:131px;
					font-size: 11px;
					font-weight:normal;
					top:20px;
					/*left:17px;*/
					position:absolute;
					z-index:20;
					
				}
				
				#drop_down_list ul{
						list-style:none;
					
					}
					
				#drop_down_list ul li{
						
						
					}
					
				#drop_down_list ul li a{
						color: #FFF;
						font-weight:normal;
						display: block;
						padding-left:3px;
						
					}
					
					#drop_down_list ul li a:hover{
						text-decoration:none;
						background: #ed7f48;
					}
		/**/
		#music{
			background: url(../images/music_bg.jpg) no-repeat;
			margin-left: 435px;
			z-index:1000;
		}
		
		#music p{
			color: #d1fda2;
		
		}
		#radio{
			background: url(../images/radio_bg.jpg) no-repeat;
			margin-left: 589px;
			z-index:1000;
		}
		
		#radio p{
				color: #a6d4ff;
		}

.inner{
	font-weight:100;
	font-size: 13px;
	position: relative;

}

.inner p{

	line-height: 15px;
	margin-bottom: 10px;
}

.suggest{
	font-size: 11px;
	line-height: 10px;
}

.inner a{
	color:#FFF;
	font-weight: bold;

}
.inner h1{
	font-weight:bold;
	margin-bottom: 10px;
	font-size: 14px;
}



#container{
	width:738px;
	margin:auto;
	margin-top: 11px;
	padding-top: 1px;
}
	#container h1{
		float:left;
		font-size: 22px;
		color: #a2968b;
		margin-right: 19px;
	}
		

	#container ul{
		list-style: none;
		margin-top: 11px;
	}

	#container ul li{
		float:left;
		font-size: 12px;
		color: #a2968b;
		width: 20px;
		height: 19px;
		text-align: center;
		
	}
	
	#container ul li a{
		color: #a2968b;
		text-decoration:none;
		
	}

	#container ul li.selected{
		font-weight: bold;
		background: url(../images/project_num_bg.jpg) no-repeat;

	}

	#container ul li.selected a{
		cursor:default;

	}

	#container #pic_container{

		margin-top: 8px;
		height: 418px;
		width:738px;
		position:relative;
		overflow:hidden;
		display:block;
		z-index:0;
	}
	
	#container #pic_container #pic{
		cursor:pointer;	
	}
	
	
	#container #description{
		background: #000000;
		opacity: 0.55;
		filter:alpha(opacity=55);
		width:708px;;
		position:absolute;
		top:1px;
		padding: 15px;
		font-size: 11px;
		color:#FFF;
		top:-80px;
		left:0px;
	}


	#container #hover_target{
		width:738px;
		height:345px;
		position:absolute;
		top:0px;
		left:0px;
		z-index:9;
		background:#030;
		filter:alpha(opacity=0);
		opacity:0;
	}
	#container #description a{
		color:#FFF;
	}
#footer{
	color: #887a6f;
	font-size:11px;
	letter-spacing:0px;
	line-height:13px;
	position: relative;
	top: -25px;
	float:left;
	
}

#footer a{
	color: #887a6f;
}

#credit{
	color: #887a6f;
	font-size:11px;
	letter-spacing:0px;
	line-height:13px;
	position: relative;
	top:-25px;
	right: 0px;
	float:right;
	vertical-align:3px;
}

#credit img{vertical-align:middle;}