topical media & game development

talk show tell print

lib-new-present-files-lightbox-1-.css / css



  #lightbox{
          position: absolute;
          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(../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(../images/prevlabel.gif) left 15% no-repeat; }
  #nextLink:hover, #nextLink:visited:hover { background: url(../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; color: #666; }
  #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;
          }
          
  
  /* Min-Width */
  .lbWidth { /* most browsers */
          position: absolute;
          top: 0px; left: 0px;
          width: 100%;
          min-width: 790px;
          }
  
  * html .lbContent { /* IE6 */
          margin-left: -790px;
          position:relative;
          }
  
  * html .lbMinWidth { /* IE6 */
          padding-left: 790px;
          }
          
          
  /* Clearfix */        
  .clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
  }
  
  .clearfix {display: inline-block;}
  
  /* Hides from IE-mac \*/
  * html .clearfix {height: 1%;}
  .clearfix {display: block;}
  /* End hide from IE-mac */ 
          


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.