/*
Green: #AFCC67
Purple: #24164D
Gray: #E6E6E6
Black: #000000
White: #FFFFFF
font-family: 'Crimson Text', serif;
*/


/*Replace headshotBackup class with headshot class when headshot is available*/

#aboutHeader {
	text-align: center;
	/*align left when headshot comes in*/
	margin-left: 5vw;
}
#aboutHeader h1 {
	display: inline-block;
	font-size: 78px;
	font-weight: 100;
	letter-spacing: 8px;
}
#aboutNav {
	display: inline-block;
	font-size: 0px;
	margin-left: 30px;
	text-align: left;
}
#aboutNav div {
	font-size: 28px;
	display: block;
	-webkit-transition: all .5s ease;
	transition: all .5s ease;
	cursor: pointer;
}
#aboutNav img {
	height: 25px;
	opacity: 0;
	filter: alpha(opacity=0);
}
#aboutNav .selected {
	color: #AFCC67;
}
#aboutNav .selected img {
	opacity: 1;
	filter: alpha(opacity=100);
}
#aboutNav div:hover {
	color: #AFCC67;
}
#content div p {
	font-size: 22px;
	color: black;
}
#headshot {
	height: 575px;
	width: 400px;
	border: 5px solid black;
	display: inline-block;
	margin-left: 5vw;
	margin-bottom: 50px;
}
#headshot img {
		height: 575px;
		width: 400px;
}
#content div {
	vertical-align: top;
	font-family: 'Crimson Text', serif;
}
#content {
	text-align: center;
	/*remove when headshot comes*/
}
#biography {
	width: 50vw;
	display: inline-block;
	margin-left: 5vw;
	text-align: left;
	/*remove text-align when headshot available*/
}
#resources {
	width: 50vw;
	display: none;
	margin-left: calc(5vw);
	text-indent: -30px;
	text-align: left;
	/*remove text-align when headshot available*/
}
@media (max-width: 1200px) {
	#headshot {
		margin: auto;
		display: block;
		margin-top: 10px;
	}
	#biography {
		width: 90vw;
	}
	h1 {
		margin-bottom: 0px;
	}
	#resources {
		width: 90vw;
	}
	#aboutNav {
		display: block;
		margin-left: 0px;
		text-align: center;
	}
	#aboutHeader {
		text-align: center;
	}
}
@media (max-width: 600px) {
	#headshotBackup {
		height: 500px;
		width: 300px;
	}
	#aboutHeader {
		margin-left: 0px;
	}
	#aboutHeader h1 {
		font-size: 50px;
	}
}