@charset "utf-8";
/*----------------------------------------------------------------------------

     * Filename:          screen-main.css

  * Description:          Global Screen Media CSS For Hoot Owl Productions

      * Version:          2.0.0 (06-09-2010) MM-DD-YYYY

      * Website:          http://www.hootowlproductions.com/

       * Author:          Mike Baldwin

  == STRUCTURE: ==============================================================

   * Page width:          Fluid

   # of columns:          3

        Anchors:          $__main      Main Definitions
                          $__header    Header Definitions
                          $__sidebar1  Sidebar 1 Definitions
                          $__sidebar2  Sidebar 2 Definitions
                          $__content   Content Definitions
                          $__footer    Footer Definitions
                          $__format    Formatting Definitions
                          $__pageLinks Links Page Definitions

  ----------------------------------------------------------------------------*/


/*   __main
--------------------------------------------*/

/* NORMALIZE BROWSER STYLES */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {border:0;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;margin:0;padding:0;vertical-align:baseline}
article,aside,footer,header,nav,section{display:block}

body{
 background:url(../../../images/img_bg.png) #2c231e repeat-x;
 font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
 font-size:small;
 line-height:125%;
 margin:10px;
 min-height:580px;
 min-width:760px}
#side1 div, #side1 span,
#side2 div, #side2 span,
#footer div, #footer span{line-height:125%}
#content-container-top div, #content-container-top span{line-height:150%}
a:link{color:#00f}
a:visited{color:#606}
a:hover{color:#06c}
a:active{color:#666}


/*   __header
--------------------------------------------*/

#header{
 background:url(../../../images/img_header2.png) #000 no-repeat 50% 50%;
 height:1%;
 min-height:190px;
 margin:0 0 10px 210px}
#header h1{visibility:hidden}


/*   __sidebar1
--------------------------------------------*/

#side1{
 background:#000 url(../../../images/img_logo.png) no-repeat 50% 0;
 clear:left;
 float:left;
 margin:0 0 -200px;
 min-height:660px;
 position:relative;
 top:-200px;
 width:200px}
#side1 nav{margin:360px 15px 15px}
#menuMain a{
 color:#fff;
 display:block;
 margin:0 0 7px;
 opacity:0.7;
 padding:4px 8px 4px 4px;
 text-align:right;
 text-decoration:none;
 text-shadow:1px 1px 1px #333}
#menuMain a.current{
 color:#222;
 text-shadow:none}


/*   __sidebar2
--------------------------------------------*/

#side2{
 clear:right;
 float:right;
 min-height:620px;
 width:189px}
#side2 nav{margin:15px}
#menuAlt a{
 color:#fff;
 display:block;
 margin:0 0 7px;
 opacity:0.7;
 padding:4px 4px 4px 8px;
 text-align:left;
 text-decoration:none;
 text-shadow:1px 1px 1px #333}
#menuAlt a.current{
 color:#222;
 text-shadow:none}


/*   __content
--------------------------------------------*/

#content-container-top{background:url(../../../images/sidebar1.png) repeat-y 0 100%}
#content-container-mid{background:url(../../../images/sidebar2.png) repeat-y 100% 0}
#content-title{
 background:#fff;
 border:1px solid #333;
 font-size:110%;
 font-weight:bold;
 height:auto;
 margin:0 199px 2px 210px;
 overflow:auto;
 padding:5px 5px 5px 15px}
#content{
 background:#fff;
 border:1px solid #333;
 margin:0 199px 0 210px;
 min-height:460px;
 overflow:auto;
 padding:15px}


/*   __footer
--------------------------------------------*/

#footer-wrapper{
 background:url(../../../images/sidebar2_bottomdrop.gif) repeat-y 100% 0;
 padding:10px 0 0}
#footer{
 background:#000;
 clear:left;
 color:#9f9f9f;
 font-size:110%;
 min-height:85px;
 margin:0 199px 0 0;
 padding:15px;
 text-align:left}
#footer-contact{
 display:inline-block;
 max-width:63%}
#footer-contact div, #footer-mailing div{margin:0 0 7px}
#footer-contact div:last-child, #footer-mailing div:last-child{margin:0}
#footer-validLinks a, #footer-contact a.email{
 color:#b7b27c;
 text-decoration:none}
#footer-validLinks a:hover, #footer-validLinks a:focus, #footer-contact a.email:hover, #footer-contact a.email:focus{color:#fff}
#footer-validLinks a .checkmark{text-decoration:none}
#footer-validLinks a .link, #footer-contact a.email span{text-decoration:underline}
#footer-mailing{
 float:right;
 max-width:35%;
 text-align:right}
#footer-logo{
 background:#000 url(../../../images/img_logo_zoom.png) no-repeat 50% 100%;
 clear:right;
 float:right;
 min-height:256px;
 margin:0 0 -256px;
 position:relative;
 top:-256px;
 width:189px}


/*   __format
--------------------------------------------*/

#jHelperTipAttrContainer{
 background:#807c53;
 color:#ccc;
 padding:0.5em}
.active{color:#060}
.inactive{color:#f00}
.displayNone{display:none}
.separator{border-bottom:1px solid #000}
.accessKey{text-decoration:underline}
.clearBoth{clear:both}
.clearLeft{clear:left}
.clearRight{clear:right}
.e-mail-hidden{display:none}
.loadingMsg{
 background:#2c231e;
 border:2px solid #84835d;
 border-radius:7px;
 color:#918f6d;
 font-size:150%;
 margin:400px 0 0}
img.tipTip{cursor:help}
.pageSubNav{
 border-bottom:1px dotted #ccc;
 font-size:120%;
 margin:0 0 1em;
 padding:0 0 0.3em}


/*   __headerFontControls
--------------------------------------------*/

#headerFontControls{
 color:#aaa;
 float:right;
 font-size:13px;
 font-weight:bold;
 line-height:normal;
 padding:0 10px 10px;
 text-align:right}
#headerFontControls .default a{cursor:pointer}
#headerFontControls .title{
 margin:0 0 3px}
#headerFontControls .minus, div#headerFontControls .plus{
 display:inline-block;
 cursor:pointer;
 font-size:150%;
 padding:4px}
#headerFontControls .minus:hover, #headerFontControls .plus:hover,
 #headerFontControls .minus:focus, #headerFontControls .plus:focus{
 border:1px solid #fff;
 color:#fff}
#headerFontControls div.default a:hover, #headerFontControls div.default a:focus{
 color:#fff;
 text-decoration:underline}
#headerFontControls .minus{margin:0 10px 0 0}
#headerFontControls .minus:hover, #headerFontControls .minus:focus{margin:-1px 9px -1px 0}
#headerFontControls .plus:hover, #headerFontControls .plus:focus{margin:-1px}


/*   __pageLinks
--------------------------------------------*/

body#bodyLinks section.sectionLink{
 background:#dfffbc;
 border:1px solid #9f9b62;
 margin:1em;
 padding:0.5em;
 text-align:center}
body#bodyLinks section.sectionLink:hover{background:#d8f7b6}
body#bodyLinks section.sectionLink div{margin:0.5em}
body#bodyLinks section.sectionLink div.title{font-size:120%}
body#bodyLinks section.sectionLink div.image img{border:none}


/*   __pageNews
--------------------------------------------*/

body#bodyNews .sectionTitle{
 border:1px solid #000;
 font-size:130%;
 font-weight:bold;
 padding:3px;
 text-align:center;
 text-decoration:underline}
body#bodyNews .tempNews{
 max-height:500px;
 overflow:auto;
 padding:10px 0;
 text-align:center}
body#bodyNews .tempNews article .video embed{z-index:-10}
body#bodyNews .tempNews article .title{
 font-weight:bold;
 margin:0 0 10px}
body#bodyNews .tempNews article .article{margin:5px 0 0}

body#bodyNews .tempNews article{
 border:1px solid #aaa;
 margin:0 5px 15px;
 padding:0 0 10px}