/* CSS Document */ @charset "utf-8"; /* For Language switch ( This CSS is for English ) */ /* For All Pages */ body { text-align:center; background-color:#CCCCCC; font-family:Arial, Helvetica, sans-serif; color:#333333; } h1 { height:87px; padding:87px 0px 0px 0px; margin:50px 0px 0px 50px; background-image:url(images/taklogo.gif); background-repeat:no-repeat; overflow:hidden; height:0px;} h2 { height:29px; padding:29px 0px 0px 0px; margin:0px 0px 0px 273px; background-image:url(images/welcomemsg.gif); background-repeat:no-repeat; overflow:hidden; height:0px; } #container { width:900px; height:620px; background-image:url(images/skectchpad.gif); background-repeat:no-repeat; margin-left:auto; margin-right:auto; margin-top:30px; } #header { width:900px; height:160px; } #logo { width:685px; height:160px; float:left; } #info {width:625px; height:15px; padding-top:20px; padding-right:55px; text-align:right;} #cinfo {width:625px; height:15px; padding-top:20px; padding-right:55px; } #purpleline {width:630px; height:10px; padding-right:50px; } #apps { width:215px; height:160px; float:right; } #apps #language { margin-top:105px; } #apps #language li { height:40px; width: 80px; float:left; margin: 0px; padding: 0px; list-style-type:none; } #apps #language li a { background-image:url(images/languagebar.gif); background-repeat:no-repeat; width:80px; height:0px; padding:40px 0px 0px 0px; margin:0px; float:left; overflow:hidden; } #apps #language li#chinese a { background-position: 0 0 } #apps #language li#english a { background-position: -80px 0 } #apps #language li#chinese a:hover { background-position: 0 -40px } #apps #language li#english a:hover { background-position: -80px -40px } #apps #clanguage { margin-top:105px; display:none;} #apps #clanguage li { height:40px; width: 80px; float:left; margin: 0px; padding: 0px; list-style-type:none; } #apps #clanguage li a { background-image:url(images/clanguagebar.gif); background-repeat:no-repeat; width:80px; height:0px; padding:40px 0px 0px 0px; margin:0px; float:left; overflow:hidden; } #apps #clanguage li#english a { background-position: 0 0 } #apps #clanguage li#chinese a { background-position: -80px 0 } #apps #clanguage li#english a:hover { background-position: 0 -40px } #apps #clanguage li#chinese a:hover { background-position: -80px -40px } #main { width:900px; height:440px; } #controls {width:630px; text-align:right; float:right; } /* For Navigation only */ #nav { width:220px; height:440px; float:left; } #navbar { margin-top:10px; } #navbar li { height:40px; width: 150px; float:left; margin: 0px; padding: 0px; list-style-type:none; } #navbar li a { background-image:url(images/navbar.gif); background-repeat:no-repeat; width:150px; height:0px; padding:40px 0px 0px 0px; margin:0px; float:left; overflow:hidden; } #navbar li#home a { background-position: 0 0 } #navbar li#news a { background-position: 0 -40px } #navbar li#about a { background-position: 0 -80px } #navbar li#books a { background-position: 0 -120px } #navbar li#exhibition a { background-position: 0 -160px } #navbar li#gallery a { background-position: 0 -200px } #navbar li#links a { background-position: 0 -240px } #navbar li#guestbook a { background-position: 0 -280px } #navbar li#home a:hover { background-position: -160px 0 } #navbar li#news a:hover { background-position: -160px -40px } #navbar li#about a:hover { background-position: -160px -80px } #navbar li#books a:hover { background-position: -160px -120px } #navbar li#exhibition a:hover { background-position: -160px -160px } #navbar li#gallery a:hover { background-position: -160px -200px } #navbar li#links a:hover { background-position: -160px -240px } #navbar li#guestbook a:hover { background-position: -160px -280px } #navbar li#home a:active { background-position: -320px 0 } #navbar li#news a:active { background-position: -320px -40px } #navbar li#about a:active { background-position: -320px -80px } #navbar li#books a:active { background-position: -320px -120px } #navbar li#exhibition a:active { background-position: -320px -160px } #navbar li#gallery a:active { background-position: -320px -200px } #navbar li#links a:active { background-position: -320px -240px } #navbar li#guestbook a:active { background-position: -320px -280px } #cnavbar { margin-top:10px; } #cnavbar li { height:40px; width: 150px; float:left; margin: 0px; padding: 0px; list-style-type:none; } #cnavbar li a { background-image:url(images/cnavbar.gif); background-repeat:no-repeat; width:150px; height:0px; padding:40px 0px 0px 0px; margin:0px; float:left; overflow:hidden; } #cnavbar li#chome a { background-position: 0 0 } #cnavbar li#cnews a { background-position: 0 -40px } #cnavbar li#cabout a { background-position: 0 -80px } #cnavbar li#cbooks a { background-position: 0 -120px } #cnavbar li#cexhibition a { background-position: 0 -160px } #cnavbar li#cgallery a { background-position: 0 -200px } #cnavbar li#clinks a { background-position: 0 -240px } #cnavbar li#cguestbook a { background-position: 0 -280px } #cnavbar li#chome a:hover { background-position: -160px 0 } #cnavbar li#cnews a:hover { background-position: -160px -40px } #cnavbar li#cabout a:hover { background-position: -160px -80px } #cnavbar li#cbooks a:hover { background-position: -160px -120px } #cnavbar li#cexhibition a:hover { background-position: -160px -160px } #cnavbar li#cgallery a:hover { background-position: -160px -200px } #cnavbar li#clinks a:hover { background-position: -160px -240px } #cnavbar li#cguestbook a:hover { background-position: -160px -280px } #cnavbar li#chome a:active { background-position: -320px 0 } #cnavbar li#cnews a:active { background-position: -320px -40px } #cnavbar li#cabout a:active { background-position: -320px -80px } #cnavbar li#cbooks a:active { background-position: -320px -120px } #cnavbar li#cexhibition a:active { background-position: -320px -160px } #cnavbar li#cgallery a:active { background-position: -320px -200px } #cnavbar li#clinks a:active { background-position: -320px -240px } #cnavbar li#cguestbook a:active { background-position: -320px -280px } /* For Index only */ #welcome { width:625px; height:95px; text-align:right; padding-right:50px; padding-top:20px; font-size:12px; } #cwelcome { width:625px; height:95px; text-align:right; padding-right:50px; padding-top:20px; font-size:12px; } /* For News only */ #latest { width:385px; height:330px; text-align:justify; font-size:12px; margin-left:2px; float:left; padding-right:10px; overflow-x:hidden; overflow:auto; scrollbar-arrow-color: blue; scrollbar-face-color: #FFFFFF; scrollbar-3dlight-color: #a0a0a0; scrollbar-darkshadow-color:#888888; color:#666666;} #newstop {width:680px; height:20px; float:left;} #newslist { width:233px; height:300px; text-align:justify; font-size:12px; float:left; } .newsnum {width:220px; height:66px; padding-left:10px; padding-right:10px; text-align:left; } .newsnum a:link { color:#FF6600;} .newsnum a:hover { color:#FF6600; } .newsnum a:active { color:#FF6600; } .newsnum a:visited { color:#FF6600;} .newstitle {color:#0099FF; font-weight:bold; text-align:left;} #newsbutton {width:150px; height:30px; float:right; padding-right:50px;text-align:right; } #news ul{ text-decoration:none; float:right;} #news li{ float:right;} #news #info h2 { height:12px; width:35px; padding:12px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ionews.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #news #cinfo h2 { height:20px; width:68px; padding:20px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/cionews.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } /* For About only */ #takprofile { width:625px; height:115px; padding-right:50px; padding-top:20px; text-align:justify; font-size:12px; margin-left:5px; color:#666666; } #about #info h2 { height:14px; width:80px; padding:14px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ioabout.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #about #cinfo h2 { height:19px; width:70px; padding:19px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/cioabout.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } /* For Book only */ #newbook { width:630px; height:175px; padding-right:50px; padding-top:10px; } #newbookpic { width:175px; height:175px; float:left; text-align:left; padding-left:5px; } #newbookinfo { width:450px; height:175px; float:right; text-align:left; } #newbookinfo1 { width:80px; height:105px; float:left; font-size:12px; } #newbookinfo2 { width:370px; height:115px; float:right; font-size:12px; text-align:left; } #newbookinfo3 { width:450px; height:60px; float:right; font-size:12px; color:#666666; } #otherbook{ width:630px; height:100px; padding-right:50px; padding-top:10px; } #book #info h2 { height:13px; width:115px; padding:13px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/iobook1.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #book #cinfo h2 { height:18px; width:63px; padding:18px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ciobook1.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #bookcollection #info h2 { height:13px; width:130px; padding:14px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/iobook2.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #bookcollection #cinfo h2 { height:18px; width:64px; padding:18px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ciobook2.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } /* For Gallery only */ #gallery { width:630px; height:330px; padding-right:50px; padding-top:10px; } #gallery1 { width:625px; height:300px; text-align:right; letter-spacing:28px; } #gallery2 { width:625px; height:300px; text-align:right; letter-spacing:28px; } #gallery3 { width:625px; height:300px; text-align:right; letter-spacing:28px; } #gallery4 { width:625px; height:300px; text-align:right; letter-spacing:28px; } #controls a {text-decoration:none; color:#FFFFFF; } #controls a:hover { text-decoration:none; color:#FFFFFF; } #controls a:active { text-decoration:none; color:#FFFFFF; } .blankpic { width:130px; height:130px; background-color:#6633FF; } #pageview {width:470px; height:30px; float:left; ; text-align:right; font-size:13px; } #pageno {width:50px; height:30px; float:right; color:#000000; font-weight:bold;} #showpageno {width:15px; height:30px; float:right; color:#000000; font-weight:bold;} #totalpageno {width:80px; height:30px; float:right; color:#000000; font-weight:bold;} #showtotalpageno {width:15px; height:30px; float:right; color:#000000; font-weight:bold;} #cpageview {width:470px; height:30px; float:left; ; text-align:right; font-size:13px; } #pageview ul {text-decoration:none; float:right; font-size:13px; font-weight:bold; } #pageview li {display:inline;} #gallerybutton {width:160px; height:30px; float:right; text-align:right; } #gallerybutton ul{ text-decoration:none; float:right;} #gallerybutton li{ float:right;} #galleryinfo {width:625px; height:15px; padding-top:20px; padding-right:55px; text-align:right;} #gallerycinfo {width:625px; height:15px; padding-top:20px; padding-right:55px; } #galleryinfo h2 { height:13px; width:170px; padding:13px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/iogallery.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #gallerycinfo h2 { height:19px; width:84px; padding:19px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ciogallery.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } /* For Exhibiton only */ #newexhibit { width:630px; height:200px; padding-right:50px; padding-top:10px; } #newexpic { width:280px; height:200px; float:left; text-align:left; } #newexinfo { width:345px; height:200px; float:right; text-align:left; font-size:12px; margin-left:5px; color:#666666; } ul { list-style-type:none; text-align:left;} #otherbook{ width:630px; height:100px; padding-right:50px; padding-top:10px; } #dropmenu { float:left; width:300px; height:30px; padding-top:15px; text-align:left; } #controls { width:330px; height:30px; padding-top:15px; text-align:right;} #controls a {text-decoration:none; color:#FFFFFF; } .scrolltitle { font-size:20px; font-weight:bold; color:#0099FF;} #exhibition #info h2 { height:13px; width:132px; padding:13px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ioexhibition.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #exhibition #cinfo h2 { height:20px; width:65px; padding:20px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/cioexhibition.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } /* For Links only */ #links { width:630px; height:330px; padding-right:50px; padding-top:10px; } #link1 { width:625px; height:300px; display:inline; text-align:center; } #links ul { display:inline; } #links li { display:inline; } #footer { width:900px; height:17px; font-size:10px; text-align:center; padding-top:3px; color:#666666; background-color:#CCCCCC;} .bold {font-weight:bold; } a:link {text-decoration:none; color:#FFFFFF; } a:hover { text-decoration:none; color:#FFFFFF; } a:active { text-decoration:none; color:#FFFFFF; } a:visited { text-decoration:none; color:#FFFFFF; } img { border:none; } .colora { color:#FF3300; } #link #info h2 { height:13px; width:40px; padding:13px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/iolinks.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #link #cinfo h2 { height:19px; width:33px; padding:19px 0px 0px 0px; margin:0px 0px 0px 0px; background-image:url(images/ciolinks.gif); background-repeat:no-repeat; overflow:hidden; height:0px; float:right; } #thumbBox{ /*Outermost DIV for thumbnail viewer*/ position: absolute; left: 0; top: 0; width: auto; padding: 10px; padding-bottom: 0; background: #313131; visibility: hidden; z-index: 10; cursor: hand; cursor: pointer; } #thumbBox .footerbar{ /*Footer DIV of thumbbox that contains "close" link */ font: bold 16px Tahoma; letter-spacing: 5px; line-height: 1.1em; color: white; padding: 5px 0; text-align: right; } #thumbBox #thumbImage{ /*DIV within thumbbox that holds the enlarged image */ background-color: white; } #thumbLoading{ /*DIV for showing "loading" status while thumbbox is being generated*/ position: absolute; visibility: hidden; border: 1px solid black; background-color: #EFEFEF; padding: 5px; z-index: 5; }