/*
autor:YafullyZhao
date:09.05.26
*/
*{margin:0;padding:0;list-style:none;}
/*@media screen and (-webkit-min-device-pixel-ratio:0) {overflow:scroll}*/
html,body {margin: 0;padding: 0;font:12px Arial, "", sans-serif;line-height: 175%;background:#000 url(../images/bg.gif);}
body{overflow:hidden;}
a:link, a:visited {color: #FFF;text-decoration: none;outline:0;}
a:hover, a:active {color: #999;text-decoration:underline;}
em,cite,i{font-style:normal}
h1,h2,h3,h4,h5,form{padding:0;margin:0}
ul,ol,li{list-style:none;padding:0;margin:0}
input {border:1px solid #919191; height:18px; padding:3px 0 1px 2px;vertical-align:middle }
input.radio, input.checkbox { border:0; margin:0 5px; vertical-align:middle }
input.button { height:24px; line-height:22px; padding:0 5px; margin:3px 5px 3px 0; cursor:pointer;vertical-align:middle }
input.valinum{height:22px; line-height:22px; padding:0 5px; margin:3px 5px 3px 0;vertical-align:middle;width:80px}
select { height:24px; line-height:18px; margin-right:5px; _margin:3px 0; vertical-align:middle }
textarea { padding: 3px;margin:2px 0;font-size:12px; border: 1px solid #919191;}
.clear{clear:both;width:100%;height:0;overflow:hidden}
#message{display:none; width:150px; text-align:center; padding:5px 8px; font-weight:bold; position:absolute;z-index:101}
.box{height:100%;overflow:auto;text-align:center;position:relative}
h1.titles{padding:40px 0 10px 0;font-size:22px;color:#fff}
#container{height:3840px;width:8000px;left:0;top:0;}
.positioning{position:absolute;width:1920px;height:1200px}
/*slider*/
#slide{position:absolute;z-index:100;height:150px;width:0}
#slider{width:70px;height:150px;position:absolute;top:0;background:url(../images/homepagearr.png) no-repeat;}
#sliderbar{height:150px;background:#d1d1d1;filter:alpha(opacity=70);opacity:.7;position:relative;}
#nav{position:relative;left:0;}
#logo{width:150px;height:150px;left:0;top:0;position:absolute;filter:alpha(opacity=50);background:url(../images/logo.gif) top left no-repeat;}
#nav ul{position:absolute;left:150px;top:25px;z-index:25;}
#nav ul li{width:80px;height:100px;float:left;}
#nav ul li a{display:block;height:100px;line-height:100px;text-align:center;font-size:14px;}
#nav ul li a:hover{color:#620294}

#music{position:absolute;right:10px;top:0;width:270px;}
#playlist {width:250px;margin: auto;}
.song {width: 100%;padding:20px 5px;overflow:hidden;}
.song.playing {border-top: #000;background-color: #ff9;}
.seekbar {border: 1px solid #222;height: 20px;width: 0%;cursor: pointer;}
.position {left:0;position: relative;width: 0;height: 20px;border-left: 4px solid #222;border-right: 4px solid #222;}
.song h3 {margin: 0;font-size:12px;font-weight:normal;}
/*slider*/

/*page01*/
#page1{top:0;left:4000px;background:#EE9A10 url(../images/bg_orange.gif) repeat-y;}
.guestbook{background:url(../images/guestbg.jpg) right bottom no-repeat}
.guestbook h1{background:url(../images/title_guest.gif) top left no-repeat;}
.guestbook dl{float:left;padding:20px 10px;}
.guestbook dl label{display:block;width:80px;float:left;font-size:14px;}
.guestbook dl dt{clear:both;padding:5px}
.guestbook dl dt input{width:405px; }
.guestbook dl dd{padding:5px}
.guestbook dl dd textarea{width:400px;height:120px;}
.guestbook ul{width:400px;float:left;padding:20px 10px}
.guestbook ul li{display: block;line-height:28px;border-bottom: 1px solid #fc0;}
.guestbook ul li:hover,.guestbook ul li.onover {background:#D06C07;color: #555;}
.guestbook ul li span{color:#333;font-weight:700}


/*page01*/
/*page02*/
#page2 { background:#222;top:0;left:0;}
.home h1{width:560px;height:218px;position:absolute;left:50%;top:50%;margin:-109px 0 0 -280px;text-indent:-9999px;background:url(../images/index.gif) no-repeat}
.copyright{width:100%;position:absolute;bottom:0;left:0}
.copyright p{line-height:24px;color:#f5f5f5}
.copyright a{margin:0 5px;}
/*page02*/
/*page03*/
#page3{top:1280px;left:0;background:#fff url(../images/bg_balck.gif) repeat-y;}
.about,.diary,.contact,.guestbook{padding:60px 0 0 50px;text-align:left;color:#fff;}
.about{background:url(../images/aboutbg.jpg) right top no-repeat}
.about h1{color:#333}
.about dl{padding:15px 0;width:500px}
.about dl dt{float:left;}
.about dl dt img{padding:1px;margin:5px;border:1px solid #333;width:130px;height:130px;overflow:hidden}
.about dl dd{padding-left:150px;}
.about dl dd p{line-height:22px;color:#333;}
.about i{background:#f9f9f9}

/*page03*/
/*page04*/
#page4 {top:1280px;left:2000px;background:#1D1D1D url(../images/albumbg.jpg) top left no-repeat}
.album{}
/*page04*/
/*page05*/
#page5{top:0;left:2000px;background: #F3FBFD url(../images/bluebg01.jpg) repeat-x;}
.contact{background:url(../images/bgblue.jpg) top center no-repeat;color:#333}
.contact p{width:600px;padding:20px 10px}
/*page05*/
/*page06*/
#page6{top:1280px;left:4000px;background:#620294 url(../images/bg_purple.gif) repeat-y;}
.diary{background:url(../images/grape.jpg) top right no-repeat;}
.diary h1{background:url(../images/title_diary.gif) top left no-repeat;}
.diary ul{width:600px;padding:30px 20px}
.diary ul li{display: block;padding: 2px 10px;border-bottom: 1px solid #7C2FA4;}
.diary ul li:hover,.diary ul li.liover {background:#7110A3;color: #E8BFFD;}
/*page06*/
#YafullyBox-Box {border:2px solid #c5a524;}
#YafullyBox-InBox {position:relative;padding-top:22px;background:url(../images/box_header.gif) repeat-x}
.closebtn{width:18px;height:18px;background:#f00;position:absolute;right:2px;top:2px;cursor:pointer;background:url(../images/closebtn.gif) no-repeat}
.boxtile{position:absolute;left:2px;top:2px;line-height:20px;color:#333;font-size:12px}
.myhtmls{overflow:hidden;overflow-y:auto}
.Boxhtmls{padding:0;overflow:hidden}
.BoxAlert{padding:10px;}
#YafullyBox-BoxContent {position:relative;border-top:1px solid #c5a524;height:auto;background:#fff url(../images/warning_bg.jpg) bottom right no-repeat;}
#YafullyBox-BoxContenedor {text-align: left;font-family:Verdana;font-size:12px;color:#000;}
#YafullyBox-BoxContenedor h1,#YafullyBox-BoxContenedor h2,#YafullyBox-BoxContenedor h3,#YafullyBox-BoxContenedor b,#YafullyBox-BoxContenedor strong{text-align: left;font-family:Verdana;font-size:12px;color:#000;font-weight:bold;margin:0px;padding:0px;}
#YafullyBox-Buttons{width:100%;border-top:1px solid #c5a524;text-align:center;position:absolute;bottom:0;left:0; }
#YafullyBox-Buttons input  {margin: 5px 10px;height:24px;line-height:20px;cursor:pointer}
#YafullyBox-BoxContenedor #BoxPromptInput{margin-top:5px;}
#YafullyBox-Box .BoxAlert {background: url(../images/dialog-warning.png) top left no-repeat;}
#YafullyBox-Box .BoxConfirm {background: url(../images/dialog-warning.png) top left no-repeat;}



.gallery{position:relative;overflow:hidden;font-family:"Lucida Grande",Tahoma,sans-serif;font-size:12px;}
.gallery a{cursor:pointer;text-decoration:none;}
/*titleBar*/
.gallery .titleBar{height:20px;text-align:right;line-height:20px;font-weight:700;color:#fff;position:relative;bottom:-20px;}
/*body*/
.gallery .body{padding:10px;background-color:#f9f9f9;position:absolute;overflow:hidden;z-index:100;}
.gallery .content{width:100%;height:100%;text-align:center;position:relative;}
.gallery .loading{width:100%;height:100%;text-align:left;position:absolute;left:0px;top:0px;background:#F0F0F0 url(../images/ajax-loading.gif) no-repeat 10px 10px;}
.gallery .loading span{position:absolute;left:50px;top:18px;}
.gallery .loading a{color:#09f}
/*navigation*/
.gallery .navigation{width:100%;height:100%;position:absolute;left:0px;top:0px;}
.gallery .navigation a{height:100%;display:block;float:left;background-image:url(../images/null.gif);background-position:0px 50px;background-repeat:no-repeat;}
.gallery .navigation a.previous, .gallery .navigation a.next{width:30%;}
.gallery .navigation a.open{width:40%;}
.gallery .navigation a.previous:hover{background-image:url(../images/prevlabel.gif);}
.gallery .navigation a.next:hover{background-image:url(../images/nextlabel.gif);}
.gallery .preview{width:100%;height:135px;position:absolute;left:0px;top:-115px;color:#fff;}
.gallery .previewbody{width:100%;height:115px;position:absolute;background-color:#333;overflow:hidden;}
.gallery .previewbody p{padding:0px;margin:0px;position:absolute;left:10px;bottom:5px;}
.gallery .previewbody .listWrapper{width:100%;height:78px;position:absolute;top:10px;overflow:hidden;}
.gallery .thumbnail{margin-left:10px;border:1px solid #FFF;background-color:#333;background-repeat:no-repeat;cursor:pointer;float:left;}
.gallery .preview .btn{height:20px;padding:0px 10px;position:absolute;right:30px;bottom:20px;background-color:#333;}
/*slider*/
.gallery .slider{width:100%;padding-bottom:10px;position:absolute;z-index:99;bottom:65px;color:#666;background-color:#f9f9f9;}
/*detail*/
.gallery .detail{height:20px;padding:0px 10px;margin:0px 10px;font-size:10px;line-height:20px;background-color:#F0F0F0;}
.gallery .detail .index{float:left;}
.gallery .detail .author{float:right;}
/*caption*/
.gallery .caption{height:25px;padding:10px 10px 0px 10px;}
#gallery-wrap{width:460px;margin:100px auto 0px;}
.musicbox{cursor:pointer; color:#fff; font-weight: 700; display: block; margin-bottom: 5px;}
.imgbox{width:202px; height:140px; padding: 4px 4px 20px 4px;margin: 0px 20px 25px 0px;text-align:center; color: #666;background-color:#fff; float: left;cursor:pointer;line-height:20px;}
.imgbox img{width:202px;height:136px;overflow:hidden}