@charset "utf-8";
/* CSS Document */

html {
	background-color: rgb(246, 244, 230);
}

body {
	font-family: 'Raleway', sans-serif; font-size:21px;
}

#about_FD{
	margin-top:50px;
	height:auto;
	width:950px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:30px;
	
}

.card_header{
	font-size:30px;
	color: rgb(231, 71, 13);
	width:100%;
	margin-top:25px;
	margin-left:10px;
	width: 100%;
	height:auto;

}
.card_content {
	
	color:rgb(117, 76, 36);
	width:85%;
	margin-top:20px;
	margin-left:10px;

}

.card_content_link {
	
	color: rgb(231, 71, 13);
	width:85%;
	margin-top:20px;
	margin-left:10px;
	transition: color 0.3s ease;
}

.card_content_link:hover {
	color:rgb(117, 76, 36);
}

#map-canvas {
	width:50%;
	margin-top:85px;
	margin-bottom:15px;
	height: 300px;
	z-index:0;
	float:left;
	position:relative;
	
}


#FD_card {
	float:left;
	margin-top:50px;
	width:50%;
	height:auto;
	background-color: rgb(246, 244, 230);
}


#officers {
	margin-left:auto;
	margin-right:auto;
	width:950px;
	height:1625px;
	margin-top:50px;
}

#officers img{
	display:block;
	margin:auto;
}

#officers_container{
	margin-left:auto;
	margin-right:auto;
	width:100%;
	height:auto;
	margin-top:70px;
	float:left;
}
#officers_container2{
	margin-left:auto;
	margin-right:auto;
	width:100%;
	height:auto;
	margin-top:70px;
	float:left;
}

#stephen {
	
margin-left:20%;
}
#heather {
	
margin-left:15%;
}



#officers img {
	margin-left:auto;
	margin-right:auto;
}

.officer {
	width:250px;
	height:660px;
	float:left;
	margin-left:50px;
}



#officer_header{
	font-size:36px;
	color:rgb(117, 76, 36);
	width:100%;
	text-align:center;
	padding-top:30px;

}

.officer_name{
	font-size:30px;
	color: rgb(231, 71, 13);
	padding-top:15px;
	text-align:center;
}
.officer_title{
	font-size:21px;
	color: rgb(231, 71, 13);
	padding-top:15px;
	text-align:center;
}

.officer_about{
	
	padding-top:15px;
	text-align:center;
	color:rgb(117, 76, 36);
}


#description_wrapper{
	width:100%;
	height:auto;	
	background-position:top;
}

#description_wrapper2{
	width:950px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	margin-top:350px;
	background-position:center bottom;
	background-repeat:no-repeat;
}

#description{
	height:auto;
	width:90%;
	float:left;
	padding-top:30px;
}

#description_left{
	width:600px;
	float:left;
}

#description_right{
	width:300px;
	margin-top:75px;
	float:left;
}





.objective_header {
	font-size:30px;
	color: rgb(231, 71, 13);
	width:100%;
	margin-top:25px;
	width: 100%;
	height:auto;
}



#objective{
	height:auto;
	width:90%;
	margin-top:30px;

	padding-bottom:30px;
	

}

.description_header {
	margin-bottom:15px;
	font-size:30px;
	color: rgb(231, 71, 13);
	margin-top:25px;
	margin-left:20px;

}



.description_content{
	color:rgb(117, 76, 36);
	width:90%;
	margin-left:20px;
	margin-bottom:30px;
}

.object_header {
	margin-bottom:15px;
	font-size:30px;
	color: rgb(231, 71, 13);
	margin-top:25px;
	margin-left:20px;

}

.object_content{
	color:rgb(117, 76, 36);
	width:90%;
	margin-left:20px;
	
}


#objective_text{
	float:left;
	height:auto;
	
}


	



@media only screen and (max-width: 884px) {	

@-ms-viewport { width: 884px; }
	
#description_wrapper2{
	width:100%;
	margin-top:300px;
}
#description_wrapper{
	
	margin-top:0px;
}

#description{
	margin-left:40px;
}

#objective{
	margin-left:40px;
}
#about_FD{
	width:100%;
	height:auto;

}



.card_header{
	width:85%;
}

#about_FD{
	
	margin-left:45px;
}

#officers {

	width:100%;
	height:2400px;
	margin-left:auto;
	margin-right:auto;
}

.officer{
	
	width:40%;
	
}

.officer img{
	
	margin-left:auto;
	margin-right:auto;
}

#officers_container{
	width:100%;
	margin-left:auto;
	margin-right:auto;
}


.officer_name{
	max-width:250px;
}
.officer_title{
	max-width:250px;
}
.officer_about{
	max-width:250px;
}

#stephen {
	
margin-left:5%;
}
#heather {
margin-left:25%;
}
@media only screen and (max-width: 668px)  {
	
@-ms-viewport { width: 668px; }

#description_wrapper2{
	background:none;
}
#description_wrapper{
	background:none;
}
.object_content{
	color: rgb(117, 76, 36);
}

.description_content{
	color: rgb(117, 76, 36);
}

#about_FD{
	margin-top:0px;
	width:100%;
	margin-left:45px;
}

#FD_card {
	margin-top:0px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
}

#map_wrapper{
	width:100%;
	
}
#map-canvas{
	width:100%;
	margin-left:-45px;
	
}


.officer{
	margin-top:0px;
	margin-bottom:0px;
	padding-top:35px;
	padding-bottom:0px;
	width:100%;
	margin-left:auto;
	margin-right:auto;
	height:auto;
}


#officers_container{
	margin-left:auto;
	margin-right:auto;
}

.officer_name{
	max-width:none;
	width:70%;
	margin-left:auto;
	margin-right:auto;
}
.officer_title{
	max-width:none;
	width:70%;
	margin-left:auto;
	margin-right:auto;
}
.officer_about{
	max-width:none;
	width:70%;
	margin-left:auto;
	margin-right:auto;
}

#officers {
	height:3000px;

}

#heather {
	margin-left:auto;
	margin-right:auto;
}
#stephen {
	margin-left:auto;
	margin-right:auto;
}

#description_left{
	width:100%;

}

#description_right{
	width:100%;
	margin-top:20px;
	float:left;
}

}

@media only screen and (max-width: 553px) {
	
@-ms-viewport { width: 553px; }

#description_wrapper{
	margin-top:0px;
}

#description_wrapper2{
	margin-top:0px;
}

#about_FD{
	width:100%;
	margin-left:20px;
}
#description{
	margin-left:20px;
}

#objective{
	margin-left:20px;
}


.card_header{
	width:85%;
}

#about_FD{
	
	margin-left:20px;
}

#map-canvas{
	width:100%;
	margin-left:-20px;
	
}
#officers {
	height:3300px;

}
}

@media only screen and (max-width: 420px) {
	
	@-ms-viewport { width: 420px; }
	
	#officers {
	height:3100px;

}
#officers {
	height:3600px;

}

	
}