﻿

/* CSS Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td 
{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body 
{
	line-height: 1;
}
ol, ul 
{
	list-style: none;
}
blockquote, q 
{
	quotes: none;
}

/* remember to define focus styles! */
:focus 
{
	outline: 0;
}

/* tables still need 'cellspacing="0"' in the markup */
table 
{
	border-collapse: collapse;
	border-spacing: 0;
}

/***********************/

html
{
  height: 100%;
}

body 
{
  color: #000000;
  background: #616161 url("body_bkgd.gif") 0 0 repeat-x;
}

h1, h2, h3, h4, p, li, td, th, input
{
  font-family: Arial, sans-serif;
  color: #000000;
  background-color: #f4f4f4;
}

h1
{
  color: #0041ad;
  font-size: 26px;
  font-weight: bold;
  font-variant: small-caps;
  margin: 14px 0;
}

h2
{
  color: #0041ad;
  font-size: 20px;
  font-weight: bold;
  font-variant: small-caps;
  margin: 14px 0;
}

h2 sup
{
  vertical-align: super;
  font-size: 14px;
}

h3
{
  color: #0041ad;
  font-size: 16px;
  font-weight: bold;
  margin: 14px 0;
}

h4
{
  font-size: 14px;
  font-weight: 700;
}

p, li, td, th, input
{
  color: #3c3c3c;
  font-size: 13px;  
}

p
{
  line-height: 20px;
  margin: 13px 0;
}

li
{
  line-height: 20px;
}

img
{
  border: none;
}

label, input
{
  cursor: pointer;
}

#container
{
  margin: 0 auto;
  width: 960px;
  text-align: left;
  background-color: #f4f4f4;
}

#header
{
  width: 960px;
  height: 156px;
  background: #082a63 url("header.jpg") 0 0 no-repeat;
  margin: 0;
  padding: 0;
}

#header span
{
  display: none;
}

.emailLink
{
  float: right;
}

#topnav
{
  margin: 4px 0 0 6px;
}

#contentTop
{
  padding: 8px 0px 10px 10px;
  background-color: #f4f4f4;
}

#content
{
  padding: 8px 0px 10px 10px;
  background-color: #f4f4f4;
}

#content ul
{
  list-style-type: disc;
  margin: 10px 0 0 10px;
  background-color: #bdbdbd;
}

#content li
{
  margin-bottom: 10px;
  margin-left: 10px;
  background-color: #bdbdbd;
}

#contentHome
{
  padding: 8px 0px 10px 0px;
}

#contentRight
{
  width: 680px;
  float: right;
  background-color: #f4f4f4;
}

#aboutUs, #photoGallery, #testimonials
{
  float: left;
  margin-left: 12px;
}

#aboutUs
{  
  width: 325px;
  margin-left: 0;
}

#aboutUs div
{
  margin-left: 12px;
}

#riversHome
{
  float: left;
  width: 678px;
  height: 280px;
  padding: 0 0 0 12px;
  background-color: #e3e3e3;
}

#riversHome h2, #riversHome p
{
  background-color: #e3e3e3;
}

#upcomingEvents
{
  float: left;
  width: 240px;
  height: 280px;
  margin-left: 10px;
  padding: 0 0 0 12px;
  background-color: #e3e3e3;
}

#upcomingEvents h2, #upcomingEvents p
{
  background-color: #e3e3e3;
}

#riverLinks
{
  width: 232px;
  background-color: #f4f4f4;
}

#riverLinks div
{
  height: 40px;
  margin-bottom: 6px;
}

#river
{
  position: absolute;
  top: 10px;
  left: 250px;
  width: 700px;
  color: #000000;
  background-color: #dcdcdc;
}

#river div
{
  padding: 2px 8px 10px 10px;
}

#river h1, #contentRight h1
{
  font-size: 16px;
  font-weight: bold;
  font-variant: normal;
  color: #3c3c3c;
}

#river h2, #contentRight h2
{
  font-size: 18px;
  font-weight: bold;
  color: #0041ad;
}

#river h3, #contentRight h3
{
  font-size: 14px;
  font-weight: bold;
  color: #656565;
}

#river h1, #river h2, #river h3, #river p
{
  color: #000000;
  background-color: #dcdcdc;
}

#bookThisTrip
{
  float: right;
  margin-right: 8px;
}

p#minimumAge
{
  color: #c97828;
  font-weight: bold;
}

.map
{
  margin-top: 10px;
  margin-left: 10px;
  width: 258px; 
  height: 172px; 
  position: relative; 
  float: right; 
  background: #e3e3e3 url("map.jpg") right top no-repeat;
}

.mapHome
{
  float: left;
  background: #e3e3e3 url("map_home.jpg") right top no-repeat;
}

.map .mapSkykomish, .map .mapGreen, .map .mapWhiteSalmon, .map .mapToutle, .map .mapMethow, .map .mapTieton, .map .mapWenatchee, .map .mapSkagitWhitewater, .map .mapSkagitEagles, .map .mapNisqually
{
  position: absolute;
  width: 20px;
  height: 20px;
}

.map .mapSkykomish
{
  top: 40px;
  left: 76px;
}

.map .mapGreen
{
  top: 60px;
  left: 96px;
}

.map .mapWhiteSalmon
{
  top: 150px;
  left: 75px;
}

.map .mapToutle
{
  top: 125px;
  left: 25px;
}

.map .mapMethow
{
  top: 45px;
  left: 165px;
}

.map .mapTieton
{
  top: 115px;
  left: 125px;
}

.map .mapWenatchee
{
  top: 67px;
  left: 147px;
}

.map .mapSkagitWhitewater
{
  top: 7px;
  left: 114px;
}

.map .mapSkagitEagles
{
  top: 15px;
  left: 92px;
}

.map .mapNisqually
{
  top: 86px;
  left: 58px;
}

.mapPopup
{
  font-family: Arial, sans-serif;
  font-size:12px;
  color: #000000;
  background-color: #c97828;
  border: 1px solid #000000;
  padding: 2px;
  text-align: center; 
  position: absolute; 
}

#skykomishPopup
{
  top: 26px;
  left: 54px;
}

#greenPopup
{
  top: 42px;
  left: 98px;
}

#whiteSalmonPopup
{
  top: 130px;
  left: 46px;
}

#toutlePopup
{
  top: 114px;
  left: 12px;
}

#methowPopup
{
  top: 28px;
  left: 148px;
}

#tietonPopup
{
  top: 100px;
  left: 111px;
}

#wenatcheePopup
{
  top: 52px;
  left: 125px;
}

#skagitWhitewaterPopup
{
  top: 0px;
  left: 130px;
}

#skagitEaglesPopup
{
  top: 0px;
  left: 66px;
}

#nisquallyPopup
{
  top: 71px;
  left: 38px;
}

#footer
{
  color: #000000;
  background-color: #f4f4f4;
  clear: both;
  border: 1px solid #f4f4f4;
  margin: 20px 0 10px 0;
}

#footer p
{
  text-align: center;  
  color: #333333;
}

#footer span
{
  margin-left: 80px;
}

#footer a:link, #footer a:visited
{
  color: #333333;
}

#footer a:hover
{
  color: #000000;
}

#footer a img
{
  border: none;
  vertical-align: middle;
}

#photoThumbs
{
  margin: 16px 0 16px 0;
}

#photoThumbs input, #photoThumbs img
{
  margin-left: 22px;
  background-color: Transparent;
}

.modalPopup
{
  color: #000000;
  background-color: #ffffff;
  padding: 6px;
  border: 1px solid #000000;
  text-align: center;
}

.modalPopup input
{
  color: #000000;
  background-color: #ffffff;
}

.modalBackground
{
  background: url(black-70.png) repeat 0 0 transparent;
}

/*******************************/

.riverTabs {margin-right: 10px;}
.riverTabs .ajax__tab_header {font-family: Arial, sans-serif;font-size:12px;line-height:18px;font-weight: bold;border-bottom:1px solid #c97828;}
.riverTabs .ajax__tab_outer {padding-right:0px;}
.riverTabs .ajax__tab_inner {padding-left:6px;}
.riverTabs .ajax__tab_tab {padding:5px 17px 5px 17px;margin:0;background-color: #a3a3a3;}
.riverTabs .ajax__tab_hover .ajax__tab_outer {}
.riverTabs .ajax__tab_hover .ajax__tab_inner {}
.riverTabs .ajax__tab_hover .ajax__tab_tab {background-color: #c97828;}
.riverTabs .ajax__tab_active .ajax__tab_outer {}
.riverTabs .ajax__tab_active .ajax__tab_inner {}
.riverTabs .ajax__tab_active .ajax__tab_tab {background-color: #c97828;}
.riverTabs .ajax__tab_body {border:1px solid #999999;border-right:1px solid #c97828;border-top:0;padding:4px 8px 4px 8px;background-color:#bdbdbd;}
#contentRight .riverTabs h1, #contentRight .riverTabs h2, #contentRight .riverTabs h3, #contentRight .riverTabs p {background-color:#bdbdbd;}