/* CSS Document */

/*
---------------------------------------------------------------------------------------------------
DEFAULT SCREEN STYLESHEET FOR: WWW.TRAVELNORTHWESTBC.COM
---------------------------------------------------------------------------------------------------
DESIGN: WWW.SPARKDESIGNCO.COM
---------------------------------------------------------------------------------------------------

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

/* Global Settings
--------------------------------------------------------------------------------------------------- */
* { margin: 0; padding: 0; }

body {
	font: 11px/1 Arial, Helvetica, Sans-Serif;
	color:#000;
	background:rgb(0,51,51);
	padding: 0;
	text-align: center;
	margin-top:40px;
}
ul {
	list-style: none;
}

/* Helper Classes
--------------------------------------------------------------------------------------------------- */
.center { text-align: center; }
.right { text-align: right; }
.more { text-align: right; }

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
.clearfix {
	display: inline-table;
}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
	
/* Home page
--------------------------------------------------------------------------------------------------- */

body#home #container {
	margin: 0 auto;
	width: 764px;
	text-align: center;
	border:4px solid rgb(31,76,76);
	background:rgb(47,89,89);
	line-height:0;
	}

body#home #header {
width: 732px; height:279px;
background:url(../images/home/homeheader.jpg) no-repeat top center;
margin:16px;
}

body#home #header h1 {
display:none;
}

#nav {
display:inline;
}

#nav li {
display:inline;
position:relative;
float:left;
}

#nav #experience a {
display:block;
width:233px; height:161px;
text-indent:-9999px;
background:url(../images/home/experience_roll.jpg) no-repeat 0 0;
margin:0 16px 8px 16px;
}

#nav #experience a:hover {
background-position: 0 -161px;
}

#nav #tour a {
display:block;
width:233px; height:161px;
text-indent:-9999px;
background:url(../images/home/tour_roll.jpg) no-repeat top left;
margin:0 0 8px 0;
}

#nav #tour a:hover {
background-position: 0 -161px;
}

#nav #planning a {
display:block;
width:233px; height:161px;
text-indent:-9999px;
background:url(../images/home/planning_roll.jpg) no-repeat 0 0;
margin:0 0 8px 16px;
}

#nav #planning a:hover {
background-position: 0 -161px;
}


/* local nav
--------------------------------------------------------------------------------------------------- */

#sidebar #localnav {
display:block;
margin-top:220px;
margin-left:15px;
}

#sidebar #localnav a {
display:block;
width: 186px;
height:41px;
text-indent:-9999px;
}


#sidebar #localnav li#travelplanning a {
background:url(../images/nav/planning.gif) no-repeat top left;
}
#sidebar #localnav li#travelplanning a:hover {
background-position:0 -40px;
}
#sidebar #localnav li#travelplanning a.active {
background-position:0 -40px;
}



#sidebar #localnav li#tour a {
background:url(../images/nav/tour.gif) no-repeat top left;
}
#sidebar #localnav li#tour a:hover {
background-position:0 -41px;
}
#sidebar #localnav li#tour a.active {
background-position:0 -41px;
}



#sidebar #localnav li#experience a {
background:url(../images/nav/experience.gif) no-repeat top left;
}
#sidebar #localnav li#experience a:hover {
background-position:0 -41px;
}
#sidebar #localnav li#experience a.active {
background-position:0 -41px;
}



#sidebar #localnav li#contact a {
background:url(../images/nav/contact.gif) no-repeat top left;
}
#sidebar #localnav li#contact a:hover {
background-position:0 -41px;
}
#sidebar #localnav li#contact a.active {
background-position:0 -41px;
}




#sidebar #localnav #subnav {
text-align:right;
}

#sidebar #localnav #subnav li a {
	font: bold 11px/16px Arial, Helvetica, Sans-Serif;
	color:#444444;
	text-indent:0px;
	margin:6px 15px 0 0;
	display:inline;
	text-align:right;
	text-decoration:none;
	background:none;
	}



/* inside template divisions
--------------------------------------------------------------------------------------------------- */

#container {
	margin: 0 auto;
	width: 750px;
	text-align: center;
	border: 1px solid white;
	background:white;
	}
	
body#welcome #container {
background: white url(../images/welcome_banner.jpg) no-repeat top left;}

body#easy #container {
background: white url(../images/easytoreach_banner.jpg) no-repeat top left;}

body#spirit #container {
background: white url(../images/community_banner.jpg) no-repeat top left;}

body#outdoors #container {
background: white url(../images/outdoors_banner.jpg) no-repeat top left;}

body#culture #container {
background: white url(../images/culture_banner.jpg) no-repeat top left;}

body#fishing #container {
background: white url(../images/fishing_banner.jpg) no-repeat top left;}

body#accommodation #container {
background: white url(../images/accomm_banner.jpg) no-repeat top left;}

body#transportation #container {
background: white url(../images/transport_banner.jpg) no-repeat top left;}

body#traveltips #container {
background: white url(../images/traveltips_banner.jpg) no-repeat top left;}

body#travelplanning #container {
background: white url(../images/travelplanning_banner.jpg) no-repeat top left;}


#content {
	width:530px;
	float:right;
	text-align:left;
	margin-bottom:40px;
	margin-top:219px;
	position:relative;
	}
	
body#welcome #content {
background:url(../images/welcome_feature.jpg) no-repeat top right;}

body#easy #content {
background:url(../images/easytoreach_feature.jpg) no-repeat top right;}

body#spirit #content {
background:url(../images/community_feature.jpg) no-repeat top right;}

body#outdoors #content {
background:url(../images/outdoors_feature.jpg) no-repeat top right;}

body#culture #content {
background:url(../images/culture_feature.jpg) no-repeat top right;}

body#fishing #content {
background:url(../images/fishing_feature.jpg) no-repeat top right;}


body#accommodation #content {
background:url(../images/accomm_feature.jpg) no-repeat top right;}

body#transportation #content {
background:url(../images/transport_feature.jpg) no-repeat top right;}

body#traveltips #content {
background:url(../images/traveltips_feature.jpg) no-repeat top right;}

body#travelplanning #content {
background:url(../images/travelplanning_feature.jpg) no-repeat top right;}



		
#logo {
position:relative;
text-align:left;
}
	
#logo h1 a {
	display:block;
	position:absolute;
	Left:0px; top:0px;
	width:373px; height:125px;
	text-indent:-9999px;
	z-index:1;
	}
	

#sidebar {
	width:200px;
	float:left;
	text-align:left;
	}
	
#content p.photocredit {
	display:block;
	text-align:right;
	position:absolute;
	left:315px; top:260px;
	padding-right:30px;
	padding-bottom:10px;
	padding-top:10px;
	background:url(../images/pic_icon.gif) no-repeat center right;
	z-index:2;
	float:right;
	width:120px;
	font:normal 10px/12px arial, helvetica, sans-serif;
	color:#777777;
	}
	

/* typography
--------------------------------------------------------------------------------------------------- */

a {
color:rgb(27,116,73);
}

a:hover {
color:black;
}

#content ul {
margin-left:15px;
}

#content ul li {
font:normal 11px/18px "Lucida Grande", arial, sans-serif;
color:rgb(0,51,51);
margin:0 25px 12px 0;
padding-left:15px;
background:url(../images/inside/bullet.gif) no-repeat 0px 8px;
}


#content p.first {
font:normal 11px/18px "Lucida Grande", arial, sans-serif;
color:rgb(0,51,51);
margin:0 255px 12px 0;
}

#content p.shortpg {
margin-bottom:200px;
}

#content p {
font:normal 11px/18px "Lucida Grande", arial, sans-serif;
color:rgb(0,51,51);
margin:0 25px 12px 0;
}

#content a.next {
font:italic 14px/22px "Lucida Grande", arial, sans-serif;
text-decoration:none;
color:rgb(27,116,73);
border-top:dashed 1px rgb(223,202,171);
padding-top:3px;
display:block;
}

#content p strong {
font:normal 16px/22px "Lucida Grande", arial, sans-serif;
color:rgb(27,116,73);
}

#content h2 {
width:200px;
font:normal 24px/27px "Lucida Grande", arial, sans-serif;
color:rgb(0,51,51);
margin-bottom:10px;
margin-top:0px;
}

#content h3 {
width:400px;
font:normal 20px/24px "Lucida Grande", arial, sans-serif;
color:rgb(27,116,73);
margin-bottom:10px;
margin-top:10px;
}

#content h2 strong {
font:normal 29px/27px "Lucida Grande", arial, sans-serif;
color:rgb(0,51,51);
}



/* inside buttons
--------------------------------------------------------------------------------------------------- */
#sidebar #buttons {
margin-top:150px;
margin-left:20px;
}

#sidebar #buttons #tour a {
display:block;
position:relative;
width:187px;
height:110px;
text-indent:-9999px;
background:url(../images/inside/button_tour.jpg) no-repeat top left;
}

#sidebar #buttons #logistics a {
display:block;
position:relative;
width:187px;
height:110px;
text-indent:-9999px;
background:url(../images/inside/button_logistics.jpg) no-repeat top left;
}

#sidebar #buttons #experience a {
display:block;
position:relative;
width:187px;
height:110px;
text-indent:-9999px;
background:url(../images/inside/button_experience.jpg) no-repeat top left;
}



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

#footer {
	margin: 10px auto;
	font:normal 11px/11px arial, helvetica, sans-serif;
	color:rgb(47,89,89);
	}
	
#footer a {
	text-decoration:none;
	font:normal 11px/11px arial, helvetica, sans-serif;
	color:rgb(82,83,69);
	}
	
#footer a:hover {
	text-decoration:underline;
	font:normal 11px/11px arial, helvetica, sans-serif;
	color:rgb(82,83,69);
	}
	
#footer ul li {
	display:inline;
	}