@import url(/res/styles/reset.css);

body {
   text-align:center;
   font-size: 11px;
   background: white url(/res/images/body_background.gif) top left repeat-x;
   font-family: Verdana, sans-serif;
}

#container {
   margin: 71px auto 0 auto;
   position: relative;
   text-align: left;
   width: 800px;
   padding-left:60px;
}

#logo {
   background:  transparent url(/res/images/logo.gif) top left no-repeat;
   height:      161px;
   left:        20px;
   position:    absolute;
   text-indent: -999em;
   top:         -65px;
   width:       199px;
   overflow:    hidden;
   z-index: 10;
}
#logo a { 
   position: absolute;
   left:0;
   top:0;
   width: 199px;
   height: 161px;
}

#nav {
   background: transparent url(/res/images/nav_background.gif) top left repeat-x;
   height:     38px;
   line-height: 0;
   margin-bottom:10px;
}

#nav2 {
   height: 83px;
   margin-left:20px;
}
#nav li {
   float: right;
}
#nav2 li {
   float: left;
}
#nav a, #nav2 a {
   display:     block;
   background:  transparent url(/res/images/nav_home_new.gif) bottom left no-repeat;
   height:      38px;
   overflow:    hidden;
   text-indent: -999em;
}
#nav2 a { 
   height: 83px; 
   background-position: top left;
}

#nav a:hover {
   background-position: top left;
}
#nav2 a:hover {
   background-position: bottom left;
}
#nav #nav_home a {
   width: 62px;
}
#nav #nav_projects a {
   width: 78px;
   background-image: url(/res/images/nav_projects.gif); 
}
#nav #nav_relicensing a {
   width: 100px;
   background-image: url(/res/images/nav_relicensing_new.gif);
}
#nav #nav_about a {
   width: 61px;
   background-image: url(/res/images/nav_about_new.gif); 
}
#nav #nav_directors a {
   width: 169px;
   background-image: url(/res/images/nav_board-of-directors.gif); 
}
#nav #nav_calendar a {
   width: 93px;
   background-image: url(/res/images/nav_calendar.gif); 
}
#nav #nav_links a {
   width: 69px;
   background-image: url(/res/images/nav_links_new.gif); 
}
#nav #nav_contact a {
   width: 72px;
   background-image: url(/res/images/nav_contact_new.gif); 
}
#nav #nav_meetings a {
   width: 168px;
   background-image: url(/res/images/nav_meetings_minutes_new.gif); 
}
#nav #nav_employment a {
   width: 101px;
   background-image: url(/res/images/nav_employment_new.gif); 
}

#nav2 #nav_flood-control a {
   width: 118px;
   background-image: url(/res/images/nav2_flood-control.gif);
}
#nav2 #nav_water-supply a {
   width: 129px;
   background-image: url(/res/images/nav2_water-supply.gif);
}
#nav2 #nav_fishery-enhancement a {
   width: 190px;
   background-image: url(/res/images/nav2_fishery-enhancement.gif);
}
#nav2 #nav_recreation a {
   width: 114px;
   background-image: url(/res/images/nav2_recreation.gif);
}
#nav2 #nav_hydroelectric-generation a {
   width: 211px;
   background-image: url(/res/images/nav2_hydroelectric-generation.gif);
}

#nav li:hover ul#nav_webmail,
#nav li.sfhover ul#nav_webmail {
   right: 0px !important;
}

#widgets {
   margin-top: 10px;
   float:right;
   width: 204px;
}
#content {
   float: left;
   width: 565px;
   margin-left:20px;
   padding-top:60px; 
}
#index #content {
   padding-top:220px;
   background: transparent url(/res/images/index_content.jpg) top left no-repeat;
}

p,ul {
   line-height:150%;
   margin: 6px 0 12px 0;
}
#index #content p { padding-left:20px; padding-right:5px; }

.errors {
   background-color: pink;
   border: 1px solid red;
}

.messages {
   background-color: green;
   border: 1px solid green;
}

#widgets li {
   margin-bottom:14px;
}

#widgets li div {
   background: #DAE1E7 url(/res/images/bg_side_mid.gif) top left repeat-y;
   padding-top: 6px;
}
#widgets li div p {
   padding: 0 10px;
}

#nav_conditions h3,
#nav_news h3,
#nav_projects h3 {
   text-indent: -999em;
   overflow:hidden;
   height:20px;
   width: 200px;
   margin-bottom:0;
}

#widgets li .top {
   height: 64px;
   display: block;
}

#nav_conditions h3   { background: url(/res/images/headers/side_current-river-conditions.gif) top left no-repeat; }
#nav_news h3         { background: url(/res/images/headers/ycwa-news.gif) top left no-repeat; }
#nav_projects h3     { background: url(/res/images/headers/side_current-projects.gif) top left no-repeat; }

#nav_conditions .top { background: url(/res/images/headers/side_img_current-river-conditions.gif) top left no-repeat; }
#nav_news .top       { background: url(/res/images/headers/side_img_news-events.gif) top left no-repeat; } 
#nav_projects .top   { background: url(/res/images/headers/side_img_current-projects.gif) top left no-repeat; } 

#widgets li .bot {
   background: url(/res/images/bg_side_bot.gif) top left no-repeat;
   height: 12px;
   display: block;
   margin-top:-12px;
}

#footer {
   clear:both;
}

#index h1 { margin-left: 0; }
h1 { 
   margin: 10px 0 -6px -20px; 
}
h1 img { position: relative; z-index:2; }
h2 {
   font-family: GillSans, "Gill Sans MT", Verdana, sans-serif;
   font-weight:bold;
   color: #1b4976;
   font-size: 19px;
   margin: 1em 0 .5em 0;
}
h3 {
   margin: 12px 0 6px 0;
   font-weight: bold;
   color: #333;
   font-size: 12px;
   line-height:133%;
}

li { 
   line-height: 150%;
}

ol li { list-style-type: decimal; margin: .5em 0 .5em 2em; }

table {
   border-collapse: collapse;
}
td { 
   padding: 3px 6px;
   border: 1px solid #ccc;
   border-color: #ccc #eee;
}



#nav li ul { 
   position:absolute;
   left:-9999em;
   text-align:left;
   width:150px;
   z-index:10;
}

#nav li:hover ul,
#nav li.sfhover ul {
   left: auto; 
}

#nav li ul li { 
   float:none !important; 
   background:transparent !important; 
   margin: 0 !important;
} 

#nav li ul { margin:0; }
#nav li ul a {
   text-indent:0 !important;
   display:block !important;
   padding: 4px 8px;
   text-decoration: none;
   background: #4e6c89 !important;
   color: white;
   border-bottom:1px solid #657f98;
   height: auto !important;
   width: auto !important;
   margin: 0 !important;
}
#nav li ul a:hover {
   color: white !important;
   background: #001c42 !important;
}

#widgets li p {
   font-style: italic;
   text-align: center;
}
#widgets li div p {
   font-style: normal;
   text-align: left;
}