body
{
	margin: 0;
	font-family: 'Helvetica', 'Arial', sans-serif;
	font-style: normal;
	z-index: -1;
	background-color: #e9e0db;
	height: 2000px;
	font-size: 14px;
	line-height: 1.2;
}



#banner_logo
{
	position:fixed;
	z-index:101;
	top: 0;
}

#mainbody
{
	/*outline: solid black 1px;*/
	position: relative;
	width: 80%;
	left:10%;
	top: 8em;
	height: 90%;
	z-index: 0;
	/*background-color: rgba(249,246,244,.35);*/

}

#nav
{
	font-size: 160%;
	position:fixed;
	top: 0;
	width: 100%;
	height: 90px;
	overflow:hidden;
	background-color: rgba(249,246,244,.93);
	box-shadow: 1px 2px 3px rgba(249,246,244,.93);
	z-index: 100;
	/*background-color: rgba(204,204,204,.99);*/
}

ul.nav
{
	list-style-type: none;
	padding: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	overflow:hidden;
}

.nav li
{
	position: relative;
	display: inline-block;
	height: 100%;
	float: right;
	right: .25em;
	margin-left: 1em;
	width: 8em;
}

.nav a
{
	display: flex;
	position: relative;
	width: 100%;
	height: 100%;
	text-align: center;
	align-items: center;
	justify-content: center;

	text-decoration: none;
	color: #4f2412;
	transition: color .8s ease;
}

.nav a:link
{
	text-decoration: none;
	color: #4f2412;
}

.nav a:visited
{
	text-decoration: none;
	color: #4f2412;
}

.nav a:hover
{
	text-decoration: none;
	color: #e0b33b;
}

.nav a.active
{
	color: #e0b33b;
}

#subnav
{
	font-size: 110%;
	position:fixed;
	margin-top: none;
	background-color: rgba(249,246,244,.93);
	box-shadow: 1px 2px 3px rgba(249,246,244,.93);

	/*outline: solid red 1px;*/
	z-index: 1000;
	top: 90px;
	width:100%;
	white-space: nowrap;
	height: 1.2em;
}
#subnav li
{
	right:2%;
	position: relative;
}

#mainbody.AoP
{
	top:140px;
}
#nav.AoP
{
	box-shadow: none;
}

/* MAIN BODY CSS STYLING*/

.left_text
{
	position: relative;
	float: left;
	width: 59%;
	left: 1%;
	min-height: 20em;
	margin-top: 5px;
	margin-bottom: 5px;
	box-shadow: 1px 1px 4px 4px rgba(0,0,0,.35);
	background-color: #f9f6f4;
}
.right_text
{
	position: relative;
	float: right;
	width: 59%;
	right: 1%;
	min-height: 20em;
	margin-top: 5px;
	margin-bottom: 5px;
	box-shadow: 1px 1px 4px 4px rgba(0,0,0,.35);
	background-color: #f9f6f4;
}

.left_image
{
	float: left;
	display: inline-block;
	width: 40%;
	height: 20em;
	overflow: hidden;
	margin-top: 5px;
	margin-bottom: 5px;
}
.left_image img
{
	position:relative;
	display: inline-block;
	width:90%;
	left:5%;
	height:95%;
	top:2.5%;
	outline: solid #f9f6f4 3px;
}
.right_image
{
	float: right;
	display: inline-block;
	width:40%;
	height: 20em;
	overflow: hidden;
	margin-top: 5px;
	margin-bottom: 5px;
}
.right_image img
{
	position:relative;
	display: inline-block;
	width:90%;
	left:5%;
	height:95%;
	top:2.5%;
	outline: solid #f9f6f4 3px;
}


.card_title
{
	text-align: center;
	padding:1em;
	font-family: 'Helvetica', 'Arial', sans-serif;
	margin: 0;
}

p.AoP
{
	padding: 2em;
	position: relative;
	margin: 0;
}

.Banner
{
	position:relative;
	width: 90%;
	left:5%;
	height: 45em;
	top:2em;
	outline: solid #f9f6f4 5px;
}

#About_Us_Banner
{
	position: absolute;
	height: 25em;
	left: 15%;
	width: 70%;
	outline: solid #f9f6f4 5px;
}


#AoP
{
	position: relative;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);
	width: 18em;
	height: 25em;
	left: 5%;
	top: 6%;
	background-color: #f9f6f4;
}
#AoP h3
{
	width: 100%;
	text-align: center;
	padding-top: .5em;

}

#AoP li
{
	padding: .5em;
	font-size: 160%;
}
#AoP a:link
{
	position: relative;
	left: 2%;
	width: 100%;
	text-decoration: none;
	color: #4f2412;
	list-style: none;
	transition: color .8s ease;
}
#AoP a:visited
{
	text-decoration: none;
	color: #4f2412;
	list-style: none;
}
#AoP a:hover
{
	color: #e0b33b;
}

#bio
{
	position: relative;
	bottom: 24em;
	width: 50em;
	left: 33%;
	height: 41em;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);
	background-color: #f9f6f4;
}

p.bio
{
	position: relative;
	padding: 1em;
}
h3.bio
{
	position: relative;
	padding: .5em;
	text-align: center;
	width: 100%;
	margin: 0;
}
img.bio
{
	outline: black solid 1px;
	float: left;
	margin-right: .5em;
	margin-bottom: .5em;
}

.invisible
{
	visibility: hidden;
}


.left_column
{
	width: 28%;
	position: relative;
	top: 27em;
	left: 5%;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);
	float: left;
	height: 42em;
	background-color: #f9f6f4;
}
.About_Us_Titles
{
	padding-top: .2em;
	position: relative;
	text-align: center;
	font-style: italic;
}
.left_column li
{
	padding: .5em;
}

.middle_column
{
	position: relative;
	display: inline-block;
	width: 28%;
	top: 29.7em;
	left: 8%;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);
	height: 45.8em;
	background-color: #f9f6f4;
}
.About_Us_Paragraph
{
	padding: 1em;
}

#award
{
	outline: solid black 1px;
	position: relative;
	top: 1.5em;
	width: 100%;
}

.right_column
{
	width: 28%;
	position: relative;
	top: 27em;
	right: 5%;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);
	float: right;
	height: 42em;
	background-color: #f9f6f4;
}


#map
{
	outline: solid #f9f6f4 5px;
	width: 600px;
}

#contact_box
{
	position: absolute;
	display: inline-block;
	background-color: #f9f6f4;
	padding: 1em;
	width: 40%;
	float: right;
	left: 650;
	top: 4%;
	height: 50%;
	box-shadow: 4px 4px 4px 4px rgba(0,0,0,.35);

}
#contact_box h3
{
	text-align: center;
	position: relative;
	padding: 0;

}

#contact_info
{
	list-style: none;
	text-decoration: none;
	font-size: 90%;

}
#contact_info a
{
	text-decoration: none;
	transition: color ease .8s;
	color: black;
	text-decoration: underline;
}
#contact_info a:hover
{
	color: #e0b33b;
}
#contact_info td
{
	padding: .6em;
	position: relative;
}
#contact_info tr
{
	padding: .6em;
	position: relative;
}

#footer
{
	display: block;
	max-width: 1147px;
	margin-left: auto;
	margin-right: auto;

}

#spanish_button
{
    background-color: rgba(249,246,244,.93);
    border: none;
    padding: 15px 32px;
    text-align: center;
    font-size: 100%;
    cursor: pointer;
    box-shadow: 0px 0px 4px 4px rgba(0,0,0,.35);
    position: fixed;
    top: 13%;
    right: 0;
    transition: color ease .8s;
}

#spanish_button:hover
{
	color: #e0b33b;
}



@media screen and (min-width: 480px) 
{
    body 
    {
	font-size: 9px;
	height: 165%;
	}

	#bio
	{
		width: 60em;
	}
	#bio img
	{
		width: 15em;
	}
	#bio h3
	{
		font-size: 170%;
	}
	#AoP
	{
		height: 27em;
	}
	#AoP li
	{
		position: relative;
		width: 90%;
		right: 10%;
		font-size: 140%;
	}
	#AoP h2
	{
		font-size: 200%;
	}
	#AoP h3
	{
		font-size: 170%;
	}
	#AoP_Body
	{
		height: 165%;
	}
	#AoP_Body #spanish_button
	{
		top: 16%;
	}
	#About_Us_Body
	{
		height: 120%;
	}

	.left_column
	{
		top: 29.8em;
	}
	.right_column
	{
		top: 29.8em;
	}
	.middle_column
	{
		height: 42em;
	}
	#Contact_Us_Body
	{
		height: 70%;
	}
	#Contact_Box
	{
		font-size: 140%;
		top: 12%;
		width: 15em;
		text-align: left;
	}
	#map
	{
		position: relative;
		top: 7%;
	}

}

@media screen and (min-width: 1000px) 
{
    body 
    {
	font-size: 16px;
	height: 280%;
	}

	h3
	{
		font-size: 130%;
	}
	h2
	{
		font-size: 130%;
	}

	#AoP
	{
		width: 18em;
		height: 25em;
	}

	#bio
	{
		bottom: 23em;
		width: 50em;
		height: 46em;
	}

	#bio img
	{
		width: 12em;
	}

	#Contact_Us_Body
	{
		height: 100%;
	}
	#Contact_Box
	{
		font-size: 140%;
	}

	#AoP_Body
	{
		height: 305%;
	}

	#About_Us_Body
	{
		height: 223%;
	}
	.left_column
	{
		height: 43em;
	}
	.middle_column
	{
		top: 29.8em;
		height: 43em;
	}
	.right_column
	{
		height: 43em;
	}


}


@media screen and (min-height: 900px) and (min-width: 1000px)
{
    body 
    {
	font-size: 18px;
	height: 229%
	}

	h3
	{
		font-size: 120%;
	}
	h2
	{
		font-size: 120%;
	}

	#AoP
	{
		width: 18em;
		height: 25em;
	}

	#bio
	{
		bottom: 23em;
		width: 50em;
		height: 47em;
	}

	#bio img
	{
		width: 12em;
	}

	#Contact_Us_Body
	{
		height: 100%;
	}
	#Contact_Box
	{
		font-size: 140%;
		float: right;
		top: 5%;
		left: 60%;
	}

	#AoP_Body
	{
		height: 235%;
	}

	#About_Us_Body
	{
		height: 165%;
	}
	.left_column
	{
		height: 37em;
	}
	.middle_column
	{
		top: 29.8em;
		height: 37em;
	}
	.right_column
	{
		height: 37em;
	}


}