/* ===================================================
================== GLOBAL STYLES =====================
====================================================*/
.content {
	margin-top:4%;
	margin-bottom:2%;
}
h2 {
	text-transform:uppercase;
}
ul.global-buttons li {
	display:inline-block;
}
.slidesjs-container {
	margin-bottom:2%;
}

#beta-social {border-top:#BBB 4px dashed; padding-bottom:2%; padding-top:2%;}
/* ===================================================
================= PARK PAGE STYLES ===================
====================================================*/

/* ===== GENERAL ===== */
.park-section {
	margin-top:4%;
	text-align:center;
	font-size:1.5em;
	padding-bottom:1%;
}
#second-pano, #third-pano, #fourth-pano, #fifth-pano {
	height:300px;
	position:relative;
	overflow:hidden;
}
/* ===== NAVIGATION ==*/
#park-nav {
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, .75);
	bottom:0;
	position:absolute;
	width:100%;
	padding-top:.75%;
	padding-bottom:.75%;
}
#park-nav h1 {
	color:#FFF;
}
#park-nav ul {
	text-align:right;
}
#park-nav ul li {
	display:inline-block;
	padding-left:4%;
	text-transform:uppercase;
	padding-top:1.25%;
}
/* ===== MAP ========= */
#park-map {margin-top:1%;}
#park-map svg, .sectionMap { border:4px solid #000;}
.parkMap, .sectionMap {display:block;}
.parkHidden, .sectionHidden {display:none;}
.parkSection, .sectionActivity {opacity: 1; transition: opacity .25s; -moz-transition: opacity .25s; -webkit-transition: opacity .25s;}
.parkSection:hover, .sectionActivity:hover {cursor:pointer; opacity: .75;}

/* ===== SIDEBAR ===== */
#gumroad {margin-top:6%;}
#gumroad a {margin-top:2%;}
#explore-sidebar-mailchimp {margin-top:6%;}

/* ===== PAGES ======= */
#park-overview {margin-top:2%; margin-bottom:2%;}
#activities .wrapped {margin-bottom:2%}

/* ===== CHARTS ====== */
#temperature-container {
	height:300px;
}
#precipitation-container {
	height:175px;
}
#visitation-container {
	height:300px;
}
/* ===== SITEMAP ===== */
#sitemap {margin-bottom:4%;}
#sitemap ul li {
	color:#CCC;
	text-align:center;
}
#sitemap ul li strong {
	color:#000;
	text-transform:uppercase;
	line-height:2.5em;
}
/* ====================================================
=============== ACTIVITY PAGE STYLES ==================
=====================================================*/
.stats {
	background: rgb(255, 255, 255);
	background: rgba(255, 255, 255, .75);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-moz-box-sizing: border-box;
	padding:1%;
	margin-top:1%
}
.stats h2 {
	margin-bottom:4%;
	font-size:1.5em;
}
.stats h4 {
	text-transform:uppercase;
	margin-top:1%;
	margin-bottom:1%;
}
.stats h5 {
	margin-top:1%;
	margin-bottom:1%;
}
#highlights {
	margin-top:4%;
	margin-bottom:4%;
}
#highlights h2, #nearby h2 {
	font-size:1.2em;
	margin-top:4%;
}
#highlights h3, #nearby h3 {
	font-weight:normal;
	margin-top:2%;
	margin-bottom:2%;
	line-height:1.125em;
}
#nearby h3 a {
	text-transform:capitalize;
}
#header-pano, .activity-pano {
	height:500px;
	position:relative;
	overflow:hidden;
}
.header-image, .activity-image {
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size:cover;
	height: 100%;
	width: 100%;
}
/* ----------- TOUR STYLES ------------------------*/
#tour-sidebar div {
	margin-top:3%;
	margin-bottom:3%;
}
#tour-sidebar div h4, #tour-sidebar div h6 {
	margin-top:1.5%;
	margin-bottom:1.5%;
	line-height:1.3em
}
/*------------ TRAIL STYLES -----------------------*/
#hike-elevation, #hike-season, #guided_tour_season {
	margin-top:3%;
}
#hike-map {
	border:#C1CEE4 6px solid;
	margin-bottom:2%;
	margin-top:1%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
/* ---------- FOR MAP SHOWCASE -------------------------*/
	.mapIcon:hover, .elevationIcon:hover {
	cursor:pointer;
}
.activeMap .mapIconCircle {
	fill:#ECAF2A;
}
.activeElevation {
	fill:#ECAF2A;
}
.photo {
	display:none;
}
.content a:hover {
	cursor:pointer;
}
a.notate {
	color:#ECAF2A;
}
/*=========== CAMPGROUND STYLES =============================*/
a.camp-map svg {
	border:#C1CEE4 solid 0.5em;
	margin-top:2%;
}
.iconActive:hover {
	cursor:pointer;
}
 @media screen and (max-device-width: 800px), (max-width: 800px) {
 #header-pano {
height:400px;
}
 .header-image {
background-position: center -100px;
}

 .stats h2 {
font-size:1.25em;
}
 .stats h4, .stats h5 {
font-size:.8em;
}
}
@media screen and (max-device-width: 700px), (max-width: 700px) {
 .header-image {
background-position: center -150px;
}
 #highlights h3, #nearby h3 {
font-size:1.125em;
}
}
@media screen and (max-device-width: 600px), (max-width: 600px) {
 .header-image {
background-attachment:scroll;
background-position:center top;
height:200%;
}
 .stats {
margin-top:5%;
}
 #header-pano {
height:360px;
}
 .global-buttons li {
width: 23%
}
 h1 {
font-size:1.5em;
}
 #highlights h3, #nearby h3 {
font-size:1em;
}
 #highlights h2, #nearby h2 {
font-size:1.125em;
}
}
@media screen and (max-device-width: 550px), (max-width: 550px) {
 .stats {
margin-top:7%;
width: 56.333%;
margin-left:39.666%;
}
 .content, .sidebar {
width:98%;
margin-left:1%;
}
 .activity-header h1 {
display:none
}
 .global-buttons {
margin-top:2%;
margin-bottom:2%;
margin-left:16%;
}
 .global-buttons li {
width:15%;
}
 #header-mobile {
background-color:#FFF;
}
 .header-image {
height:100%;
}
 #header-pano {
height:540px;
}
 .stats {
width:100%;
background-color:#FFF;
margin:0;
margin-top:200px;
height:280px;
}
 .stats h2 {
}
 .stats #hike-quality, .stats #hike-season, .stats #hike-allowed {
margin-top:0;
}
 .stats h4 {
width: 39.666%;
}
 .stats h5 {
width: 56.333%;
}
 .stats #hike-allowed h5 img {
width:15%;
}
 .grid_7 {
width:98%;
margin-left:1%;
}
 .global-buttons {
margin-left:2%;
}
 .global-buttons li {
margin-left:1%;
margin-right:1%;
width:23%;
}
 #amenities .grid_1 {
width:6%;
}
}
