/* ###################################################################################################################### # # PURPOSE OF THIS FILE: # Provides the module CSS defintions to be used in the frontend (view.php) # # INVOKED BY: # With WB 2.6.6 a new function was implemented which automatically links an external module frontend.css # file to the section of a page. The frontend.css is optional. If you want make use # of this option, simply place a frontend.css file with the CSS definition into the module directory. # # Website Baker versions below 2.6.6 will ignore this file!!! # The frontend.css is invoked from the index.php of your template if you have added the following PHP code # lines to the index.php of your template: # # ... # # # # NOTE: # All CSS styles, classes... have to stick to the following naming conventions: # mod_MODULE_DIRECTORY_XXXX_f # # mod:shows that the CSS style is defined within a module # MODULE_DIRECTORY:unique identifier to prevent that CSS styles are overwritten by other modules # XXXX:your CSS style definition (e.g. emphasise, warning...) # f:identifier for the frontend # ###################################################################################################################### */ /* CSS definition for Website Baker module:Lightbox Copyright (C) 2007, Christian Thamer Contact me:christian(at)thamer.net, http://www.thamer.net or Tom Schiemer tom(at)switchnap.com This CSS file is free software. You can redistribute it and/or modify it under the terms of the GNU General Public License - version 2 or later, as published by the Free Software Foundation:http://www.gnu.org/licenses/gpl.html. This CSS file is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License for more details. */ /* classes ready for styling definitions tr.lb // for table rows .lb_image //thumbnail image .lb_image_link //the thumbnail links */ table.lb{ margin:0 auto; padding:0; } table.lb td{ width:115px; height:115px; } .lb_image{ background:#eee; border:2px solid #fff; -moz-box-shadow:0px 2px 5px #333; width:100px; margin:0; padding:0; } .lb_image:hover{ width:105px; border:2px solid #fff; margin:0; padding:0; } /* Lightbox slideshow CSS */ #lightbox{ position:absolute; left:0; top:0; width:100%; z-index:100; text-align:center; line-height:0; color:#151410 } #lightbox a{ border-bottom:none; color:#000; text-decoration:none } #lightbox a:hover{ border-bottom:none; color:#ea2224; text-decoration:underline } #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 } #loadingLink { display:block; margin:0 auto; padding:0; width:32px; height:32px; background:url("../../modules/lightbox2/images/loading.gif") center center no-repeat; text-indent:-9999px } #hoverNav{ position:absolute; top:0; left:0; height:100%; width:100%; z-index:10 } #imageContainer>#hoverNav{ left:0} #hoverNav a{ outline:none} #prevLinkImg, #nextLinkImg{ width:49%; height:100%; background:transparent url("../../modules/lightbox2/images/blank.gif") no-repeat; /* Trick IE into showing hover */ display:block; text-indent:-9999px } #prevLinkImg { left:0; float:left} #nextLinkImg { right:0; float:right} #prevLinkImg:hover, #prevLinkImg:visited:hover { background:url("../../modules/lightbox2/images/prevlabel.gif") left 15% no-repeat } #nextLinkImg:hover, #nextLinkImg:visited:hover { background:url("../../modules/lightbox2/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 } #imageDetails{ width:70%; float:left; text-align:left } #caption{ font-weight:700;font-size:14px } #numberDisplay{ display:block; clear:left } #detailsNav{ display:block; clear:left; padding:0 0 10px } #prevLinkDetails { margin:0 8px 0 0 } #nextLinkDetails { margin:0 8px 0 0 } #closeLink { display:block; margin:0; padding:0 0 10px; text-decoration:none; float:right; width:66px; height:28px; background:url("../../modules/lightbox2/images/closelabel.gif") no-repeat; text-indent:-9999px; overflow:hidden } #overlay{ position:absolute; top:0; left:0; z-index:90; width:100%; height:500px; background-color:#151410; 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 */ }