body{text-align:center; padding:0; margin:0 auto}
#searchbar a, a{text-decoration:none; color:#FF0}
#searchbar a:hover, a:hover{text-decoration:underline; color:#FFF}
a.webstate{color:#5FA64D}
a.webstate:hover{color:#5FA64D; border:none}
a.invert, #roundbox A, .brightarea A, .diaryBlock A, #searchresult a{color:#33F}
a.invert:hover, #roundbox A:hover, .brightarea A:hover, .diaryBlock A:hover, #searchresult a:hover{color:#33F}
body, td, th{font-family:"Comic Sans MS","Courier New",Courier,Mono,Arial; font-size:10pt}
td, th{color:#FFFFEB}
input, textarea{font-family:"Comic Sans MS","Courier New",Courier,Mono,Arial; font-size:10pt; color:#000}
H3{margin-top:0; font-size:14pt}
FORM{margin:0; padding:0}
.invert{color:#66C}
.language{display:block; position:absolute; right:20px; bottom:-20px; color:#EEEEF2}

/* Body Frame */
#container{width:750px; margin:5px auto; border:none}
#header{width:750px; height:120px; background:url(/images/baby_header.gif) no-repeat top center; border:none; position:relative}
#header h2{visibility:hidden}
#main{background:#66C; text-align:left; color:#FFFFEB}
*html #main{height:1%}
#main:after{content:""; display:block; clear:both}
#menu{display:block; width:170px; margin:0; float:left}
#menu A.leftfoot, #menu A.rightfoot, #menu A.leftfootOn, #menu A.rightfootOn{display:block; margin:8px 0 8px 5px; text-decoration:none; white-space:nowrap; cursor:pointer}
#menu A.leftfoot{background:url(/images/menu/left_foot.gif) no-repeat center left}
#menu A.leftfoot:hover, #menu A.leftfootOn{background:url(/images/menu/left_foot_on.gif) no-repeat center left}
#menu A.rightfoot{background:url(/images/menu/right_foot.gif) no-repeat center left}
#menu A.rightfoot:hover, #menu A.rightfootOn{background:url(/images/menu/right_foot_on.gif) no-repeat center left}
#menu span{display:block; height:24px; width:150px}
#menu span b{visibility:hidden}
#menu .Home{background:url(/images/menu/en_US/Home.gif) no-repeat 19px 50%}
#menu .Profile{background:url(/images/menu/en_US/Profile.gif) no-repeat 19px 50%}
#menu .Diary{background:url(/images/menu/en_US/Diary.gif) no-repeat 19px 50%}
#menu .Photos{background:url(/images/menu/en_US/Photos.gif) no-repeat 19px 50%}
#menu .Videos{background:url(/images/menu/en_US/Videos.gif) no-repeat 19px 50%}
#menu .Creations{background:url(/images/menu/en_US/Creations.gif) no-repeat 19px 50%}
#menu .Wallpaper{background:url(/images/menu/en_US/Wallpaper.gif) no-repeat 19px 50%}
#menu .Postcard{background:url(/images/menu/en_US/Postcard.gif) no-repeat 19px 50%}
#menu .Drawing{background:url(/images/menu/en_US/Drawing.gif) no-repeat 19px 50%}
#menu .Games{background:url(/images/menu/en_US/Games.gif) no-repeat 19px 50%}
#menu .E-Songs{background:url(/images/menu/en_US/E-Songs.gif) no-repeat 19px 50%}
#menu .Idioms{background:url(/images/menu/en_US/Idioms.gif) no-repeat 19px 50%}
#menu .Bookmarks{background:url(/images/menu/en_US/Bookmarks.gif) no-repeat 19px 50%}
#menu .Guestbook{background:url(/images/menu/en_US/Guestbook.gif) no-repeat 19px 50%}
#menu .Newsletter{background:url(/images/menu/en_US/Newsletter.gif) no-repeat 19px 50%}
#menu .Coloring{background:url(/images/menu/en_US/Coloring.gif) no-repeat 19px 50%}
#menu .hr{border-top:dashed 1px #FFF; display:block; margin:18px 0}
#menu .menuInside{width:150px; margin:0 10px}
#menu A.musicOff{padding-left:30px; background:url(/images/menu/speaker_off.gif) no-repeat center left}
#menu A.musicOn{padding-left:30px; background:url(/images/menu/speaker_on.gif) no-repeat center left}
#noscript{width:750px; text-align:center; padding:5px 0; margin:10px auto; border:1px solid #FA0; background:url(/images/butterfly.gif) 10px 50% no-repeat #FFF}
#content{width:550px; float:left}
#footer{clear:both; width:750px; height:129px; background:url(/images/baby_footer.gif) no-repeat top center #FFFFEB; text-align:left}
#footer .design{visibility:hidden}
#addthis_services td a{font-size:8pt}
#webstate{width:750px; font-size:8pt; color:#5FA64D; margin:auto; text-align:center}
#webstate img, #menu img{vertical-align:middle}

/* SkyWalker */
#Skywalker{margin-top:90px; display:none; text-align:center}

/* Re-use Elements */
UL.list{margin:0; padding:0 0 0 20px}
UL.list LI{margin-bottom:4px}

.subtitle{font-size:11pt; color:#FFFFF2; font-weight:bold; margin-bottom:4px; display:block}
.border{border:3px solid #FFF}
.normal{color:#000}
.small{font-size:8pt}
.center{text-align:center}
.alert{color:#FF0}
.darkarea{clear:both; border-top:1px solid #FC0; border-bottom:1px solid #FC0; background:#55B; padding:20px; position:relative}
.darkarea h4{font-size:11pt; margin:0 0 10px}
.brightarea{clear:both; border-top:3px solid #FC0; border-bottom:3px solid #FC0; background:#FFD; padding:20px; position:relative}
.brightarea, .brightarea TD{color:#33A}
.brightarea .alert, .diaryBlock .alert{color:#F00}
.floatleft{float:left}
.floatright{float:right}
.inline{display:inline}
.clear{clear:both}
.relative{position:relative}
.table{display:table}
.nowrap{white-space:nowrap}
.remark{font-size:8pt; font-weight:normal}

.case250{width:250px; margin:0 12px 20px}
.case166{width:166px; margin:0 7px 20px}
.case166 A:hover{text-decoration:none}
.case250, .case166{float:left; text-align:center}

.notebox{background:#55B; text-align:center; font-size:8pt; color:#FFFFF2}
.temp{position:relative; clear:both}

/* Roundbox */
#roundbox{background:#FFF; text-align:center}
#boxtop .left{background:url(/images/r_nw.gif)}
#boxtop .right{background:url(/images/r_ne.gif)}
#boxbottom .left{background:url(/images/r_sw.gif)}
#boxbottom .right{background:url(/images/r_se.gif)}
#boxtop, #boxbottom{clear:both; height:20px; text-align:left}
#boxtop .left, #boxbottom .left, #boxtop .right, #boxbottom .right{border:none; float:left; width:20px; height:20px; background-repeat:no-repeat}
#boxtop .right, #boxbottom .right{float:right}
#roundbox h4{margin-top:0}
.issueCover{margin-bottom:5px}

/* Welcome Page */
#newimage{margin-bottom:20px}
#diarylist{margin-bottom:20px; width:270px; float:left}
#newlist{margin-bottom:20px; width:270px; float:right}
#newlist ul{margin-top:0}
#diarylist h4, #newlist h4{text-decoration:underline; margin:0 0 10px}

/* Profile Page */
#content hr{border-top:dotted 1px #FFF; clear:both}
.introduction{line-height:14pt; text-align:justify; width:500px}
h4.milestone{margin:0; width:500px}
#milelink{display:block; padding:5px 0 5px 25px; border-top:1px solid #88e; border-bottom:1px solid #88e}
.iconminus{background:url(/images/minus.gif) no-repeat 5px 50% #55B}
.iconplus{background:url(/images/plus.gif) no-repeat 5px 50% #55B}
#milestone{overflow:hidden; width:500px}
.mile{font-weight:bold; background:#8686e1; text-align:right}
.stone{background:#55b}
#performance{float:right; border-left:1px dashed #CCC; padding-left:15px}
.infolist:after{content:""; height:0; overflow:hidden; display:block}
*html .infolist{height:1%}

/* Creation Page */
UL.menulist{padding:0; margin:0; list-style-type:none}
UL.menulist LI{float:left; width:49%; font-weight:bold}
UL.menulist A.tabOn{display:block; padding:5px; text-decoration:none; color:#4a4aba; border-right:1px solid #4a4aba; background:#FC0; font-size:11pt; text-align:center; margin-right:2px}
UL.menulist A.tab{display:block; text-align:center; margin-right:2px; color:#4a4aba; background:#EB1; border-right:1px solid #4a4aba}

A.tablebox{display:block; border:1px solid #55b; padding:5px; background:#FFF; margin:auto}
A.tablebox:hover{border-color:#FF0}

/* Guestbook */
#menurow{position:relative; height:30px; vertical-align:bottom}
#menurow .rightElement{position:absolute; right:0; bottom:0}
#menurow .tabOn{padding:7px 0; text-decoration:none; color:#4a4aba; border-right:1px solid #4a4aba; background:#FC0; font-size:11pt; text-align:center}
#menurow .tab, #menurow .tabOn{font-weight:bold; display:block; float:left; width:150px; text-align:center; margin-right:2px}
#menurow a.tablink{display:block; color:#66C; background:#EB1; padding:3px 0; border-right:1px #4a4aba solid; width:100%; margin-top:10px}
#menurow a.tablink:hover{margin-top:0; text-decoration:none; font-weight:bold; color:#4a4aba; padding:7px 0; font-size:11pt}

.guestblock{display:table; width:100%; position:relative}
.guestline{clear:both; position:relative; padding-bottom:10px; border-bottom:1px dashed #77D}
.guestinfo{margin:10px 0; clear:both; text-align:left; position:relative}
.guestinfo .time, #searchbar .sort, .guestinfo .page{position:absolute}
.guestinfo .time{right:0; top:3px}
.guestinfo .page{right:0; display:inline}
.guestinfo A.email{padding-left:21px; background:url(/Guestbook/images/icon_email.gif) no-repeat center left}
.guestinfo A.home{padding-left:21px; background:url(/Guestbook/images/icon_www.gif) no-repeat center left}
.guestinfo A.icq{padding-left:21px; background:url(/Guestbook/images/icon_icq_add.gif) no-repeat center left}
.guestinfo A.MSN{padding-left:21px; background:url(/Guestbook/images/icon_msnm.gif) no-repeat center left}
.guestinfo .IP{padding:0 10px; background:url(/Guestbook/images/icon_ip.gif) no-repeat center left}
.guestinfo A.edit{padding-left:23px; background:url(/Guestbook/images/icon_edit.gif) no-repeat center left}
.guestinfo img, .comment img, .reply img{vertical-align:middle}

#searchbar{background:#66C; padding:4px; position:relative; border:1px solid #77D; margin-bottom:20px; color:#FFF; display:table; width:100%}
#searchbar .sort{right:4px; margin-top:4px}

.comment{clear:both; margin-bottom:20px; position:relative}
.reply{border:1px solid #99D; padding:15px; color:#77D}
.reply legend{font-weight:bold; color:#77D; margin-bottom:4px}
.reply p{margin-top:0}

/* Write GuestBook */
#guestform{display:table}
#guestform .row{display:table-row; vertical-align:top; clear:both}
#guestform .textcol, #guestform .inputcol, #guestform .rightcol{display:table-cell; padding:4px 0; float:left; position:relative}
#guestform .textcol{width:140px; font-weight:bold; vertical-align:top}
#guestform .mandatory{font-weight:normal; font-size:8pt}
#guestform .inputcol, #guestform .rightcol{width:365px}
#guestform .inputcol input{width:100%}
#chooseface{display:block; padding:10px; border:2px solid #99D; background:#FFF}
.emotionface{float:right; position:relative; z-index:10}

/* Bookmarks */
.bitem{clear:both; position:relative; margin-bottom:15px}
.siteimage{margin-bottom:15px; float:left}
.sitedesc{margin:0 0 15px 180px}
.sitedesc P{margin:0}
.pageinfo{clear:both; text-align:left; position:relative; height:20px; padding-top:10px}
.pageinfo div{background:#66C; display:inline}
.pageinfo .left{position:absolute; left:0; top:0}
.pageinfo .page{position:absolute; right:0; top:0}
.pageinfo .hr{border-top:1px dotted #DDF; background:none; display:block}

/* Diary */
#lastcalendar{width:170px; margin-right:20px; float:left}
#nextcalendar{width:170px; margin-left:20px; float:right}
#currentcalendar{width:170px; text-align:center; float:left}
.diaryBlock{border:1px solid #CCF; background:#FFD; padding:10px; line-height:14pt; margin-bottom:10px}
.diaryBlock, .diaryBlock td{color:#33A}
#lastnext{width:170px; position:relative; height:22px}
#lastnext A{display:block; padding:2px; background:#E0E0F5; font-size:8pt}
#lastnext A:hover{background:#FFF; text-decoration:none}
#lastnext .last, #lastnext .next{margin:1px; width:83px; position:absolute; display:block; text-align:center}
#lastnext .last{left:0}
#lastnext .next{right:0}
OL.list{margin:0; padding-left:40px}
#diarylist OL.list{margin:0; padding-left:25px}
OL.list LI{margin-bottom:4px; clear:both; color:#CCCCCA}
OL.list .date{margin-right:4px; font-family:Courier,Arial; color:#FFF; white-space:nowrap}
.diarypnb{margin-top:7px}

/* Diary Calendar */
.calendarBorder{background-color:#CCF}
.calendarWeekBar{background-color:#66C; color:#E0E0F5; font-weight:bold; text-align:center}
.calendarWeekBar acronym{text-decoration:none; border:none}
#currentcalendar .calendarWeekBar{color:#FFD}
.calendarDayBlock{background-color:#E0E0F5; color:#66C; text-align:center; font-family:"Courier New",Courier,Arial}
#currentcalendar .calendarDayBlock{background-color:#FFD}
.calendarHoliday{background-color:#E0E0F5; color:#F60; text-align:center; font-family:"Courier New",Courier,Arial}
#currentcalendar .calendarHoliday{background-color:#FDD}
.calendarDiary{background-color:#FFF; text-align:center; font-weight:bold; font-family:"Courier New",Courier,Arial}
.calendarDiary A.ss{color:#F60}
.calendarDiary A{color:#66C}
.calendarDiary A:hover{text-decoration:underline; color:#66C}

/* Videos */
#videos{position:relative; text-align:center}
#tvbox{position:relative; text-align:center; margin:auto; width:467px; height:395px; background:url(/images/tv.gif) no-repeat}
#tvbox select{margin-top:20px; margin-bottom:10px}
#tvbox .screen{border:2px groove #66C; display:table; margin:auto; width:320px; height:286px; background:#000}
#tvbox h4{margin-top:10px}

/* Postcard */
UL#choice{margin:0; padding:0; list-style:none}
UL#choice LI{float:left; margin:0 20px 5px 0; white-space:nowrap}
UL#choice LI A.left, UL#choice LI A.leftOn{padding:2px 0; padding-left:25px; background:url(/images/left_hand.gif) no-repeat}
UL#choice LI A.left:hover, UL#choice LI A.leftOn{background:url(/images/left_hand_on.gif) no-repeat; color:#FFF}
UL#choice LI A.right, UL#choice LI A.rightOn{padding:2px 0; padding-left:25px; background:url(/images/right_hand.gif) no-repeat}
UL#choice LI A.right:hover, UL#choice LI A.rightOn{background:url(/images/right_hand_on.gif) no-repeat; color:#FFF}
#inputarea{width:500px; position:relative; text-align:left}
#inputarea .cardimage{clear:both; margin:20px 0}
#inputarea .field{display:table-cell; width:245px}
#inputarea .row{clear:both; display:block; width:100%; margin-bottom:9px}
#inputarea .field input{width:95%}
#inputarea OL{margin:0; padding:0; list-style:none}
#inputarea OL LI{margin-bottom:5px; display:block; width:100%}
#inputarea OL span span{visibility:hidden; display:none}
#inputarea .extra{clear:both; text-align:Center; line-height:16pt}

#preview{width:100%; position:relative}
#preview .to{text-align:left; margin-bottom:10px}
#preview .cardarea{text-align:center; color:#000; background:#FFF; border:1px groove #66C}
#preview .message{text-align:left; color:#000; margin-left:20px; margin-right:20px}
#preview .from{text-align:right; margin-top:10px}

#cardbutton{position:relative; text-align:center; padding:20px}
#prompt{padding:20px; text-align:center}

/* Idiom */
.strokes{clear:both; width:20px; float:left; position:relative; margin-top:8px; line-height:15pt}
#idiom{clear:both; padding:0 20px; text-align:left; line-height:15pt}
#idiom h3{text-align:center; margin:0 auto 10px}
#idiom P{text-align:justify}
#idiom img{float:left; margin:5px 10px 10px 0; z-index:10; position:relative}
#idiom .divide{margin:20px 0; border-top:1px dashed #99D; overflow:hidden; position:relative}
UL.idioms{margin:0 0 0 25px; padding:8px 0; list-style-type:none; border-top:1px dashed #99D}
*html UL.idioms{height:1%}
UL.idioms:after{content:""; display:block; clear:both; height:0}
UL.idioms LI.zh{margin:0 20px 4px 0; float:left; display:inline; line-height:15pt}
UL.idioms LI.en{margin-bottom:4px}
UL.idioms LI.zh A{font-weight:bold; white-space:nowrap}
#idiomsearch{background:#FC0; padding:3px; text-align:center; color:#000}
#searchresult{margin:3px 15px; background:#FFFFF2}

/* Report */
#report{color:#FFF; position:relative; width:500px; margin:20px auto}

/* Popup E-Songs */
#optionbar{margin:3px 10px; position:relative; color:#FFF}
#songSelection{float:left; text-align:left}
#prevnext{float:right; text-align:right}

/* Coloring Page */
.colorpage{float:left; margin:9px; width:250px}

/* Subscription Page */
#subscriptionForm{text-align:Center}
#subscriptionForm .row{display:table-row; clear:both}
#subscriptionForm .colleft, #subscriptionForm .colright{display:table-cell; padding:4px 0; float:left; position:relative}
#subscriptionForm .colleft{width:140px; font-weight:bold}
#subscriptionForm input{font-size:9pt}
.thumbnail{border-top:1px solid #66C; padding-top:20px}

/* Screen Up */
#screenup{display:none; margin-bottom:40px; background:#666; text-align:center}
A.closescreenup{background:#66C; text-align:center; display:block; text-decoration:none; border-bottom:1px dashed #FFF}

/* Back to Top */
#toTop{font-size:8pt; text-align:right; position:fixed; right:10px; bottom:10px}
#toTop A{display:block; padding:2px 5px; background:#66C; border:1px solid #FFFFEB; white-space:nowrap}
#toTop A:hover{background:#55B; text-decoration:none}
#toTop{/* Netscape 4,IE 4.x-5.0/Win and other lesser browsers will use this */ position:absolute; right:10px; bottom:10px}
body >div#toTop{ /* used by Opera 5+,Netscape6+/Mozilla,Konqueror,Safari,OmniWeb 4.5+,iCab,ICEbrowser */ position:fixed}