/* Main Style Sheet
By: Matt Taylor \_________*/
@import url(http://fonts.googleapis.com/css?family=Roboto:400,700);
/* font-family: 'Roboto', sans-serif; */
@import url("reset.css");
@import url("typography.css");
@import url("ie.css");

/* main style */

html {
	
}

body {
	
	background: url("../images/body-bg.jpg") repeat top center;
}

/* navbar */
#nav { 
	width:100%;
	height:52px;
	background: url("../images/nav-bg.png") repeat-x;
	}
	
	#navbar {width:960px; margin:0 auto;}
	
	#nav ul {
		float:right;
		margin-top:10px;
	}
	
	#nav ul li {
		list-style-type:none;
		float:left;
		padding-left:15px;
	}	
	
		#nav ul li a {
			display:block;
			height:23px;
			color:#fff;
			text-decoration:none;
			font-family:Tahoma, Geneva, sans-serif;
			font-size:18px;
			opacity:.8;filter:alpha(opacity=50);
		}
			
		
		#nav ul li a:active {
			margin-top:1px;
		}
		
		/* choose box */
	
		#nav #chooseBox {
			float:left;
			color:#fff;
			text-decoration:none;
			height:42px;
			font-family:Tahoma, Geneva, sans-serif;
			font-size:18px;

			opacity:0.75;filter:alpha(opacity=75);
			}
			
			#chooseBox a {
			color:#fff;
			text-decoration:none;
			line-height:38px;
			font-family:Tahoma, Geneva, sans-serif;
			font-size:18px;
			opacity:0.75;filter:alpha(opacity=75);
			}
			
				#chooseBox a:hover {
					text-decoration:underline;}

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

			
						
#container {
	margin:0 auto;
	width:960px;
	}

	#logo {
		height:100px;
		width:419px;
		float:left;
		padding-bottom:15px;
		background:none;
		border:none;
	}	
	
	#top-ad {
		width:468px;
		height:60px;
		float: right;
		padding-bottom:15px;
		margin-top:25px;}

	#beauty-shot {
		width:960px;
		height:256px;
		background: url("../images/beautyshot-bg.jpg") no-repeat;	
		margin-bottom:10px;	
		float:left;
	}
			#beauty-shot img {
				padding:10px;
				height:235px;
				width:942px;
			}
	
	
	#content {
		width:953px;
		padding:2px;
		border:solid 2px #9a968b;
		-moz-border-radius:5px 5px;
		-webkit-border-radius:5px 5px;
		background-color:#fff; /* for ie */
		background-color:rgba(255,255,255,.4);
		float:left;
		margin-bottom:10px;
	}

	#left-col {
		width:650px;
		float:left;
		padding:2px;

	}
	
		#left-col h1 {
			color:#000; /* for ie */
			color:rgba(0,0,0,.5);
			text-align:left;
			margin-left:15px;
		}
		
		#left-col p {
			font-size:1.3em;
			line-height:1.6em;
			text-align:justify;
			padding:0 10px 10px 10px;
			color:#000; /* for ie */
			color:rgba(0,0,0,.7);
			}
			
			#left-col img {
				border:solid 2px #48623d;
				float:left;
				margin-right:15px;
				margin-bottom:15px;
			}
			
				#left-col .flright {
					float:right!important;
					margin-left:10px!important;}
			
			#left-col ul.states {
				text-align:justify;
			}
			
			#left-col ul.states li {
				list-style-type:none;
				display:inline;
				float:left;
				margin:5px 15px 5px 15px;
			}
			
			#left-col ul.states li a{}
			
			#left-col ul.states li a:hover;{}
			
	#right-col {
		float:right;
		width:274px;
	}
		
	#right-col #state-ad-box, #right-col #state-ad-box-2, #right-col #state-ad-box-3, #right-col #state-ad-box-4 {
		width:200px;
		height:200px;
		background:#fff;
		border:solid 2px #48623d;
		margin-left:15px;
		margin-top:5px;
	}
	
	#right-col hr {width:200px; height:3px; color:#48623d; background-color:#48623d; text-align:left; margin-left:35px; }
	
	#right-col #right-nav {
		margin-top:25px;
		padding-bottom:10px;
		
	}
	
	#right-col #right-nav h2 {
		padding-bottom:10px;
		background: url("../images/cg-title-bg.png") no-repeat;
		width:235px;
		height:31px;
		
	}
	
		#right-col #right-nav h2 a {
			color:#fff;
			font-size:20px;
			text-shadow:1px 1px 1px #000;
			text-decoration:none;
			padding-top:3px;
			display:block;
			text-align:center;
			
	}
	
		/*.hide { display:none;} */
		
	
		#right-col #right-nav ul {
			text-align:left;
			margin-left:20px;
		}
	
			#right-col #right-nav ul li {
				list-style-type:none;
				line-height:2.5em;
			}
			
			#right-col #right-nav ul li:last-child {
				margin-bottom:10px;
			}
	
				#right-col #right-nav ul li a {
					font-size:16px;
					color:#000\9;
					color:#000;
					color:rgba(0,0,0,.7);
					text-decoration:none;
				}
				
				#right-col #right-nav ul li a:visited {
					color:#000;}
				
				#right-col #right-nav ul li a:hover {color:#48623d;}
				
				#right-col #right-nav ul li a:active {
					margin-top:1px;
				}
				
				#right-col #right-nav .affiliations_list {margin-left:0;}
				
				#right-col #right-nav .affiliations_list li {
					display:inline;
					float:left;
					margin:0 4px 4px 4px;
					border:solid 2px #48623d;
					height:35px;
				}
				
				#footer {
	width:960px;
	margin:0 auto;
	}
	
	#footer p {
		text-align: left;
		color:gray;}
	
	#footer a {
		text-decoration: none;
		color:gray;}
	
/* featured parks section */

#featuredParks {
	margin-left:25px;
	}	
	
	#featuredLeftcol {
		width:300px;
		float:left;}
		
	#featuredRightcol {
		width:300px;
		float:right;}
	
	#featuredParks h3 {
		margin:0;
		background: url("../images/cg-title-bg.png") no-repeat;
		width:235px;
		height:31px;
		color: #FFFFFF;
    display: block;
    font-size: 20px;
    padding-top: 3px;
    text-decoration: none;
    text-shadow: 1px 1px 1px #000000;
	text-align:center;
	clear:both;}
		
		#featuredParks ul.cityList {
			list-style:none;
			margin:0;
			text-align:left;}
		
		#featuredParks ul.cityList li {
			list-style-type:none;
			}
			
			#featuredParks ul.cityList li i {
				border-bottom:2px solid black;
				font-style:normal;
				display:block;
				width:300px;
				font-size:16px;}
		
			#featuredParks ul.cityList li ul.city li {
				border:none;
				padding:5px;
				font-size:14px;}
				
					#featuredParks ul.cityList li ul.city li a {
						color:#030;
						text-decoration:none;
						padding-bottom:5px;
						font-weight:normal;}
						
				
				#featuredParks ul.cityList li ul.city li div.parkInfo {
					display:block;
					width:290px;
					background:#54724d;
					background:rgba(12,51,2,.5);
					padding:5px;
					border:dashed 2px #030;
					display:none;
					color:#fff;}
					
					#featuredParks ul.cityList li ul.city li div.parkInfo div.buttons {
						display:block;
						float:left;
						height:21px;
						margin:2px 0;
						clear:both;}
						
						div.buttons img {
							border:none!important;}
		
					#featuredParks ul.cityList li ul.city li div.parkInfo div.contact {
						display:block;
						float:left;
						margin: 3px 0;
						line-height: 16px;
						width: 100%;
						}
						
/* Book your site */

.bys {
	position: relative;
	float: left;
}
.bys a {
	display: block;
	color: #030;
	line-height: 18px;
	font-family: "Roboto", Gotham, Helvetica Neue, Helvetica, Arial, sans-serif;
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
	padding-bottom: 0px;
	font-weight: normal;
	padding: 3px 10px 0px 3px;
	border-radius: 4px;
	border: 1px solid #030;
	
	background: #f1ecdd; /* Old browsers */
	background: #f1ecdd -moz-linear-gradient(top, rgba(255,255,255,.35) 0%, rgba(225,213,184,.4) 100%); /* FF3.6+ */
	background: #f1ecdd -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.35)), color-stop(100%,rgba(225,213,184,.4))); /* Chrome,Safari4+ */
	background: #f1ecdd -webkit-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(225,213,184,.4) 100%); /* Chrome10+,Safari5.1+ */
	background: #f1ecdd -o-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(225,213,184,.4) 100%); /* Opera11.10+ */
	background: #f1ecdd -ms-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(225,213,184,.4) 100%); /* IE10+ */
	background: #f1ecdd linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(225,213,184,.4) 100%); /* W3C */
}
.bys a:before {
	display: block;
	content: url(../images/bys-logo-link-icon.png);
	width: 25px;
	height: 20px;
	position: relative;
	float: left;
	margin-right: 5px;
}

#left-col .bys img {
	border: none;
	float: none;
	max-width: 100%;
	height: auto;
	margin-right: 0px;
	margin-bottom: 0px;
}
						

		
/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}
	
	@media only screen and (min-width: 768px) {
		#navbar select, #navbar option {display:none;}
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		#logo, #navbar, #top-ad, #container, #beauty-shot, #footer {width:768px;}
		#content {width:764px; padding:0px;}
		#featuredLeftcol, #featuredRightcol, #featuredParks ul.cityList li i {width:230px;}
		#featuredParks ul.cityList li ul.city li div.parkInfo {width:210px;}
		#beauty-shot {background:none; height:auto;}
		#beauty-shot img {padding:0px; border:2px solid #334728; margin-left:0px;}
		#logo img, #beauty-shot img, #content img {max-width:100%; height:auto;}
		#beauty-shot img {width:98%;}
		#featuredParks {clear:both; margin-left:10px;}
		#right-col {width:236px;}
		#left-col {width:500px;}
		#featuredParks, #preferredList {width:480px; float:left;}
		#left-col img {display:block; float:none; margin-bottom:5px;}
		.parkInfo .buttons a {float:none;}
		#featuredParks ul.cityList li ul.city li div.parkInfo div.buttons {height:auto;}
		#nav #chooseBox {margin-left:10px;}
		#nav ul {margin-right:10px;}
	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		#logo img, #beauty-shot img, #content img {max-width:100%; height:auto;}
		#featuredParks {margin-left:0px;}
		#featuredLeftcol, #featuredRightcol, #left-col, #right-col, #left-col img {float:none;}
		#beauty-shot {background:none;}
		#beauty-shot img {padding:0px; border:2px solid #334728; margin-left:2px;}
		#top-ad, #navbar ul {display:none;}
		#content h1 {margin-bottom:0px;}
		#left-col {padding:0px;}
		#left-col img {display:block;}
		.parkInfo .buttons a {float:left;}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		#logo, #navbar, #top-ad, #container, #beauty-shot, #content, #featuredLeftcol, #left-col, #featuredParks ul.cityList li i, #footer {width:420px; height:auto;}
		#featuredParks ul.cityList li ul.city li div.parkInfo {width:400px;}	
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		#logo, #navbar, #top-ad, #container, #beauty-shot, #content, #featuredLeftcol, #left-col, #featuredParks ul.cityList li ul.city li div.parkInfo, #right-col, #footer {width:300px; height:auto;}
		#featuredParks ul.cityList li ul.city li div.parkInfo {width:280px;}
		#logo {margin:0 auto;}
	}