/** * Gallery 3 Grey Dragon Theme * Copyright (C) 2006-2010 Serguei Dosyukov * * CSS rules - Kitchen sync * * Color rules for font/background/lines can be found in dedicated colorpack files */ @import url(layout.css); @import url(menus.css); @import url(forms.css); @import url(modules.css); /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* screen.css - Common ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ body { font-family: Arial, verdana, sans-serif; font-size: 0.9em; } a { text-decoration: none; outline: none; -moz-outline-style: none; } a:focus, a:active, a:hover { text-decoration: none; outline: none; } img { border: none; } p { text-indent: 0; } ul { list-style: none none; } h1 { font-weight: bold; font-size: 1.1em; padding-bottom: 1px; } h2 { font-weight: bold; font-size: 1.1em; } h3 { font-weight: bold; } h4 { font-weight: bold; } h5 { font-weight: bold; } .txtright { text-align: right; } .g-metadata { overflow: hidden; } .g-avatar { float: right; } .ui-icon { display: inline-block; zoom: 1; width: 16px; height: 15px; } .ui-icon-first { background-position: -162px -178px; } .ui-icon-first-d { background-position: -162px -162px; } .ui-icon-prev { background-position: -178px -178px; } .ui-icon-prev-d { background-position: -178px -162px; } .ui-icon-parent { background-position: -226px -178px; } .ui-icon-parent-d { background-position: -226px -162px; } .ui-icon-next { background-position: -194px -178px; } .ui-icon-next-d { background-position: -194px -162px; } .ui-icon-last { background-position: -210px -178px; } .ui-icon-last-d { background-position: -210px -162px; } .ui-icon-signal-diag { background-position: -16px -178px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-plus { background-position: -14px -129px; } .ui-icon-minus { background-position: -46px -129px; } .ui-icon-note { background-position: -66px -98px; } .ui-icon-comment { background-position: -227px -219px; width: 27px; height: 20px; } .ui-icon-left .ui-icon { float: left; margin-right: .2em; } .ui-icon-right .ui-icon { float: right; margin-left: .2em; } /* screen.css - Header ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #g-header { height: 90px; padding: 0; font-size: 0.9em; } #g-logo { position: absolute; top: 8px; left: 16px; } .g-breadcrumbs { position: absolute; bottom: 4px; background-color: transparent; } .g-breadcrumbs.default { right: 14px; } .g-breadcrumbs.left { left: 304px; padding-left: 0; } .g-breadcrumbs li { display: inline; padding-left: 1em; padding-right: 0.4em; } .g-breadcrumbs li.g-first { background-image: none; } .g-breadcrumbs li.g-active { padding-right: 0; } #g-header .g-message-block { position: absolute; z-index: 10; min-width: 30em; padding: 4px 6px; right: 20em; top: 34px; overflow: hidden; font: bold 9pt Arial, verdana, sans-serif; text-align: center; } #g-header #g-login-menu { position: absolute; top: 0.5em; right: 1em; background-color: transparent; display: none; } /* screen.css - Main ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #g-main { display: block; margin: 0; } #g-main-in { display: block; position: relative; } #g-column-center, #g-column-centerleft { padding: 6px 6px 6px 16px; } #g-column-centerfull { padding: 6px 12px 6px 10px; } #g-column-centerright { padding: 6px 12px 6px 6px; } #g-column-left { padding: 6px 4px 6px 10px; } #g-column-right { padding: 6px 10px 6px 4px; } /* screen.css - Footer ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #g-footer { padding: 6px 6px 6px 14px; zoom: 1; font-size: 0.9em; } #g-footer ul { float: left; padding: 0; text-align: left; } #g-footer li { padding: 0 0 2px 0; } #g-footer #g-login-menu { position: absolute; bottom: 0.5em; right: 1em; background-color: transparent; display: none; } #g-login-menu li { display: inline; padding-left: 1.2em; } #g-logout-link { float: none; margin-right: 0; } #g-copyright { font-size: x-small; } #g-footer #g-footer-rightside { float: right; padding-right: 6px; text-align: right; } #g-credits { margin-right: 14px; } /* screen.css - Pagination ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ .g-paginator { display: inline-block; width: 100%; padding: 4px 0 0 0; zoom: 1; } .g-paginator li { display: inline; float: left; margin-left: 0; zoom: 1; } .g-paginator a { padding: 0 0 0 2px; } .g-paginator .g-pagination { width: 80%; font-size: 0.8em; } .g-paginator .g-navigation { text-align: right; width: 20%; } /* screen.css - Album grid ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #g-album-grid { padding: 6px 0 0 0; width: 100%; display: inline-block; } #g-album-grid .g-item { position: relative; float: left; margin: 4px 0; min-width: 212px; width: 33%; zoom: 1; } /* amargin-right: 10px; */ #g-album-grid .g-extra-column { width: 23%; } #g-album-grid .g-item p { text-align: center; } #g-album-grid h2 { position: absolute; top: 164px; left: 12px; width: 150px; font: 100%/100% Arial, Helvetica, sans-serif; } #g-album-grid h2 a { display: block; margin-top: 4px; font: bold 0.8em Arial, Helvetica, Verdana, Sans-Serif; letter-spacing: 0.1em; text-transform: uppercase; min-height: 2em; } /* screen.css - Thumbs : Common ~~~~~~~~~~~~~~~~~~~~~~~~*/ .g-thumbcrop { overflow: hidden; position: relative; width: 200px; min-height: 133px; } .g-thumbtype-flm .g-thumbcrop { height: 150px; } .g-thumbtype-dgt .g-thumbcrop { height: 133px; } .g-thumbtype-sqr .g-thumbcrop { height: 200px; } .g-album .g-description strong { padding-left: 16px; } /* screen.css - Thumbs : Overlay ~~~~~~~~~~~~~~~~~~~~~~~*/ .g-thumbslide { font-size: 0.9em; width: 208px; min-height: 139px; padding-top: 6px; padding-left: 6px; } .g-thumbslide.g-thumbtype-flm { height: 158px; } .g-thumbslide.g-thumbtype-dgt { height: 141px; } .g-thumbslide.g-thumbtype-sqr { height: 208px; } .g-thumbcrop a.g-thumlink { display: block; position: relative; } .g-thumbslide .g-thumbcrop .g-description { display: none; } .g-thumbslide:hover .g-description { display: block; position: absolute; top: 0; min-height: 32px; width: 100%; overflow: hidden; z-index: 3; font-weight: bold; font-size: 0.9em; letter-spacing: 0.1em; text-transform: uppercase; text-align: left; } .g-thumbslide:hover .g-description strong { display: block; margin-left: 10px; padding-top: 2px; } .g-album .g-thumbslide:hover .g-description strong { padding-left: 16px; } .g-thumbslide .g-description strong { display: block; margin-left: 10px; padding-top: 2px; } .g-thumbslide .g-metadata { display: none; } .g-thumbslide:hover .g-metadata { display: block; position: absolute; bottom: 7px; margin: 0 0 1px 1px; padding: 2px 4px 2px 6px; width: 190px; } .g-thumbslide:hover .g-metadata li { padding: 0; margin: 0; font-size: 0.9em; } .g-album .g-thumbslide:hover .g-metadata { bottom: 10px; } /* screen.css - Thumbs : Extended View mode ~~~~~~~~~~~~*/ .g-thumbslide-ext { font-size: 0.9em; width: 208px; min-height: 139px; padding-top: 6px; padding-left: 6px; } .g-thumbslide-ext.g-thumbtype-flm { height: 188px; } .g-thumbslide-ext.g-thumbtype-dgt { height: 171px; } .g-thumbslide-ext.g-thumbtype-sqr { height: 238px; } .g-thumbslide-ext .g-description { display: block; margin-top: 2px; width: 200px; overflow: hidden; font-weight: bold; font-size: 0.9em; letter-spacing: 0.1em; text-transform: uppercase; text-align: left; } .g-thumbslide-ext .g-description strong { display: block; } .g-album .g-thumbslide-ext .g-description strong { padding-left: 24px; } .g-thumbslide-ext .g-metadata { display: none; } .g-thumbslide-ext:hover .g-metadata { display: block; position: absolute; bottom: 37px; margin: 0 0 1px 1px; padding: 2px 4px 2px 6px; width: 190px; } .g-thumbslide-ext:hover .g-metadata li { padding: 0; margin: 0; font-size: 0.9em; } .g-album .g-thumbslide-ext:hover .g-metadata { bottom: 40px; } /* screen.css - Photo ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ #g-item { float: left; height: 100%; width: 100%; } #g-photo { padding: 6px 0 6px 6px; text-align: center; float: left; height: 100%; width: 100%; } div.g-resize { position: relative; left: 50%; float: left; padding: 5px; font-size: 0.9em; } div.g-resize>a { float: left; overflow: hidden; } div.g-resize>a img { float: left; } div.g-resize .g-description { display: none; } div.g-resize:hover .g-description { position: absolute; display: block; top: 0px; margin-top: 5px; text-align: left; padding: 10px; } div.g-resize:hover .g-description strong { display: block; margin-bottom: 5px; text-transform: uppercase; } div.g-resize .g-more { display: block; position: absolute; right: 16px; top: 16px; padding: 4px 8px; } div.g-resize:hover .g-more { display: none; visibility: hidden; } .ul-table { text-align: center; margin: 0px auto; padding: 0; list-style-type: none; clear: both; } .ul-table li { float: left; text-align: center; } #g-info { display: inline-block; width: 100%; } #g-info .g-description { margin-top: 4px; margin-bottom: 4px; padding: 4px; } #g-movie { padding: 6px 0 6px 6px; position: relative; } .g-movie { margin: 0 auto; } #g-albumheader h1 { margin-bottom: 6px; } .g-description .g-metadata { padding: 0.4em 0 0 0; font-size: 0.8em; } .g-description .g-metadata li { display: inline; padding-right: 1em; } /* screen.css - Sidebar ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/ /* screen.css - Sidebar : Common ~~~~~~~~~~~~~~~~~~~~~~~*/ .g-block { margin-bottom: 4px; padding-bottom: 4px; position: relative; } .g-block h2 { padding: 4px 4px 4px 8px; font-size: 1em; } .g-block-content { margin: 4px 6px 0 6px; display: block; zoom: 1; } /* screen.css - Sidebar : Buttons ~~~~~~~~~~~~~~~~~~~~~~*/ #g-viewformat { z-index: 5; position: absolute; padding: 0; top: 6px; right: 10px; } #g-viewformat li { float: left; margin-right: 2px; } #g-viewformat span { line-height: 1px; text-indent: -900em; width: 17px; display: block; height: 15px; } #g-viewformat span:hover, #g-viewformat span.g-viewthumb-current { background-position: left bottom; } #g-view-menu { position: absolute; top: 6px; right: 70px; height: 16px; z-index: 5; zoom: 1; margin: 0 0 6px 0; padding: 0 0 4px 0; } #g-view-menu.g-buttonset-shift { right: 6px; } .g-toolbar { height: 1.1em; zoom: 1; margin: 0 0 4px 0; padding: 1px 0 3px 0; } .g-menu { margin: 0; padding: 0; text-align: left; } .g-menu li { display: inline; } .g-menu-element, .g-menu-link { display: inline; float: left; margin-right: 4px; } .g-buttonset .g-menu-link { text-indent: -99999px; width: 22px; height: 15px; } #g-slideshow-link:hover, .g-fullsize-link:hover, #g-exifdata-link:hover { background-position: left bottom; } /* screen.css - Reauthentificate ~~~~~~~~~~~~~~~~~~~~~~ */ #g-reauthenticate-form fieldset { border: none; width: 260px; } #g-reauthenticate-form ul { padding: 8px; } #g-reauthenticate-form li { padding-top: 8px; } #g-reauthenticate-form label { display: block; } #g-reauthenticate-form input[type="password"] { width: 98%; }