/* general */

html, body{
	font-family: Arial, Helvetica, sans-serif;	
	margin:0px;
	padding:0px;
	width:100%;
	height:100%;
	color: #999;
	font-size:12px;
	background-color: #333333;
	overflow:hidden;
}

a{
	color:#fff;
}

div#cover{	
	position:absolute;
	z-index:5;
	width:100%;
	height:100%;
	background-image:url(../spacer.gif);
}


div.preloader{
	display:none;
	position:absolute;	
	z-index:10;
	width:16px;
	height:16px;
	background-image:url(../loading.gif);
	background-repeat:no-repeat;
}

div#bubble{
	position:absolute;
	z-index:100;
	display:none;
	white-space:nowrap;
	height:15px;
}



div#bubble span{
	padding:1px 8px;
	position:relative;
	background-color:#252525;
	color:#ccc;
	font-size:11px;
	height:15px;	
}

div#bubble img{
	margin-top/*\**/:-7px\9;
	*margin-top:0px;
	position:relative;	
}

div#bubble div{	
	margin-left:5px;
	margin-top/*\**/:5px\9;
	*margin-top:0px;
}

input, textarea{
	border:solid 0px;
	background-color: transparent;
	width:160px;
	color:#eee;
	font-family: Arial, Helvetica, sans-serif;
} 


.bg_shadow_t{
	width:100%;
	height:9px;
	background-image:url(../shadow_t.png);	
	background-repeat:repeat-x;	
	top:-9px;
	left:0px;
	position:absolute;
}

.bg_shadow_lt{
	width:9px;
	height:9px;
	background-image:url(../shadow_lt.png);
	
	background-repeat:no-repeat;	
	top:-9px;
	left:-9px;
	position:absolute;
}

.bg_shadow_rt{
	width:9px;
	height:9px;
	background-image:url(../shadow_rt.png);
	
	background-repeat:no-repeat;	
	top:-9px;
	right:-9px;
	position:absolute;
}

.bg_shadow_l{
	width:9px;
	height:100%;
	background-image:url(../shadow_l.png);	
	background-repeat:repeat-y;
	position:absolute;
	top:0px;
	left:-9px;
}

.bg_shadow_r{
	width:9px;
	height:100%;
	background-image:url(../shadow_r.png);
	
	background-repeat:repeat-y;
	position:absolute;
	top:0px;
	right:-9px;
}

.bg_shadow_b{
	width:100%;
	height:9px;
	background-image:url(../shadow_b.png);
	
	background-repeat:repeat-x;	
	bottom:-9px;
	left:0px;
	position:absolute;
}

.bg_shadow_lb{
	width:9px;
	height:9px;
	background-image:url(../shadow_lb.png);
	
	background-repeat:no-repeat;	
	bottom:-9px;
	left:-9px;
	position:absolute;
}

.bg_shadow_rb{
	width:9px;
	height:9px;
	background-image:url(../shadow_rb.png);
	
	background-repeat:no-repeat;	
	bottom:-9px;
	right:-9px;
	position:absolute;
}

.bg{
	position:absolute;
	width:100%;
	height:100%;
	background-color: #434343;
	filter:alpha(opacity=90);
	-moz-opacity: 0.9;
	opacity: 0.9;
	top:0px;
	left:0px;
	z-index:1;	
}

.btn_close{
	background-image:url(../closebox.png);
	display:block;
	background-repeat:no-repeat;
	position:absolute;
	width:30px;
	height:30px;
	cursor:pointer;
	z-index:250;
}

.overlay{
	width:100%;
	height:100%;
	position:absolute;
	z-index:10;
	background-color: #333;
	filter:alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	top:0px;
	left:0px;
}





/************************** footer_max **************************/

div#footer_max{
	position:absolute;
	height:200px;	
	left:0px;
	bottom:-200px;
	z-index:100;
	width:100%;
}


div#footer_max div#logo{
	position:absolute;	
	z-index:15;
	width:330px;
	bottom:20px;
	right:0px;
}

div#footer_max div#logo span#search{
	background-image:url(../input.png);
	
	background-repeat:no-repeat;
	background-position:0% 0%;
	width:220px;
	height:30px;
	position:relative;
	display:block;
	padding-top:5px;
	margin-left:10px;
	left:60px;
	top:-20px;
}

div#footer_max div#logo span#search img{
	position:absolute;
	right:15px;

}

div#footer_max div#logo span#copyright{
	position:absolute;
	font-size:10px;
	right:40px;
	bottom:5px;
} 

div#footer_max div#menu {
	position:absolute;
	z-index:5;
	bottom:0px;
	width:100%;
	height:110px;
}

div#footer_max div#menu div#list{
	position:relative;
	z-index:10;
	top:11px;
	left:0px;
	height:120px;
	margin:0px;
	padding:0px;
}

div#footer_max div#menu div#list ul{
	position:relative;
	list-style-type:none;	
	margin:0px;
	padding:0px;
	width:1024px;
	left:30px;
	
}


div#footer_max div#menu div#list li{
	margin:0px;
	display:inline;	
	position:relative;
	font-family: Trebuchet MS, Verdana, sans-serif;
	font-size:16px;
	font-weight:bold;	
	background-image:url(../btn.png);
	background-repeat:repeat-x;
	padding-top:15px;
	_padding-top:0px;
	*padding-top:0px;
	top:-15px;
	
}


div#footer_max div#menu div#list li:first-child {	
	top:0px;
	padding:14px 0px;
	background-color:transparent;
	background-image:url(../div.png);	
	background-position:100% 0%;
	background-repeat:no-repeat;
}

div#footer_max div#menu div#list li a{	
	color:#ccc;
	text-decoration: none;	
	padding:15px 30px;
	background-image:url(../div.png);
	background-position:100% 0%;
	background-repeat:no-repeat;
	z-index:5;
	position:relative;
}

div#footer_max div#menu div#list li#btn_min{
	padding:12px 5px;
	background-color:transparent;
	background-image:url(../btn.png);	
	background-repeat:repeat-x;
	position:relative;
	cursor:pointer;
	top:-20px;
}



div#footer_max div#menu div#list .li_hover{	
	color:#fff;
	background-image:url(../btn_over.png);
	background-repeat:repeat-x;
	
}

div#footer_max div#menu div#list span#sub_btn{
	position:relative;
	top:33px;
	left:50px;
}

em{
	display:none;
}

div#footer_max div#menu div#list span#sub_btn a{
	color:#999;
	text-decoration: none;
	margin:0px 10px;
	padding:2px 15px;
}

div#footer_max div#menu div#list span#sub_btn a:hover{
	background-color: #333;
}

div#footer_max div#menu div#layer{
	position:absolute;
	width:100px;
	height:20px;
	/*border:solid 1px #fff;*/
	left:60px;
	top:25px;
}

div#footer_max div#menu div#list li div.submenu{
	display:none;
	background-image:none;
	position:absolute;
	top:40px;
	left:0px;
	width:100%;
	z-index:5;
	font-size:12px;
	text-align:center;
}


div#footer_max div#menu div#list li div.submenu a{
	background-image:none;
	margin:0px;
	padding:1px;	
	display:block;
}

div#footer_max div#menu div#list li div.submenu a:hover{
	color:#fff;
	background-color: #3c3c3c;
	
}



/************************** footer_min **************************/


div#footer_min{
	position:absolute;
	height:45px;
	bottom:-55px;
	z-index:100;
	width:580px;
}


div#footer_min  span#sub_btn{
	position:absolute;
	z-index:10;
	top:9px;
	left:5px;
	font-size:11px;
	width:100%;
}

div#footer_min  span#sub_btn div#btn_max{
	position:absolute;
	right:20px;
	top:0px;
	cursor:pointer;
}


div#footer_min  span#sub_btn a{
	color:#bbb;
	text-decoration: none;
	margin:0px 2px;
	padding:2px 8px;
}

div#footer_min  span#sub_btn a:hover{
	background-color: #333;
}


div#footer_min div.submenu{
	display:none;
	background-image:none;
	position:absolute;
	top:7px;
	left:0px;
	width:90%;
	height:20px;
	z-index:5;
	font-size:11px;
	text-align:left;
	padding-top:10px;
}


div#footer_min div.submenu a{	
	margin:0px;
	padding:1px;
}

div#footer_min div.submenu a:hover{
	color:#fff;
	background-color: #3c3c3c;
	
}



/************************** main_img **************************/

div#main_img{
	position:absolute;
	z-index:1;
	left:50%;
	top:0px;
	width:100%;
	height:100%;
}


div#main{
	position:absolute;
	z-index:1;
	width:100%;
	height:100%;
}

div#main ul{
	position:relative;
	list-style-type:none;	
	margin:0px;
	padding:0px;
}

div#main li{
	position:absolute;
	width:200px;
	height:135px;	
	filter:alpha(opacity=15);
	-moz-opacity: 0.15;
	opacity: 0.15;
	background-position:0px -135px;
	background-repeat:no-repeat;
	overflow:hidden;
	cursor:pointer;
}

div#main li .pw{
	position:absolute;
	background-image:url(../locked.png);	
	background-repeat:no-repeat;
	right:0px;
	top:0px;
	width:68px;
	height:67px;
}

div#main li .nw{
	position:absolute;
	background-image:url(../new.png);	
	background-repeat:no-repeat;
	right:0px;
	top:0px;
	width:68px;
	height:67px;
}


div#main li.img_over{
	filter:alpha(opacity=100);
	-moz-opacity: 1;
	opacity: 1;
}


div#main li .desc{
	font-family: Verdana, Helvetica, sans-serif;
	position:absolute;
	width:195px;
	height:auto;	
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	bottom:-20px;
	left:0px;
	background-color: #333333;
	color:#fff;
	z-index:100;
	font-size:11px;
	padding:3px 5px 3px 0px;
}

div#main li .desc span{	
	position:relative;
	display:block;
	float:left;
	text-align:left;
	margin-left:10px;
	_margin-left:5px;
	text-align:right;
	width:35px;
}

div#main li .desc span.text{
	width:140px;
	margin-top:1px;
	text-align:left;
	float:left;
}


div#main li.btn_left span, div#main li.btn_right span{	
	width:200px;
	position:absolute;	
	font-size:450px;
	top:-150px;
	color:#666;
	cursor:pointer;
}

div#main li.btn_left span{	
	left:-30px;
}

div#main li.btn_right span{	
	left:-33px;
}

/************************** main_detail **************************/

div#btn_left{
	position:absolute;
	left:-210px;
	top:50%;
	width:235px;
	height:145px;
	z-index:20;
}

.btn_bg{
	background-color: #333333;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	z-index:1;

}

div#btn_right{
	position:absolute;
	right:-210px;
	top:50%;
	width:235px;
	height:145px;
	z-index:20;
}

div#btn_left .nimg, div#btn_right .nimg{
	position:relative;
	padding:5px 5px;
	z-index:10;
	float:left;
}

div#btn_left .icon, div#btn_right .icon{
	position:relative;
	padding:60px 5px;
	float:left;
	width:15px;
	font-size:30px;
	color:#fff;
}

div#btn_info{
	position:absolute;
	width:500px;
	height:200px;
	top:-200px;
	z-index:10;	
}

div#btn_info div#btn_down{
	position:relative;	
	color:#fff;	
	padding:5px 10px;
	padding-top:10px;
	width:50px;	
	left:215px;
	text-align:center;
	bottom:0px;
	cursor:pointer;
}

div#btn_info div#content{
	position:relative;
	bottom:20px;
	width:100%;
	height:100%;
	top:0px;
	
}

div#btn_info div#content span{
	position:absolute;
	z-index:10;
	padding:10px;
	bottom:0px;
	width:95%;
	color:#bbb;
}

div#btn_info div#content span .hd{
	font-size:16px;
	color:#fff;
}

div#btn_info div#content span ul{
	position:relative;
	list-style-type:none;	
	margin:0px;
	padding:0px;
}


div#btn_info div#content span li{
	margin:0px;
	padding:2px 30px 2px 0px;
	width:200px;	
	position:relative;
	display:inline;
	white-space:nowrap;
	float:left;
}

div#btn_info div#content span li b{
	width:55px;	
	position:relative;
	float:left;
	color:#fff;
}


div#btn_info div#share{
	position:absolute;
	bottom:10px;
	right:10px;
}

div#btn_info div#share a{
	padding:0px 5px;
}

div#btn_info div#share span#fb_share{
	position:relative;
	width:10px;
	height:10px;
	left:0px;
	
}

div#btn_info div#share span#fb_like{
	position:absolute;
	width:300px;
	left:0px;
	left:-300px;
	top:32px;
}

div#bgmp3{
	position:absolute;
	top:0px;
	right:10px;
	z-index:10;
}

/************************** password **************************/

div#pwd{
	position:absolute;
	width:300px;
	height:174px;
	background-image:url(../password.png);	
	background-repeat:no-repeat;
	z-index:200;
}

div#pwd .btn_close{
	top:-5px;
	right:0px;
}


div#pwd .btn_submit{
	top:100px;
	left:160px;
}

div#pwd .input_box{
	font-family: Verdana, Helvetica, sans-serif;
	font-size:13px;
	color:#cb2323;
	font-weight:bold;
	top:40px;
	left:123px;
	position:absolute;
	line-height:25px;
}


div#pw .input_box input{
	width:130px;
}

/************************** guestbook **************************/

div#guest{
	width:500px;
	position:absolute;
	z-index:200;
	height:600px;
	
}

div#guest .btn_close{
	top:-10px;
	right:-8px;
}

div#guest #gcontent{
	position:relative;
	overflow: scroll;
	overflow-x: hidden;
	width:500px;
	height:560px;
	z-index:220;
	top:0px;
}

div#guest #inputbox{
	position:absolute;	
	height:40px;
	width:500px;
	bottom:0px;
	display:block;
	z-index:220;
	background-color:#333;	
	background-repeat:no-repeat;
}


div#guest #inputbox #submit, div#guest #inputbox #cancel, div#guest #inputbox #msg{
	position:absolute;
	height:17px;
	width:60px;	
	background-image:url(../btn_submit.png);	
	background-repeat:no-repeat;
	text-align:center;
	font-weight:bold;
	font-size:11px;
	padding-top:2px;
}

div#guest #inputbox #msg{
	left:230px;
	bottom:10px;
	cursor:pointer;
}

div#guest #inputbox #submit{
	right:105px;
	bottom:10px;
	cursor:pointer;
}

div#guest #inputbox #cancel{	
	right:30px;
	bottom:10px;
	cursor:pointer;
}


div#guest #gcontent a{
	color:#fff;
}

div#guest #inputbox span{
	position:relative;
	top:13px;
	left:23px;
}

div#guest #inputbox span input, div#guest #inputbox span textarea{
	width:270px;
}

div#guest #inputbox span textarea{
	height:90px;
	overflow: hidden;
}


div#guest #gcontent .gc, div#guest #gcontent #op{
	position:relative;
	display:block;
	padding:10px;
	background-color:#555;
	margin:10px;
	background-image:url(../btn.png);	
	background-repeat:repeat-x;
}

div#guest #gcontent #op{
	font-size:10px;
	cursor:pointer;
}


div#guest #gcontent .hd{
	font-size:13px;
	font-weight:bold;
	color:#ff8813;
}

div#guest #gcontent .dhd{
	color:#fff;
	font-weight:bold;
	font-size:12px;
	background-image:url(../date.png);	
	background-repeat:no-repeat;
	width:50px;
	height:51px;
	display:block;
	position:absolute;
	text-align:center;	
	padding-top:8px;
	top:4px;
	left:4px;

}

div#guest #gcontent .comm{
	position:relative;
	width:390px;
	top:0px;
	left:50px;
}


div#guest .free_cap{
	position:absolute;
	top:15px;
	right:0px;
	width:200px;
	text-align:center;
	font-size:10px;
}

div#guest .free_cap input{
	width:110px;
	margin-top:6px;
}

div#guest .free_cap a{
	color:#999;
}

/************************** ecard **************************/

div#ecard{
	width:800px;
	position:absolute;
	z-index:200;
	height:600px;
}

div#ecard .btn_close{
	top:-10px;
	right:-8px;
}

div#ecard #eccontent{
	position:relative;
	z-index:10;
}



/************************** archive **************************/

div#archive{
	width:300px;
	position:absolute;
	z-index:200;
	height:400px;
	bottom:50px;
	margin:0 45%;
}

div#archive #acontent{
	left:0px;
	top:0px;
	position:absolute;	
	z-index:220;
	width:300px;
	height:400px;
	overflow: scroll;
	overflow-x: hidden;
}

div#archive #acontent ul{
	position:relative;
	list-style-type:none;	
	margin:0px;
	padding:0px;
	text-align:right;
	padding-top:10px;
}

div#archive #acontent li{
	padding:5px 10px;
	margin-bottom:10px;
	margin-right:20px;
	border:block;
	position:relative;
	cursor:pointer;
}

div#archive #acontent li span{
	top:0px;
	right:0px;
	position:absolute;
	border:block;
	background-color: #333333;
	height:25px;
	z-index:-1;
}

div#archive .btn_close{
	top:-10px;
	right:-8px;
}

/********* css hacks ************/


@-moz-document url-prefix(){
	div#footer_max div#menu div#list li{
		padding:15px 0px;
	}

	div#footer_max div#menu div#list li#btn_min{
		padding:12px 5px;
	}

	div#footer_max div#logo span#search{	
		padding-left:10px;
	}

}

@media screen and (-webkit-min-device-pixel-ratio:0){ 	
	div#bubble span{padding:0px 5px;height:15px;}
	div#bubble img{margin-top:-3px;}
	div#bubble div{margin-top:2px;}
	div#footer_min  span#sub_btn a{padding:2px 5px;}
}