/* CobbEMC Global CSS (jsc & jks 01/19/2006) */

/*###########
entire document styles
###########*/
   
   /* removes default margin & padding from all elements (except form elements & ul/li's */
   * {
      margin: 0;
      padding: 0;
   }
   /* see the body font comments below */
   html { font-size: 125%; }
   body {
   text-align: center; /* font size: html=125% & body=50% so 1em = 16pt */
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 50%;
   color: #6B6868;
   }


/*###########
link styles
###########*/

   div#energy_header_nav a:link, div#energy_header_nav a:visited {
      font: 11px/28px Verdana, Arial, Helvetica, sans-serif normal;
      color: #6B6868;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none;
   }

/* cobb emc header info */   
   div#header_nav a:link, div#header_nav a:visited {
      font: 10px/28px Verdana, Arial, Helvetica, sans-serif normal;
      color: #6B6868;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none;
   }
   #home .home, #en_espanol .en_espanol, #weather .weather, #contact_us .contact_us { border-bottom: 3px #E39226 solid; }
   #home .home:hover, #en_espanol .en_espanol:hover, #weather .weather:hover, #contact_us .contact_us:hover { text-decoration: none; }
   
   /* footer nav links */
   div#footer a {
      font: 10px/16px Verdana, Arial, Helvetica, sans-serif normal;
      color: #6B6868;
      font-weight: bold;
      text-transform: uppercase;
      text-decoration: none;
   }
   
   div#header_nav a:hover, div#header_nav a:active, div#footer a:hover, div#footer a:active { text-decoration: underline; }
   
   #AboutEMC #AboutEMC, #AboutEnergy #AboutEnergy { background:url(/global/css/images/orange_square_bullet.gif) no-repeat left; }

   #top_banner { 
      width: auto;
      height: 85px;
      text-align: right;
/*    background: url(images/banner_logo.gif) left no-repeat;
*/    margin: 0 20px;
      padding-top: 25px;
      padding-bottom:10px;
      position: relative;
   }

/* div containing full-text search field */
   #energ_search_bar { /* div container for energy_search_bar */
      width: auto;
      text-align: right;
      /* height: 19px; messes up IE */
   }

/* hacks to position the search box & go button in non-IE */
   div#top_banner > div#energy_search_bar { height: 19px; }
   div#energy_search_bar > form > input { margin-top: 1px; }


/* div for logo and image map */
   #logo_map {
      width: 300px;
      background: url(images/banner_logo.gif) left no-repeat;
      float: left;
   }
   #logo_map a {
      display: block;
        float: left;
    /*   border: 1px dashed red; /* debug display */
   }
   #logo_map a span {
      display: none;
   }
   #logo_map a#logo_link {
      height: 63px;
      width: 261px;
   }
   

/*###########
div styles
###########*/

   /* main div that contains content in a 760px area */
   div#main_container {
      width: 760px;
      margin-left: auto;
      margin-right: auto;
      text-align: left; /* left align all text within the main_container div to counter the text-align: center property of the body style */
      padding: 11px 0px 0px 0px;
      font-size: 12px;
   }
   
   /* div for the header links */
   div#header_nav {
      height: 29px;
      text-align: right;
      padding-right: 19px;
      /* margin-bottom: 4px; */
   }
   object { border: 0px; float: right; }
   
   /* div for the cobblogo & flash banner */
   div#banner { /*! div for the safety/outage banner !*/
      width: auto;
      height: 61px;
      background-color: #E5E1DA; 
   }
      div#cobb_logo { /*! div for cobblogo !*/
         height: 53px;
         width: 55px;
         float: left;
         margin: 4px 0px 4px 30px;
         background: url(images/cobb_logo.gif) no-repeat top left;
         background-color:#E5E1DA;
      }
      * html * div#cobb_logo { /*! IE6 CSS hack for proper positioning (IE's hasLayout property) !*/
         margin-left: 13px;
      }
      div#start_service {
         height: 18px;
         width: 138px;
         background-color: #898783;
         float: left;
         text-align: center;
         margin: 43px 0px 0px 16px;
         background: url(images/start_service_block.gif) no-repeat bottom right;
      }
      * html * div#start_service { margin-left: 20px; } /*! IE6 CSS hack for proper positioning (IE's hasLayout property) !*/
      div#start_service a {
         font: bold 13px "Arial Narrow", Arial;
         color: #FFF;
         letter-spacing: 2px;
         word-spacing: 1px;
         text-decoration: none;
         text-transform:uppercase;     
      }

         div#sub_banner { /* div container for account_login & search_bar */
            height: 26px;
            margin-bottom: 10px;
            position: relative;
         }
               div#account_login { /* div for the account login button */
                  height: 26px;
                  width: 213px;
                  float: left;
                  margin-left: 15px;
                  padding: 3px 0px 0px 13px;
                  background: url(images/account_login.gif) no-repeat bottom right;
                  background-color: #B0AB87;
               }
               * html * div#account_login { margin-left: 7px; } /* IE6 CSS hack for proper positioning (IE's hasLayout property) */
               div#account_login a {
                  font: bold 18px "Arial Narrow", Arial;
                  color: #F0EBD0;
                  letter-spacing: 1px;
                  word-spacing: 1px;
                  text-decoration: none;
                  text-transform:uppercase;
               }
               
               /* div containing full-text search field */
               div#search_bar {
                  background-color: #7B9DB2;
                  width: auto;
                  text-align: right;
                  /*height: 19px; messes up IE */
               }
               /* hacks to position the search box & go button in non-IE */
               div#sub_banner > div#search_bar { height: 19px; }
               div#search_bar > form > input { margin-top: 1px; }
   
   div#text_only {
      width: 500px;
      margin: 30px 0px 0px 130px;
   }
   div#leftnav {
      width: 226px;
      margin: 0px 16px 0px 15px;
      float: left;
   }
   
   * html * div#leftnav { margin-left: 7px; } /* IE6 CSS hack for proper positioning (IE's hasLayout property) */
   
   /* div for the page's content area */
   div#content {
      float: left;
      width: 485px;
      margin-right: 18px;
      position:relative; /* set to relatiave to allow the news story div to be absolute */
   }
         /* div for the news story photo that fades in */
         div#photoholder { background: #fff url('/images/loading.gif') 50% 50% no-repeat; }
         img#thephoto { visibility: hidden; } /* hides the photo until JavaScript does the fade-in */
         
         /* div containing the entire sliding news story div */
         div#news_story_container {
            position: absolute;
            left: 274px;
            top: 30px;
            overflow: hidden;
         }
               /* div for the news story header */
               div#news_story_heading {
                  height:15px;
                  background-color:#CCC;
                  position: absolute;
                  width: 211px;
                  left:0px;
                  top:0px;
                  padding-top: 2px;
               }
               /* div for the news story title */
               div#news_story {
                  width: 181px;
                  background-color:#FFF;
                  padding: 20px 10px 9px 20px;
                  position: relative;
                  left: 215px;
               }
               /* opacity for news story divs here */
               div#news_story, div#news_story_header {
                  filter:progid:DXImageTransform.Microsoft.alpha(opacity=85);
                  khtmlopacity: 0.85;
                  -moz-opacity: 0.85;
                  opacity: 0.85;
               }
   
   /* div for the footer nav */
   div#footer {
      text-align: center;
      clear: both;
      padding: 15px 0px;
   }

/*###########
text styles
###########*/
   
   #news_story p {font: bold 2.25em "Arial Narrow", Arial, san-serif;}
   #news_story a { font: bold .75em/1.5 Arial, Helvetica, sans-serif;
      text-decoration: underline; 
      color: #6B6868;
      text-transform: uppercase;
   }
   
   #news_story_heading p {
      font: bold .90em/1.5 Arial, Helvetica, sans-serif;
      letter-spacing:.055em;
      color: #6B6868;
      text-transform: uppercase;
      text-align: center;
   }

/*###########
additional styles
###########*/
   
   /* style form the full-text search field form */
   input.search_field { font: 11px Verdana, Arial, Helvetica, sans-serif; margin-right: 40px; }
   
   div#go { position: absolute; left: 722px; display: inline; }
   div#go a img { border: none; }
   div#go a:link img, div#go a:visited img { background-image: url(images/btn_search_off.gif); }
   div#go a:hover img, div#go a:active img { background-image: url(images/btn_search_on.gif); }
   
   html * div#go a:link, html * div#go a:visited { background-image: url(images/btn_search_off.gif);  }
   html * div#go a:hover, html * div#go a:active { background-image: url(images/btn_search_on.gif); }


   div#energy_go { position: absolute; left: 694px; display: inline; }
   div#energy_go a img { border: none; }
   div#energy_go a:link img, div#energy_go a:visited img { background-image: url(images/btn2_search_off.gif) }
   div#energy_go a:hover img, div#energy_go a:active img { background-image: url(images/btn2_search_on.gif) }
   
   * html * div#energy_go a:link, html * div#energy_go a:visited { background-image: url(images/btn2_search_off.gif);  }
   * html * div#energy_go a:hover, html * div#energy_go a:active { background-image: url(images/btn2_search_on.gif); }


/*###########
Left Navigation styles
###########*/

   /**
      Styles for navigation menu list items
   **/
      div#leftnav_container li, div#leftnav_container ul, li#AboutEMC, li#AboutEnergy {
         margin: 0;
         padding: 0;
         list-style-type: none;
      }
   
      div#leftnav_container li a {
         display: block;
         text-decoration: none;
         font-family: "Arial Narrow", Helvetica, sans-serif;
         font-weight: bold;
         top: 0px;
      }
   
   /**
      Styles for the divs containing the menu/submenus
   **/
      div.navmenu_level_two, div.navmenu_level_three, div.navmenu_level_four {
         overflow: hidden;
         display: none;
         top: 0px;
      }
      
      div.navmenu_level_two_active, div.navmenu_level_three_active, div.navmenu_level_four_active { /* added this active class for the menu, so that display:none can be used for all menu items, and just the active ones get a height property. */
         overflow: hidden;
         height: 0px;
         top: 0px;
      }
   
   /**
      Styles for the menu links/rollovers
   **/
      div.navmenu_level_one a {
         color: #6B6868;
         font-size: 25px;
         background-color: #F0ECD1;
         padding: 6px 13px;
         width: 200px;
         border-bottom: 1px solid #E3DCC0;
      }
      li#m3 a { line-height: 1em; } /*comunity services*/
      
      div.navmenu_level_two a, div.navmenu_level_two_active a {
         color: #7A7777;
         background-color: #DFD2B3;
         padding: 2px 13px 2px 23px;
         width: 190px;
         border-bottom: 1px solid #D2BE96;
         font-size: 15pt;
         display: none;
      }
      
      div.navmenu_level_three a, div.navmenu_level_three_active a {
         color: #ECE8CC;
         background-color: #BFAE80;
         padding: 2px 13px 2px 33px;
         width: 180px;
         font-size: 14pt;
         font-weight: bold;
         border-bottom: 1px solid #A29161;
         display: none;
      }
   
      div.navmenu_level_four a, div.navmenu_level_four_active a {
         color: #6B6868;
         background-color: #F0ECD1;
         padding: 2px 13px 2px 43px;
         width: 170px;
         border-bottom: 1px solid #A29161;
         font-size: 13pt;
         display: none;
      }
      
   /**
      Safety Information & Energy Convservation Styles
   **/
      div.lower_navmenu_level_one a {
      }
      
      div.lower_navmenu_level_two a, div.lower_navmenu_level_two_active a {
      }
      
      div.lower_navmenu_level_three a, div.lower_navmenu_level_three_active a {
      }
      
      div#m4 li a, div#m5 li a, li#AboutEMC a, li#AboutEnergy a {
         font-size: 13px;
         line-height: 18px;
         text-decoration: none;
         font-weight: none;
         padding: 1px 13px;
         color:#FFF;
         display: block;
         width: 200px;
         text-transform:uppercase;
         letter-spacing: .085em;
      }
      
      
      /* Safety Image */
      div#m4 li a { background: url(images/leftnav_redbar_normal.gif) no-repeat bottom right; }
      div#m4 li a:hover { background: url(images/leftnav_redbar_rollover.gif) no-repeat bottom right; }
      /* Energy Image */
      div#m5 li a { background: url(images/leftnav_greenbar_normal.gif) no-repeat bottom right; }
      div#m5 li a:hover { background: url(images/leftnav_greenbar_rollover.gif) no-repeat bottom right; }
      
      li#AboutEMC a { margin-top: 10px; }
      li#AboutEMC a:link, li#AboutEnergy a:link, li#AboutEMC a:visited, li#AboutEnergy a:visited {
         color: #A7A7A7;
         font-weight: bold;
         letter-spacing: 0;
      }
      li#AboutEMC a:hover, li#AboutEnergy a:hover, li#AboutEMC a:active, li#AboutEnergy a:active { color:#7F7F7F; text-decoration:underline; }
      
      /* div for crumbtrail */
   #crumbs {
      float: left;
      margin-left: 16px;
      font: bold 1em Arial, Helvetica, sans-serif;
      color: #666;
   }
   #crumbs a {
      font: bold 1em Arial, Helvetica, sans-serif;
      color: #666;
   }

   #crumbtrail {
      float: left;
      width: 520px;
      height: 28px;
      margin-right: 20px;
      font: bold 1em Arial, Helvetica, sans-serif;
      color: #666;
   }
   * html * #crumbtrail { margin-right: 10px; } /* IE6 CSS hack for proper positioning (IE's hasLayout property) */

/* crumbtrail links */
   #crumbtrail a {
      font: bold 1em Arial, Helvetica, sans-serif;
      color: #666;
   }
   #crumbtrail span { 
      font-weight: bold;
      color: #eba506;
   }