/* Album Module CSS for default, ImageGallery, and Thickbox templates */ /* Used for categories to make things clear correctly */ .album_content { width:100%; float:left; } .clear { clear:both } /* Album List UL */ .albumlist { margin-left:0; padding-left:0; float:left; } /* Picture List UL */ .picturelist { margin-left:0; padding-left:0; color: #333333; } /* Album and Picture Lists */ .thumb { padding:0; width:130px; margin:0 0.5em 0.5em 0; /* Thumbnail spacing */ text-decoration:none; line-height:normal; list-style-type:none; text-align:center; float:left; } .thumb a { display:block; width:120px; /* Thumb width*/ width: 117px; padding: 3px; /* Thumb height*/ height: 117px; /* Thumb padding to form thumb frame */ /* You can set the above to 0px = no frame - but no hover indication!*/ margin:0; background-color:grey; /*Background of thumb */ border-top:1px solid #eee; /* Borders of thumb frame */ border-right:2px solid #ccc; border-bottom:2px solid #ccc; border-left:1px solid #eee; text-decoration:none; } .albumcomment { text-align: left; } .thumb a:visited img { background-color:#eee; /*Background of thumb on hover - sort of a light grey */ } .thumb a:hover img { background-color:#FFFFFF; /*Background of thumb on hover - sort of light blue/green */ } /* Styling of text and navigation for Album */ .albumname { font-size:smaller; text-align:center; font-weight:bold; font-style:normal; } .albumname a { display: inline; border: none; margin:none; padding:none; background-color:transparent; } .albumpicturecount { font-size:smaller; text-align:center; font-weight:normal; font-style:italic; } .albumcomment { text-align:center; font-weight:normal; font-style:normal; } .albumnav { text-align:center; font-weight:normal; font-style:normal; font-size:smaller; } .instructiontext { font-weight:normal; font-style:normal; font-size:smaller; font-style:italic; } /* Big Picture */ .bigpicture { padding:0.5em 0 0; clear:left; border-top:1px solid #ccc; text-align:center; } .bigpicturecaption { /* Big picture caption */ text-align:center; margin:0 0 5px; padding:0; } .bigpicture img { /* Big picture settings */ padding:18px; /* Image padding to form photo frame. */ width:80%; /* Width of big picture - set to auto for actual width*/ margin:0; background-color:white; /* Background of picture */ border-top:1px solid #eee; /* Borders of picture frame */ border-right:2px solid #ccc; border-bottom:2px solid #ccc; border-left:1px solid #eee; text-decoration:none; } .bigpicturenav { margin:0; padding:0; color:#000; font-size:smaller; line-height:normal; } /*Thickbox CSS */ /* ----------------------------------------------------------------------------------------------------------------*/ /* ---------->>> global settings needed for thickbox <<<-----------------------------------------------------------*/ /* ----------------------------------------------------------------------------------------------------------------*/ /* Already done in main CMSMS stylesheet. Commenting out. */ /* *{padding: 0; margin: 0;} */ /* ----------------------------------------------------------------------------------------------------------------*/ /* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/ /* ----------------------------------------------------------------------------------------------------------------*/ #TB_window { font: 12px Arial, Helvetica, sans-serif; color: #333333; } #TB_secondLine { font: 10px Arial, Helvetica, sans-serif; color:#666666; } #TB_window a:link {color: #666666;} #TB_window a:visited {color: #666666;} #TB_window a:hover {color: #000;} #TB_window a:active {color: #666666;} #TB_window a:focus{color: #666666;} /* ----------------------------------------------------------------------------------------------------------------*/ /* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/ /* ----------------------------------------------------------------------------------------------------------------*/ #TB_overlay { position: fixed; z-index:100; top: 0px; left: 0px; background-color:#000; filter:alpha(opacity=75); -moz-opacity: 0.75; opacity: 0.75; height:100%; width:100%; } * html #TB_overlay { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); } #TB_window { position: fixed; background: #ffffff; z-index: 102; color:#000000; display:none; border: 4px solid #525252; text-align:left; top:50%; left:50%; } * html #TB_window { /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); } #TB_window img#TB_Image { display:block; margin: 15px 0 0 15px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; border-top: 1px solid #666; border-left: 1px solid #666; } #TB_caption{ height:25px; padding:7px 30px 10px 25px; float:left; } #TB_closeWindow{ height:25px; padding:11px 25px 10px 0; float:right; } #TB_closeAjaxWindow{ padding:7px 10px 5px 0; margin-bottom:1px; text-align:right; float:right; } #TB_ajaxWindowTitle{ float:left; padding:7px 0 5px 10px; margin-bottom:1px; } #TB_title{ background-color:#e8e8e8; height:27px; } #TB_ajaxContent{ clear:both; padding:2px 15px 15px 15px; overflow:auto; text-align:left; line-height:1.4em; } #TB_ajaxContent.TB_modal{ padding:15px; } #TB_ajaxContent p{ padding:5px 0px 5px 0px; } #TB_load{ position: fixed; display:none; height:13px; width:208px; z-index:103; top: 50%; left: 50%; margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */ } * html #TB_load { /* ie6 hack */ position: absolute; margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px'); } #TB_HideSelect{ z-index:99; position:fixed; top: 0; left: 0; background-color:#fff; border:none; filter:alpha(opacity=0); -moz-opacity: 0; opacity: 0; height:100%; width:100%; } * html #TB_HideSelect { /* ie6 hack */ position: absolute; height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px'); } #TB_iframeContent{ clear:both; border:none; margin-bottom:-1px; margin-top:1px; _margin-bottom:1px; } /* CSS for Lightbox follows */ #lightbox{ position: absolute; top: 40px; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; } #lightbox a img{ border: none; } #outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; } #imageContainer{ padding: 10px; } #loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; } #hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; } #imageContainer>#hoverNav{ left: 0;} #hoverNav a{ outline: none;} #prevLink, #nextLink{ width: 49%; height: 100%; background: transparent url(../templates/db/lightbox/images/blank.gif) no-repeat; /* Trick IE into showing hover */ display: block; } #prevLink { left: 0; float: left;} #nextLink { right: 0; float: right;} #prevLink:hover, #prevLink:visited:hover { background: url(../templates/db/lightbox/images/prevlabel.gif) left 15% no-repeat; } #nextLink:hover, #nextLink:visited:hover { background: url(../templates/db/lightbox/images/nextlabel.gif) right 15% no-repeat; } #imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; } #imageData{ padding:0 10px; } #imageData #imageDetails{ width: 70%; float: left; text-align: left; } #imageData #caption{ font-weight: bold; } #imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; } #imageData #bottomNavClose{ width: 66px; float: right; padding-bottom: 0.7em; } #overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; filter:alpha(opacity=60); -moz-opacity: 0.6; opacity: 0.6; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } * html>body .clearfix { display: inline-block; width: 100%; } * html .clearfix { /* Hides from IE-mac \*/ height: 1%; /* End hide from IE-mac */ } /* Last-Modified: 28/06/06 00:08:22 */ #GB_overlay { background-color: #000; position: absolute; margin: auto; top: 0; left: 0; z-index: 100; } #GB_window { left: 0; top: 0; font-size: 1px; position: absolute; overflow: visible; z-index: 150; } #GB_window .content { width: auto; margin: 0; padding: 0; } #GB_frame { border: 0; margin: 0; padding: 0; overflow: auto; white-space: nowrap; } .GB_Gallery { margin: 0 22px 0 22px; } .GB_Gallery .content { background-color: #fff; border: 3px solid #ddd; } .GB_header { top: 10px; left: 0; margin: 0; z-index: 500; position: absolute; border-bottom: 2px solid #555; border-top: 2px solid #555; } .GB_header .inner { background-color: #333; font-family: Arial, Verdana, sans-serif; padding: 2px 20px 2px 20px; } .GB_header table { margin: 0; width: 97%; border-collapse: collapse; } .GB_header .caption { text-align: left; color: #eee; white-space: nowrap; font-size: 20px; } .GB_header .close { text-align: right; } .GB_header .close img { z-index: 500; cursor: pointer; } .GB_header .middle { white-space: nowrap; text-align: center; } #GB_middle { color: #eee; } #GB_middle img { cursor: pointer; vertical-align: middle; } #GB_middle .disabled { cursor: default; } #GB_middle .left { padding-right: 10px; } #GB_middle .right { padding-left: 10px; } .GB_Window .content { background-color: #fff; border: 3px solid #ccc; border-top: none; } .GB_Window .header { border-bottom: 1px solid #aaa; border-top: 1px solid #999; border-left: 3px solid #ccc; border-right: 3px solid #ccc; margin: 0; height: 22px; font-size: 12px; padding: 3px 0; color: #333; } .GB_Window .caption { font-size: 12px; text-align: left; font-weight: bold; white-space: nowrap; padding-right: 20px; } .GB_Window .close { text-align: right; } .GB_Window .close span { font-size: 12px; cursor: pointer; } .GB_Window .close img { cursor: pointer; padding: 0 3px 0 0; } .GB_Window .on { border-bottom: 1px solid #333; } .GB_Window .click { border-bottom: 1px solid red; } /* Start of CMSMS style sheet '02.1 Gallery CMotion horizontal' */ /* CMOTION GALLERY */ /* Please check gallerystyle.css and motiongallery.js for double-/hard-codings! */ div.largeview { text-align: center; } #motioncontainer { margin-top: 5px; height: 70px; /* according to gallery height */ width: 99.99%; } #motioncontainer a img { border: 0; /* Set image border color */ margin: 0; /* chage this if you want some air inbetween images*/ height: 60px; width:auto; } /* change cursor when clicking on image */ /*#motioncontainer a:active img { cursor: progress; }*/ #statusdiv { background-color: #fff; color: #FFBF00;/*#8f8f8f;*/ font-size: 65%; font-weight: bold; border: 0px solid #afafaf; padding: .1em; width: 100px; position: absolute; /* Stop Editing Gallery Styles */ top: -10px; left: 0px; visibility: hidden; } #motioncontainer a:hover { color: red; /* Dummy definition to overcome IE bug */ } /* Those are already set in the template using the "style"-tag for both of the divs. It seems to work only this way - if someone could tell me why, I'll appreciate! */ /* div#motioncontainer { position:relative; overflow:hidden; } div#motiongallery { position:absolute; left:0; top:0; white-space: nowrap; }*/ /* END CMOTION GALLERY */ /* End of '02.1 Gallery CMotion horizontal' */