@font-face {
    font-family: 'ChantillyMedium';
    src: url('fonts/Chantilly-Medium-webfont.eot');
    src: url('fonts/Chantilly-Medium-webfont.eot?iefix') format('eot'),
         url('fonts/Chantilly-Medium-webfont.woff') format('woff'),
         url('fonts/Chantilly-Medium-webfont.ttf') format('truetype'),
         url('fonts/Chantilly-Medium-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ChantillyLight';
    src: url('fonts/Chantilly-Light-webfont.eot');
    src: url('fonts/Chantilly-Light-webfont.eot?iefix') format('eot'),
         url('fonts/Chantilly-Light-webfont.woff') format('woff'),
         url('fonts/Chantilly-Light-webfont.ttf') format('truetype'),
         url('fonts/Chantilly-Light-webfont.svg#webfontsjE9fLBN') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'FunctionCapsBook';
    src: url('fonts/FunctionCaps-Book-webfont.eot');
    src: url('fonts/FunctionCaps-Book-webfont.eot?iefix') format('eot'),
         url('fonts/FunctionCaps-Book-webfont.woff') format('woff'),
         url('fonts/FunctionCaps-Book-webfont.ttf') format('truetype'),
         url('fonts/FunctionCaps-Book-webfont.svg#webfontuHPlF47t') format('svg');
    font-weight: book;
    font-style: normal;
}

@font-face {
    font-family: 'FunctionCapsMedium';
    src: url('fonts/functioncaps_medium_macroman/FunctionCaps-Medium-webfont.eot');
    src: url('fonts/functioncaps_medium_macroman/FunctionCaps-Medium-webfont.eot?iefix') format('eot'),
         url('fonts/functioncaps_medium_macroman/FunctionCaps-Medium-webfont.woff') format('woff'),
         url('fonts/functioncaps_medium_macroman/FunctionCaps-Medium-webfont.ttf') format('truetype'),
         url('fonts/functioncaps_medium_macroman/FunctionCaps-Medium-webfont.svg#webfontuHPlF47t') format('svg');
    font-weight: medium;
    font-style: normal;

}
@font-face {
    font-family: 'functionpromedium';
  
    src: url('fonts/functionProfunctionPro/web_fonts/functionpro_book_macroman/FunctionPro-Book-webfont.eot');
    src: url('fonts/functionPro/web_fonts/functionpro_book_macroman/FunctionPro-Book-webfont.eot?iefix') format('eot'),
         url('fonts/functionPro/web_fonts/functionpro_book_macroman/FunctionPro-Book-webfont.woff') format('woff'),
         url('fonts/functionPro/web_fonts/functionpro_book_macroman/FunctionPro-Book-webfont.ttf') format('truetype'),
         url('fonts/functionPro/web_fonts/functionpro_book_macroman/FunctionPro-Book-webfont.svg#webfont') format('svg');
    font-weight: book;
    font-style: normal;

}

@font-face {
    font-family: 'Museo300';
   
    src: url('fonts/museo300/web_fonts/museo_300_macroman/Museo300-Regular-webfont.eot');
    src: url('fonts/museo300/web_fonts/museo_300_macroman/Museo300-Regular-webfont.eot?iefix') format('eot'),
         url('fonts/museo300/web_fonts/museo_300_macroman/Museo300-Regular-webfont.woff') format('woff'),
         url('fonts/museo300/web_fonts/museo_300_macroman/Museo300-Regular-webfont.ttf') format('truetype'),
         url('fonts/museo300/web_fonts/museo_300_macroman/Museo300-Regular-webfont.svg#webfont') format('svg');
    font-weight: normal;
    font-style: normal;

}

html, body, div, br, span, ul, li, ol, h1, h2, h3, h4, p {
	margin: 0; 
	padding: 0; 
	}
header, section, article, nav, footer{
     display: block;
}
	
html, body{
	height: 100%;
	background-color:#fff;
	color:#4E4B42;
	font-size:20px;
	font-family: 'ChantillyMedium', futura, "centry gothic", applegothic, sans-serif;
	letter-spacing:.03em;
	}
	

p{margin-top:.1em;}



a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:underline;}

h1{
font-size:2.3em;
margin-top:1em;

font-family: 'Mate SC', sans-serif;
}

h2{
font-size:1.5em;
margin-top:.5em;
font-family: 'Mate SC', sans-serif;
}

h3{
	margin-left: 0px;
	margin-right: 0px;
	margin-top:.3em;
	margin-bottom: 0px;
	font-size:1.2em;
	font-family: 'Mate SC', sans-serif;
	}
	
h4{
font-size:1em;
margin-top:.3em;
font-family: 'Mate SC', sans-serif;
}


.no_border{
border:none;
}

#wrapper{
position:relative;
width: 980px;
height:auto;
margin-right:auto;
margin-left:auto;
padding-bottom:300px;
z-index:10;
}



/*
.section_trim{
background-image:url(images/top_bar.png);
position:relative;
height:1px;
width:100%;
}
*/

#right_two_columns > .top-image{
width:100% !important;
}

#main{
	position:relative;
	}

.float-right{
	float:right;
	}

/*********************banner*********************/
#bannertrim{
/**background-image:url(images/top_bar.png);**/
background-color:#42506D;
position:absolute;
top: 0px;
left:0px;
height:8px;
width:100%;
z-index:1;
}

#logo{
position:relative;
margin-left:2%;
top:22px;
width:28%;
}

#slogan{
position:relative;
margin-left:3%;
width:25%;
top:10px;
left:
}
/*********************end banner*********************/

/*********************navigation*********************/
#nav span a{
margin:8px 4px 0px 4px;
padding:0px 7px 0px 7px;
background-image:url(images/top_bar.png);
font-family:'FunctionCapsbook', sans-serif;
letter-spacing:.05em;
text-decoration: none;
color:#EEF5FF;
font-size: 28px;
}

#navwrapper{
position:relative;
max-width: 980px;
height:auto;
margin-right:auto;
margin-left:auto;
z-index:10;
}

#nav{
position:absolute;
top:-41px;
right:2%;
font-family:'FunctionCapsMedium', sans-serif;
font-size:1.2em;
font-weight:normal;
z-index:10;
width:auto;
}


/*********************end navigation*********************/

/*********************start footer*********************/
#footer-wraper{
position:relative;
max-width: 980px;
height:auto;
margin-right:auto;
margin-left:auto;
z-index:10;
}

#footer{
	background-image:url(images/top_bar.png);
	margin:-300px 0 0 0;
	margin:0px;
	position:relative;
	clear:both;
	height:300px;
	width:100%;
	color:#EEF5FF;
	}
	
#form{
	position:relative;
	width:65%;
	margin: 20px 2% 0% 0%;
	float:right;
	border-width:1px;
	border-color:#EEF5FF;
}

#footer_tip{
	position:relative;
	width:28%;
	margin: 20px 2% 0% 2%;
	float: right;
}

.footer-form-background-color{
background-image:url(images/top_bar.png);
border-width:1px;
border-color:#EEF5FF;
border-style:solid;
padding: 5px;
font-size: 14px;
}

input{
width:65%;
}

#submit1{
color:#EEF5FF;
width:60px;
}
/*********************end footer*********************/

/*********************index*********************/
.index #right_two_columns img {
	width: 100%;
}
#right_two_columns{
position:relative;
float:right;
width:65%;
top:-80px;
}
#left_column{
position:relative;
float:right;
margin-right:2%;
margin-left:2%;
width:28%;
top:22px;
padding-right:3%;
}
#index_left_column{
position:relative;
float:right;
margin-right:3%;
margin-left:1%;
width:28%;
top:22px;
padding-right:3%;
}
#right_column{
position:relative;
width:48%;
float:right;
top:0px;
}

#center_column{
position:relative;
width:48%;
float:right;
padding-right:4%;
}

#main_image{
position:relative;
border-color:#4E4B42;
border-width:1px;
border-style:solid;
width:96%;
}

.grit_image{
margin:10px 0% 5px 0%;
width:100%;
border-color:#4E4B42;
border-width:1px;
}

.index_image{
margin:10px 0% 5px 0%;
width:100%;
border-color:#4E4B42;
border-width:1px;
}

#image{
position:absolute; 
height:100%;
width:100%;
border-color:#4E4B42;
border-width:1px;
}

.bio{
position:relative;
}
		
		/*********************end index*********************/

/*********************start green*********************/

.trail_image{
margin:10px 4% 5px 1%;
width:50%;
float: left;
}
#trail-memories-image{
margin:10px 4% 5px 1%;
width:100%;
float: left;
}

.green-side{
position:relative;

}


		/*********************start tips gallery*********************/
#green-text-box{
height:80px;
width:50%;
}

#tips-gallery{
position:relative;
width:96%
height:407px;
margin-bottom:20px;
margin-left: 1%;
z-index:10;
}

.tips-gallery-main-image-container{
position:relative;
height:auto;
width:44%;
margin-left:2%;
bottom:1px;
}

.tips-gallery-image{
position:relative;
bottom:1px;
}

#thumb-1{
position:relative;
cursor: pointer;
}

#thumb-2{
position:relative;
cursor: pointer;
}

#thumb-3{
position:relative;
cursor: pointer;
}

#thumb-4{
position:relative;
cursor: pointer;
}

#align-bottom-one{
position:relative;
margin-top:189px;
}
#align-bottom-three{
position:relative;
margin-top:205px;
}

#align-bottom-four{
position:relative;
margin-top:179px;
}

	/*********************end tips gallery*********************/

/*********************end green*********************/

/*********************start grit*********************/
#grit-memories-image{
margin:10px 4% 5px 1%;
width:100%;
}
/*********************end grit*********************/

/*********************start new memory*********************/
#memories-upper-content{
position:relative;
width:65%
height:100px;
background-color:purple;
}

#memories-right-two-columns{
position:relative;
width:65%;
height:300px;
background-color:red;
float:right;
}

#memories-right-column{
position:relative;
width:45%;
height:300px;
background-color:blue;
float:right;
}

#memories-center-column{
position:relative;
width:45%;
height:300px;
background-color:green;
float:right;
margin-right:4%;
}

#memories-left-column{
position:relative;
width:32%;
height:300px;
background-color:pink;
float:right;
}
/*********************end new memory*********************/

/*********************start old memory*********************/
			/*********************start survey*********************/

#survey h3{
	margin-left: 0px;
	margin-right: 0px;
	margin-top:.3em;
	margin-bottom: 0px;
	font-size:1em;
	font-family: 'Mate SC', sans-serif;
}

#survey{
position:relative;
width:98%;
height:280px;
margin-bottom:0px;
margin-left: 1%;
clear:both;
z-index:10;
}

#option-one{
width:35%;
cursor: pointer;
}

#option-two{
width:35%;
cursor: pointer;
}

#option-three{
width:35%;
cursor: pointer;
}

#option-four{
width:35%;
cursor: pointer;
}

#survey-submit{
padding:1px 3px;
background-image:url(images/top_bar.png);
width:55px;
font-family:'FunctionCapsbook', sans-serif;
letter-spacing:.05em;
color:#EEF5FF;
margin-top:10px;
cursor: pointer;
}

#survey-hiking-pic{
position:relative;
margin-top:-200px;
}

#survey-camping-pic{
position:relative;
margin-top:-200px;
}

#survey-backpacking-pic{
position:relative;
margin-top:-200px;
}

#survey-mountaineering-pic{
position:relative;
margin-top:-200px;
}

#survey-prototype{
position:relative;
margin-top:-200px;
}

#survey-image{
width:50%;
}

.survey-image-width{
margin-left:6%;
width:94%;
}	

	/*********************end survey*********************/
/*********************end old memory*********************/



@media only screen and (max-width: 975px){
	#wrapper{
		max-width:975px;
		width:93%;
		margin-right:7%;
		margin-left:2%;
	}
	#leftBlock{
		background-color:red;
		width:20%;
		height:200px;
		margin-right:2%;
		float:left;
	}
	#centerBlock{
		width:56%;
		float:left;
		margin-top:10px;
	}
	#rightBlock{
		width:20%;
		float:right;
		margin-left:2%;
		margin-top:10px;
		
	#image{
	height:100%;
	width:100%;
	
	.big{position:absolute;
		top:300px;
		bottom:300px;}
	.medium{position:absolute;
		top:300px;
		bottom:300px;
		opacity:0;}
	.small{position:absolute;
		top:300px;
		bottom:300px;
		opacity:0;}
	}
}

}

@media only screen and (max-width: 800px){
	#survey {
		display: none;
	}
	.top-image{
		display:none;
		}
		
	#logo{
		position:relative;
		margin-left:25%;
		width:50%;
		margin-bottom:10px;
		}
		
	#slogan{
	width:44%;
	margin-left:28%;
	top:5px;
	}
	
	#left_column{
		float:none;
		position:relative;
		margin-right:2%;
		margin-left:2%;
		width:96%;
		}
	
	#index_left_column{
		float:none;
		position:relative;
		padding-left:4%;
		width:93%;
		}
	#right_two_columns{
	
		width:94%;}
		
	#right_column{
	position:relative;
	top:60px;
		}
		
	#center_column{
	position:relative;
	top:60px;
		}
.index_image{
width:46%;
margin-left:4%;
float: right;
}
.index_image_right_columns{
width:100%
}
	#image{
	height:100%;
	width:100%;
	
	}
	
	.bio{
position:relative;
float:left;
width:40%;
}

	#trail-memories-image{
width:50%;
float:left;
}

#cabin{
position:relative;
top:60px;

}

.green-side{
top:20px;
}

#tips-gallery{
margin-top:80px;
}

#grit{
position:relative;
top:60px;
margin-bottom:60px;

}
	
#memories{
position:relative;
top:60px;
}

.memories-image{
	width:100%;}	


#survey{
margin:70px 0px 0px 0px;
}

.survey-image-width{
margin-left:6%;
width:98%;
}
}
@media only screen and (max-width: 500px){
.grit_image{
	width:97%;
	}

	.bio{
position:relative;
float:none;
width:97%;
}

.index_image{
width:97%;
margin-left:0%;
}

	#right_column{
		width:98%;
		float:none;
		margin-right:2%;
		}
	
	#center_column{
		width:98%;
		float:none;
		margin-right:2%;
		}
		
	#left_column{
		width:98%;
		float:none;
		margin-right:2%;
		}
	
	#footer_tip{
		display:none;
	}

	#form{
	position:relative;
	width:80%;
	margin: 20px 10% 0% 10%;

	}

	#nav{
	position:relative;
	top:0px;
	font-size:.8em;
	padding-top:4px;
	width:392px;
	margin-right:auto;
	margin-left:auto;
	
	}	
	
	#logo{
	margin-left:25%;
	width:50%;
	}
	#slogan{
	margin-left:28%;
	width:44%;
	top:5px;
	}
	.memories-image{
	width:100%;}

#trail-memories-image{
width:98%;
float: none;
}

#tips-gallery{
display:none;
}

.green-side{
top:60px;
}

.trail_image{
margin:10px 4% 5px 0%;
width:100%;
float: none;
}


#grit-memories-image{
margin:10px 4% 5px 0%;
width:100%;
}

#survey{
display:none;
}

#nav span a{
padding:0px 4px 0px 4px;
width:244;
}


}

