/*------------------------------------------------------------------- layout.css for default design - Thickbox Gallery 2 Copyright (c) 2006-2009 Yuji Takenaka Licensed under the MIT: http://www.opensource.org/licenses/mit-license.php -------------------------------------------------------------------*/ /* General Design and Layout */ body { margin: 7px 0 7px 0; padding: 0; font-family: verdana, tahoma, sans-serif; background-color: #000000; color: #D7D7D7; } a { color: #c00; text-decoration: none; } a:hover { color: #D7D7D7; text-decoration:underline; } img { border: none; } div, p, form { margin: 0; padding: 0; } /* CSS for Contents */ /* Container Design and Layout */ #container { background-color: #212121; width: 800px; margin: 0 auto; } /* Rounded Corners */ b.rtop, b.rbottom { display:block;background: #000000; } b.rtop b, b.rbottom b { display:block;height: 1px; overflow: hidden; background: #c00; } b.r1 { margin: 0 5px; } b.r2 { margin: 0 3px; } b.r3 { margin: 0 2px; } b.rtop b.r4, b.rbottom b.r4 { margin: 0 1px;height: 2px; } /* Header Design and Layout */ #header { height: 90px; width: 800px; } #header h1 { margin: 10px 10px 10px 15px; padding: 0; font-size: 150%; color: #D7D7D7;} #header h1 a { color: #D7D7D7; } #header h1 a:hover { color: #D7D7D7; text-decoration:underline; } #header h2 { margin: 10px 5px 0 25px; padding: 0; font-size: 90%; font-weight: normal; color: #D7D7D7;} /* Wrapper Box Design and Layout */ #wrapper { float: left; width: 100%; } /* Sidebar Design and Layout */ #side { background-color: #000000; float: left; width: 220px; margin-left: -235px; overflow: auto; } #tbg-tree{ font-size: 13px; font-family: Arial, sans-serif; margin: 7px 5px 10px 5px; } #tbg-js-selector-box{ height: 25px; margin: 7px 0 10px 5px; padding-left: 20px; background: url("../../icon/selector.png") 0 3px no-repeat; } #side h4 { margin: 0; padding: 3px 0 2px 5px; font-size: 88%; font-weight: bold; background-color: #c00; color: #FFF; } #side .tbg-random-pick { padding-top: 13px; } #side .tbg-random-out { background: #BBB; border: 1px solid #DDD; margin: 5px auto; } #side .tbg-random-in { background: #FFF; border: 1px solid #555; position: relative; padding: 5px; left: -5px; top: -5px; } /* Main Box Design and Layout */ #main { width: 550px; margin-right: 235px; padding-left: 10px; } .innerbox { margin: 0; margin-top: 0; } #tbg-page-navigation, #tbg-album-navigation { clear: both; text-align: center; font-size: 80%; margin: 3px auto 10px auto; } #container .tbg-warning { font-size: 12px; font-weight: bold; color: #FF0000; margin: 2px 15px 10px 15px; } #main .tbg-random-out { background: #BBB; border: 1px solid #9BD1FA; margin: 5px auto; } #main .tbg-random-in { background: #FFF; border: 1px solid #555; position: relative; padding: 5px; left: -5px; top: -5px; } .tbg-button { width: auto; font-family: tahoma, sans-serif; font-size: 11px; height: 21px; } .tbg-text { width: 150px; font-family: arial, sans-serif; font-size: 13px; } .file { font-family: arial, sans-serif; } .bold { font-weight: bold; } .right { text-align: right; } /* Image Table Design & Layout */ #tbg-grid { margin: 0; padding: 0; list-style: none; } .tbg-grid-item { float: left; display: block; padding-right: 7px; padding-bottom: 15px; } .tbg-functions { position: absolute; display: none; z-index: 7; background-color: White; width: 128px; padding: 3px; border: solid 1px gray; } .tbg-move-dstnum, .tbg-description { margin-top: 2px; border: solid 1px Silver; } .tbg-description { margin-top: 2px; width: 122px; padding-left: 2px; background-color: #FFFFD3; font-style: italic; } .tbg-move-dstnum { width: 126px; } .tbg-func-switch { display: block; position: relative; margin-top: -9px; z-index: 5; cursor: pointer; } .tbg-img-opacity { display: block; font-size: 9px; border: 5px solid #FFF; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; } .tbg-thumbnail, .tbg-album { position: relative; display: block; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; z-index: 1; } .tbg-thumbnail:hover, .tbg-album:hover { filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; -khtml-opacity: 1; } #tbg-all-albums { clear: both; font-size: 77%; margin-left: 10px; } /* Login Box Design and Layout */ #tbg-login { margin: 0 0 0 15px; padding: 0; } .tbg-login-title{ display: block; width: 100px; font-size: 77%; } .tbg-login-item{ display: block; margin-bottom: 7px; margin-left: 7px; } #tbg-login-submit{ width: 180px; text-align: right; } /* Footer Design and Layout */ #footer { clear: both; width: 800px; margin: 10px 0 5px 0; padding-bottom: 3px; font-size: 80%; text-align: center; } #footer .warning { text-align: center; } #tbg-upload-form { margin: 10px 0 7px 0; } #tbg-upload { width: 250px; font-family: arial, sans-serif; font-size: 88%; height: 21px; } #tbg-features { margin-top: 2px; } /* CSS for Image Effects */ /* For HighslideJS */ .highslide { cursor: url("../../js/highslide/graphics/zoomin.cur"), pointer; outline: none; } .highslide-image { border: 2px solid white; } .highslide-caption { display: none; color: #000000; text-align: left; border: 2px solid white; border-top: none; font-family: Verdana, Helvetica; font-size: 10pt; padding: 5px; background-color: white; } .highslide-loading { display: block; color: white; font-size: 9px; font-weight: bold; text-transform: uppercase; text-decoration: none; padding: 3px; border-top: 1px solid white; border-bottom: 1px solid white; background-color: black; } a.highslide-credits, a.highslide-credits i { padding: 2px; color: silver; text-decoration: none; font-size: 10px; } a.highslide-credits:hover, a.highslide-credits:hover i { color: white; background-color: gray; } .highslide-move { cursor: move; } .highslide-overlay { display: none; } .controlbar { margin-left: 60px; background: url("../../js/highslide/graphics/controlbar2.gif"); width: 210px; height: 32px; } .controlbar a { display: block; float: left; margin: 0 0 0 5px; height: 30px; width: 42px; } .highslide-display-block { display: block; } .highslide-display-none { display: none; } /* For SmoothGalleryJS */ #myGallery { width: 500px !important; height: 334px !important; margin: 7px auto 10px auto; text-align: center; } /* For FrogJS */ #FrogJS { width: 500px; height: 450px; margin: 0 auto; } #FrogJSCredit { text-align: right; font-size: 80%; color: #999; padding: 1px; } #FrogJSCaption { text-align: left; font-size: 80%; line-height: 125%; } /* For Ligitview */ .lightview { position: relative; display: block; filter: alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5; -khtml-opacity: 0.5; z-index: 1; } .lightview:hover { filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; -khtml-opacity: 1; } /* CSS for Yahoo! UI TreeView */ .ygtvtn { width:16px; height:22px; background: transparent url("../../icon/tn.gif") 0 0 no-repeat; } .ygtvtm { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/tm.gif") 0 0 no-repeat; } .ygtvtmh { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/tmh.gif") 0 0 no-repeat; } .ygtvtp { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/tp.gif") 0 0 no-repeat; } .ygtvtph { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/tph.gif") 0 0 no-repeat; } .ygtvln { width:16px; height:22px; background: transparent url("../../icon/ln.gif") 0 0 no-repeat; } .ygtvlm { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/lm.gif") 0 0 no-repeat; } .ygtvlmh { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/lmh.gif") 0 0 no-repeat; } .ygtvlp { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/lp.gif") 0 0 no-repeat; } .ygtvlph { width:16px; height:22px; cursor:pointer; background: transparent url("../../icon/lph.gif") 0 0 no-repeat; } .ygtvloading { width:16px; height:22px; background: transparent url("../../icon/loading.gif") 0 0 no-repeat; } .ygtvdepthcell { width:16px; height:22px; background: transparent url("../../icon/vline.gif") 0 0 no-repeat; } .ygtvblankdepthcell { width:16px; height:22px; } .ygtvitem { } .ygtvchildren { } * html .ygtvchildren { height:2%; } .ygtvlabel, .ygtvlabel:link, .ygtvlabel:visited, .ygtvlabel:hover { margin-left:2px; } .ygtvspacer { height: 22px; width: 16px; } .icon-album { display:block; padding-left: 20px; background: transparent url("../../icon/album.png") 0 0 no-repeat; } .icon-feed { display:block; padding-left: 20px; background: transparent url("../../icon/feed.png") 0 0 no-repeat; } .icon-action { display:block; padding-left: 20px; background: transparent url("../../icon/action.png") 0 0 no-repeat; } .icon-admin { display:block; padding-left: 20px; background: transparent url("../../icon/admin.png") 0 0 no-repeat; } .icon-front { display:block; padding-left: 20px; background: transparent url("../../icon/front.png") 0 0 no-repeat; }