/*
Title: Open Lens Productions
Copyright: (c) 2008
Author: Dennis J. Fesemyer
Company: Fezlab
Description: Main Site Controls
*/

/* basics
-------------------------------------------------------- */

a  {
   color: #CC9933;
   text-decoration: none;
   }

   a:hover,
   a:visited:hover {
      color: #CC9933;
      text-decoration: underline;
      }

      a:visited {
         text-decoration: none;
         color: #ab7a18;
         }


p {
   margin: 0 0 15px 0;
   }


strong {
   font-weight: bold;
   }

em {
   font-style: italic;
   }

img {
   display: block;
   border: 0;
   }


hr {
   display: block;
	width: 100%;
	height: 1px;
   border: 0; border-top: 1px solid #ccc;
   }
   
h1 {
   font: normal 15px/20px georgia, serif; color: #fff;
   margin: 0; padding: 0 0 20px 0;
   }
   
h3 {
   font: normal 15px/18px georgia, serif; color: #fff;
   margin: 0; padding: 0;
   }
   
h4 {
   font: bold 12px/15px arial, san-serif; color: #fff;
   margin: 0; padding: 0;
   }
   
h4.clientlist {
   font: bold 12px/15px arial, san-serif; color: #C93;
   margin: 0 0 20px 0; padding: 0;
   border-bottom: 1px solid #333;
   }
   
h5 {
   clear: both;
   font: bold 10px/12px arial, sans-serif; color: #fff;
   text-transform: uppercase;
   margin: 0; padding: 0 0 10px 0;
   }
   
h5.yellow {
   clear: both;
   font: bold 10px/12px arial, sans-serif; color: #CC9933;
   text-transform: uppercase;
   margin: 0; padding: 0 0 30px 0;
   }
   


/* layout
-------------------------------------------------------- */

body {
   background: #333 url(/images/top-tile2.jpg) top left repeat-x;
   font: normal 12px/14px  arial, verdana, sans-serif; color: #ccc;    
   margin: 0; padding: 0;
   text-align: center;
   width: 100%;
   }

   
   #top-body {
      height: 178px;
      margin: 0 auto; padding: 0;
      width: 100%;
      text-align: center;
      }
      
   #mid-body {
      background-color: #000;
      margin: 0 auto; padding: 0;
      width: 100%;
      text-align: center;
      }
            
   #bottom-body {
      background: #333 url(/images/bottom-tile.gif) top left repeat-x;
      height: 250px;
      margin: 0 auto; padding: 0;
      width: 100%;
      text-align: center;
      }
      


/* afters
-------------------------------------------------------- */
   #top-body:after,
   #mid-body:after,
   #bottom-body:after,
   #header:after,
   #content:after,
   .rtside-module:after,
   .article:after,
   #footer:after {
			content: "."; 
			display: block; 
			height: 0; 
			clear: both; 
			visibility: hidden;
			}

/* containers 
-------------------------------------------------------- */

#header {
   background: transparent url(/images/top-bg2.jpg) top left no-repeat;
   margin: 0 auto;
   padding: 0px 100px 0px 100px;
   text-align: left;
   width: 960px;
   width/**/:/**/ 760px;
   height: 178px;
   }

#content {
   margin: 0 auto;
   padding: 30px 100px 30px 100px;
   text-align: left;
   width: 960px;
   width/**/:/**/ 760px;
   color: #ccc;
   }
   
#footer {
   background: #333 url(/images/bottom-bg.gif) top left no-repeat;
   margin: 0 auto;
   padding: 30px 100px 0px 100px;
   text-align: center;
   width: 960px;
   width/**/:/**/ 760px;
   height: 240px;
   }
   
/* header container
-------------------------------------------------------- */ 

   #logo {
      float: left;
      font-size: 1em;
      height: 178px;
      margin: 0;
      padding: 0;
      width: 253px;
      }
      
   #logo a {
      background: url(/images/logo2.jpg) top left no-repeat;
      color: #333;
      display: block;
      height: 178px;
      outline: none;
      text-decoration: none;
      text-indent: -9999px;
      width: 253px;
      }

      #logo a:hover {
         text-decoration: none;
         }


/* content container
-------------------------------------------------------- */ 

/* 3column layout */   

   #left1of3 {
      float: left;
      display: block;
      padding-right: 10px; margin: 0;
      width: 253px;
      width/**/:/**/ 243px;
      }
      
   #right2-3 {
      float: left;
      padding: 0; margin: 0;
      width: 507px;
      }

/* 4column layout */      

   #left1of4 {
      float: left;
      padding-right: 10px; margin: 0;
      width: 190px;
      width/**/:/**/ 180px;
      }
      
      #left2thru4 {
         float: left;
         border-top: 1px solid #666;
         padding: 8px 0 0 0; margin: 0;
         width: 570px;
         }
      
   #center2-3 {
      float: left;
      padding-right: 10px; margin: 0;
      width: 380px;
      width/**/:/**/ 370px;
      }
      
      .center2of4 {
         float: left;
         padding-right: 10px; margin: 0;
         width: 190px;
         width/**/:/**/ 180px;
         }
         
      .center3of4 {
         float: left;
         padding-right: 10px; margin: 0;
         width: 190px;
         width/**/:/**/ 180px;
         }
      
      .right4of4 {
         float: left;
         padding-right: 10px; margin: 0;
         width: 190px;
         width/**/:/**/ 180px;
         }
      
 /* news column */ 
 
   p.newsblurb {
      margin: 0 0 10px 0;
      }
      
      p.newsblurb a{
         text-decoration: none;
         text-transform: uppercase;
         font-size: 10px;
         }
         
         p.newsblurb a:hover{
         text-decoration: underline;
         }
         
      .article {
         margin-bottom: 10px;
         border-bottom: 1px solid #333;
         }
         
         .article h3 a,
         .article h3 a:hover {
            text-decoration: none;
            color: #fff;
            }
         
         .date {
            padding-bottom: 15px;
            font: italic 10px/12px georgia, serif; color: #999;
            margin: 0;
            }
         
 /* homepage thumbnails */   
 
   #hpthumb-doc {
      float: left;
      font-size: 1em;
      height: 122px;
      margin: 0; padding: 0;
      width: 245px;
      
      }
      
      #hpthumb-doc a {
         background: url(/images/doc-thumb.jpg) top left no-repeat;
         color: #333;
         display: block;
         height: 122px;
         outline: none;
         text-decoration: none;
         text-indent: -9999px;
         border: 1px solid #000;
         width: 245px;
         width/**/:/**/ 243px;
         }
   
         #hpthumb-doc a:hover {
            text-decoration: none;
            border: 1px solid #666;
            }
         
   #hpthumb-com {
      float: left;
      font-size: 1em;
      height: 122px;
      margin-left: 17px; padding: 0;
      width: 245px;
      }
      
      #hpthumb-com a {
         background: url(/images/com-thumb.jpg) top left no-repeat;
         color: #333;
         display: block;
         height: 122px;
         outline: none;
         text-decoration: none;
         text-indent: -9999px;
         border: 1px solid #000;
         width: 245px;
         width/**/:/**/ 243px;
         }
   
         #hpthumb-com a:hover {
            text-decoration: none;
            border: 1px solid #666;
            }


/* midthumbs
-------------------------------------------------------- */

 .midthumb {
      float: left;
      font-size: 1em;
      height: 100px;
      margin: 15px 0 0 0;
      padding: 0 0 10px 0;
      width: 180px;
      }
      
   .midthumb a,
   .midthumb a:visited {
      color: #000;
      display: block;
      height: 100px;
      outline: none;
      text-decoration: none;
      text-indent: -9999px;
      border: 1px solid #000;
      width: 180px;
      width/**/:/**/ 178px;
      }

      .midthumb a:hover,
      .midthumb a:visited:hover {
         text-decoration: none;
         border: 1px solid #666;
         }
         
   .ostrich a  {
      background: transparent url(/images/midthumb/ostrich.jpg) top left no-repeat;
      display: block;
      }
      
      
    .moose a  {
      background: transparent url(/images/midthumb/moose.jpg) top left no-repeat;
      display: block;
      }
      
   .fire a  {
      background: transparent url(/images/midthumb/fire.jpg) top left no-repeat;
      display: block;
      }
      
    .opening a {
      background: transparent url(/images/midthumb/opening.jpg) top left no-repeat;
      display: block;
      }
      
   .gaming a {
      background: transparent url(/images/midthumb/gaming.jpg) top left no-repeat;
      display: block;
      }
      
   .stage a {
      background: transparent url(/images/midthumb/stage.jpg) top left no-repeat;
      display: block;
      }
      
   .com-sidelink a  {
      background: transparent url(/images/midthumb/com-sidelink.jpg) top left no-repeat;
      display: block;
      }
      
   .doc-sidelink a  {
      background: transparent url(/images/midthumb/doc-sidelink.jpg) top left no-repeat;
      display: block;
      }
   
   .rtside-module {
      border-bottom: 1px solid #333;
      margin-bottom: 20px;
      }
      

/* sidethumbs
-------------------------------------------------------- */

.sidethumb {
      float: left;
      font-size: 1em;
      height: 100px;
      margin: 0;
      padding: 0 0 10px 0;
      width: 180px;
      }
      
   .sidethumb a,
   .sidethumb a:visited {
      color: #000;
      display: block;
      height: 100px;
      outline: none;
      text-decoration: none;
      text-indent: -9999px;
      border: 1px solid #000;
      width: 180px;
      width/**/:/**/ 178px;
      }

      .sidethumb a:hover,
      .sidethumb a:visited:hover {
         text-decoration: none;
         border: 1px solid #666;
         }

/* thinthumbs
-------------------------------------------------------- */

 .thinthumb {
      float: left;
      font-size: 1em;
      height: 60px;
      margin: 0;
      padding: 0 0 3px 0;
      width: 180px;
      }
      
   .thinthumb a,
   .thinthumb a:visited {
      color: #000;
      display: block;
      height: 60px;
      outline: none;
      text-decoration: none;
      text-indent: -9999px;
      width: 180px;
      width/**/:/**/ 178px ;
      border: 1px solid #000;
      }

      .thinthumb a:hover,
      .thinthumb a:visited:hover {
         text-decoration: none;
         border: 1px solid #666;
         }
         
   .ostrichthin a  {
      background: transparent url(/images/thinthumb/ostrich.jpg) top left no-repeat;
      display: block; 
      }
   
      .ostrich-on .ostrichthin a  {
         background: transparent url(/images/thinthumb/ostrich-on.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
         
         .ostrich-on a#ostrich-clip {
            text-decoration: none; color: #666;
            }
   
   .moosethin a  {
      background: transparent url(/images/thinthumb/moose.jpg) top left no-repeat;
      display: block; 
      }
      
      .moose-on .moosethin a  {
         background: transparent url(/images/thinthumb/moose-on.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
         
         .moose-on a#moose-clip {
            text-decoration: none; color: #666;
            }
      
   .firethin a  {
      background: transparent url(/images/thinthumb/fire.jpg) top left no-repeat;
      display: block;
      }
      
      .fire-on .firethin a  {
         background: transparent url(/images/thinthumb/fire-on.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
         
         .fire-on a#fire-clip {
            text-decoration: none; color: #666;
            }
      
   .openingthin a {
      background: transparent url(/images/thinthumb/opening.jpg) top left no-repeat;
      display: block;
      }
      
      .opening-on .openingthin a {
         background: transparent url(/images/thinthumb/opening-on.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
         
         .opening-on a#opening-clip {
            text-decoration: none; color: #666;
            }
      
   .gamingthin a {
      background: transparent url(/images/thinthumb/gaming.jpg) top left no-repeat;
      display: block;
      }
      
      .gaming-on .gamingthin a {
         background: transparent url(/images/thinthumb/gaming-on.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
         
         .gaming-on a#gaming-clip {
            text-decoration: none; color: #666;
            }
      
   .stagethin a {
      background: transparent url(/images/midthumb/stage.jpg) top left no-repeat;
      display: block;
      }
      
      .stage-on .stagethin a {
         background: transparent url(/images/midthumb/stage.jpg) top left no-repeat;
         display: block; border: 1px solid #666;
         }
      
         .stage-on a#stage-clip {
            text-decoration: none; color: #666;
            }
            
ul.columnlist {
   margin: 0; padding: 0;
   list-style-type: none;
   width: 370px;
   }

   ul.columnlist li {
      float: left;
      margin: 0 0 8px 0; padding: 0 10px 0 0;
      width: 180px;
      width/**/:/**/ 170px;
      }
      
ul.columnlist2 {
   margin: 0; padding: 0;
   list-style-type: none;
   }

   ul.columnlist2 li {
      margin: 0 0 5px 0; padding: 0;
      }

/* form
-------------------------------------------------------- */

			
dl { 
	padding: 0; 
	margin: 0;
	clear: both;
}

dt { 
	width: 360px;
	text-align: left;
	float: left; 
	padding: 0px; margin: 0px;
}

dd { 
	width: 360px;
	text-align:left;
	margin: 0px;
	padding: 0 0 10px 0;
}

dd input.text, dd textarea, dd input.image {
   padding: 5px; 
	text-align:left;
   vertical-align:top;
	width: 360px;
	width/**/:/**/ 342px;
	background: #4a4949 url(/images/form-bg.gif) top left repeat-x;
	border: 3px double #666;
	font: normal 12px/15px Arial, Verdana, sans-serif; color: #C93; 
}


         
/* footer container
-------------------------------------------------------- */

#footer p {
   font: normal 10px/12px arial, verdana, sans-serif; color: #666;
   margin: 0;
   }

   #footer a {
      color: #960;
      text-decoration: none;
      }
      
      #footer a:hover {
         text-decoration: underline;
         }