@charset "UTF-8";
/* CSS Document */
Body{
	font-family: 'Roboto', sans-serif;
	color:#55008F;
	margin: 0px;
	background-color: #50BB8D;
	font-style: normal;
	font-weight: 500;
	font-size: 20px;
}
.logo{
	background-image: url("../images/logosmall.png"); 
	background-repeat: no-repeat;
	height: 154px;
	width: 154px;
	float: left;
	margin: 21px;
}
.logo:hover{
	background-image: url("../images/logobsmall.png"); background-repeat: no-repeat
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
.clearfix {
  overflow: auto;
}
.page-wrapper{
	max-width: 1680px;
	margin-left: auto;
	margin-right: auto;
}
.top-banner{
	width: 100%;
	height: 220px;
	background-image: url("../images/StG8.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
}
.top-banner2{
	width: 100%;
	height: 220px;
	background-image: url("../images/banner2.4.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
}
.top-banner3{
	width: 100%;
	height: 220px;
	background-image: url("../images/ettington3.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;}
.top-banner4{
	width: 100%;
	height: 220px;
	background-image: url("../images/stG9.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;}
.top-banner img{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0px;
}
.top-banner2 img{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0px;
}
.top-banner3 img{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0px;
}
.top-banner4 img{
	width: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0px;
}
.top-banner h1{
	font-family: 'Roboto', sans-serif; font-size: 24px;
	text-align: center;
	color:#FF99D9;
	font-style: normal;
	font-weight: 500;
	margin-bottom: 0px;
}
.top-banner2 h1{
	font-family: 'Roboto', sans-serif; font-size: 24px;
	text-align: center;
	color:#FF99D9;
	font-style: normal;
	font-weight: 500;
	margin-bottom: 0px;
}
.top-banner3 h1{
	font-family: 'Roboto', sans-serif; font-size: 24px;
	text-align: center;
	color:#FF99D9;
	font-style: normal;
	font-weight: 500;
	margin-bottom: 0px;
}
.top-banner4 h1{
	font-family: 'Roboto', sans-serif; font-size: 24px;
	text-align: center;
	color:#FF99D9;
	font-style: normal;
	font-weight: 500;
	margin-bottom: 0px;
}
nav ul {
	text-align: center;
	list-style-type: none;
	padding: 0px;
	margin-top: 5px;
}
nav a {
	text-decoration: none;
	color: #FF99D9;
	margin-bottom: 5px;
	display: block;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color:#000A9B;
	font-family: 'Oswald', sans-serif;
	font-style: normal;
	font-weight: 700;
	font-size: 20pt;
}
nav a:hover{
		background-color: #55008F;
		color: #47CB00;
}
main {
	margin-left: auto;
	margin-right: auto;
	width: 96%;
}
featured {
	margin: 2%;
}
featured-images {
	width: 100%;
	display: block;
}
#pic1 {
	background-image: url("../images/CVB.png")
}
#pic3 {
	background-image: url("../images/Teaching2.png")
}
#pic4 {
	background-image: url("../images/Somerville.png")
}
#pic2 {
	background: url("../images/StG12.png");
		background-size: contain
}
.featured-img {
	width: 200px;
	height: 200px;
	border-radius: 100%;
	background-size: cover;
	margin-left: auto;
	margin-right: auto;
	border-style: solid;
	border-width: thick;
	border-color: #55008F;
}
.featured-img:hover {
	border-color: #8F2E00;
}
.featured-images {
	margin-top: 20px;
	margin-bottom: 20px;
	text-align: center;
	background-color: #336A00;
	border-radius: 15px 50px;
	padding: 20px 0px 0px 0px;
	font-family: 'Roboto', sans-serif;
	font-size: 24pt;
}
.featured {
	width: 48%;
	margin-left: 1%;
	margin-right: 1%;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	text-align:left;
}
.featured h2{
	text-align: center;
	color: #F082D9;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 24pt;
}
.featured p,ul{
	color: white;
	font-size: 24pt;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
}
.container-featured {
	width: 100%;
display: inline-block
}
.footer_container {
		width: 31.25%;
display: inline-block;
	text-align: center; 
	padding: 1%;
	float: left;
}
#topic-one-img {
background-image: url("../images/TPhS.png");
	width: 100%;
	height: 300px;
	background-size: cover;
	border-radius: 15px 50px 15px 50px
}
#topic-two-img {
		background-image: url("../images/bigcod857.jpeg");
	width: 100%;
	height: 300px;
	background-size: cover;
	border-radius: 15px 50px 15px 50px
}
.topic-one h3{
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 20pt;
}
.topic-one p{
	font-family: 'Roboto', sans-serif;
	font-size: 16pt;
}
.topic-two h3{
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 20pt;
}
.topic-two p{
	font-family: 'Roboto', sans-serif;
	font-size: 16pt;
}
.topic-two li{
	color: #55008F;
	font-family: 'Roboto', sans-serif;
	font-size: 16pt;
}
.footer {
	color: #FF99D9;
	width: 100%;
	background-color: #000A9B;
	padding: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.bio-lists li{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 18pt;
}
.bio-text p{
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 18pt;
}
.bio h1{
	font-size: 20pt;
}
.bio {
	padding:0px 20px;
	background-color:#336A00;
	border-radius: 15px 50px 15px 50px;
}
	.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
.bio-text {
	margin-top: 0px;
}
.bio-lists {
	padding:0px 20px;
	border-radius: 15px 50px 15px 50px;
}
.pubs {
	padding:0px 50px;
	width: auto;
	display:block;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#336A00;
	border-radius: 15px 50px;
}
.pubs2 {
	padding:0px 50px;
	width: auto;
	display:block;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#55008F;
	border-radius: 15px 50px;
}
pubs-text {
width: 38%;
	margin-left: 50px;
	margin-right: 50px;
	padding: 50px;
}
.pubs-text a{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 18pt;
}
.pubs-text li{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 18pt;
}
.pubs-text p{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 18pt;
}
.pubs-text h3{
	text-align: left;
	color: white;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 18pt;
}
.pubs-text h1{
	text-align: center;
	color: #F082D9;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 24pt;
}
.pubs-text h2{
	text-align: left;
	color: #F082D9;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 20pt;
}
/* Style inputs with type="text", select elements and textareas */
input[type=text], select, textarea {
  width: 100%; /* Full width */
  padding: 12px; /* Some padding */  
  border: 0px; /* Gray border */
  border-radius: 15px; /* Rounded borders */
  box-sizing: border-box; /* Make sure that padding and width stays in place */
  margin-top: 20px; /* Add a top margin */
  margin-bottom: 20px; /* Bottom margin */
  resize: vertical /* Allow the user to vertically resize the textarea (not horizontally) */;
	background-color: #50BB8D;
	color: #55008F;
}
.input placeholder{
	color: #55008F;
}

/* Style the submit button with a specific background color etc */
input[type=submit] {
  background-color: #000A9B;
  color: #F082D9;
  padding: 12px 20px;
  border: none;
  border-radius: 15px;
  cursor: pointer;
}

/* When moving the mouse over the submit button, add a darker green color */
input[type=submit]:hover {
  background-color: #55008F;
	color: #47CB00;
}

/* Add a background color and some padding around the form */
.container {
  border-radius: 15px 50px 15px 50px;
  background-color: #336A00;
  padding: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	color: white;
	font:"Roboto", sans-serif;
	font-size: 24px
}
@media screen and (max-width: 590px){
	#bio-pic {
	background-image: url("../images/Josh Photo.jpg");
	height:550px;
	width: 90%;
	background-size:cover;
	float: left;
	border-radius: 30px 50px;
	margin: 0px 5% 20px 5%;
	float: right;
	}
.bio-text p{
	color: white;
	text-align: justify;
}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (min-width:591px){
	#bio-pic {
	background-image: url("../images/Josh Photo.jpg");
	height:420px;
	width: 305px;
	background-size:cover;
	float: left;
	border-radius: 30px 50px;
	margin: 0px 20px 20px 30px;
	float: right;
}
	.bio-text p{
		color: white;
		text-align: left;
	}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (max-width:767px){
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
	.featured-images {
		margin-top: 0px;
		margin-bottom: 30px;
	}
}
@media screen and (min-width:768px){
	nav a{
		width: 20%;
		float: left;
		margin-top: 0px;
	}
	#topic-two-img {
	width: 48%;
	float: left;
	margin-right: 2%;
	margin-bottom: 20px;
}
		.featured-img {
		width: 175px;
		height: 175px;
	}
	#topic-one-img {
	width: 48%;
	float: left;
	margin-right: 2%;
	margin-bottom: 20px;
}
	.top-banner {
	width: 100%;
	height: 240px;
	background-image: url("../images/StG9.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
	.top-banner2 {
	width: 100%;
	height: 240px;
	background-image: url("../images/banner2.4.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
	.top-banner3 {
	width: 100%;
	height: 240px;
	background-image: url("../images/ettington3.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
		.top-banner4 {
	width: 100%;
	height: 240px;
	background-image: url("../images/stG9.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
	.featured h2{
		font-size: 28px;
	}
	.featured p,ul{
		font-size: 20px;
	}
	#pic1, #pic2, #pic3, #pic4 {
		width: 250px;
		height: 250px;
	}
}
@media screen and (min-width:878px){
.bio p{
		text-align: justify;
	}
	.bio-education li{
		text-align: justify;
	}
}
@media screen and (max-width:904px){
	.bio-education{
	display: contents;
}
.bio-interests {
	display:contents;
}
	
	.bio-education {
		width: 90%;
		padding: 0px 20px;
		margin: 0px;
	}
	.bio-interests {
		width: 50%;
		padding: 0px 20px;
	}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (min-width:960px){ 
	#pic1, #pic2, #pic3, #pic4 {
		width: 200px;
		height: 200px;
	}
.container-featured {
		width: 48%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.featured-img {
		width: 200px;
		height: 200px;
	}
	.topic-one {
		width: 48%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}
	.topic-two {
		width: 48%;
		float: left;
		margin-left: 1%;
		margin-right: 1%;
	}
	#topic-one-img {
		width: 100%;
	}
	#topic-two-img {
		width: 100%;
	}
	.top-banner {
		width: 100%;
	height: 240px;
	background-image: url("../images/StG7.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
		.top-banner2 {
		width: 100%;
	height: 240px;
	background-image: url("../images/banner2.4.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
		.top-banner3 {
		width: 100%;
	height: 240px;
	background-image: url("../images/ettington3.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
			.top-banner4 {
		width: 100%;
	height: 240px;
	background-image: url("../images/stG9.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
	.logo{
		margin: 41px;
	}
}
.bio h1{
	text-align: center;
	color: #F082D9;
	font-family: 'Oswald', sans-serif;
	font-weight: 700;
	font-size: 24pt;
}
.bio-text h2{
	text-align: center;
	color:#F082D9;
}
.bio-text a{
	text-align: left;
	color: white;
	font-size: 20pt;
}
.bio-interests {
	width: 25%;
	margin-right: 20px;
	float: left;
}
.bio-education {
	width: 70%;
	margin-left: 20px;
	float: left;
}
.bio-education h1{
	text-align: center;
}
.bio-education li{
	text-align: left;
}
.bio-text {
width: 90%;
	margin-left: 20px;
	margin-right: 50px;
}
.bio {
	padding:0px 20px;
	width: auto;
	display:inline-block;
	float: left;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#336A00;
	border-radius: 15px 50px 15px 50px;
}
.bio-lists{
	float: left;
	width:auto;
	background-color: #55008F;
	border-radius: 15px 50px;
	padding: 0px 10px 20px 10px;
	margin-bottom: 20px;
	margin-top: 0px;
}
.bio-lists h2{
		color: #F082D9;
}
@media screen and (min-width:1640px){
	.top-banner {
		width: 100%;
	height: 240px;
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
	.top-banner2 {
		width: 100%;
	height: 240px;
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
		.top-banner3 {
		width: 100%;
	height: 240px;
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
		.top-banner4 {
		width: 100%;
	height: 240px;
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}}
@media screen and (min-width:1043px){
	#bio-pic {
		height: 500px;
		width: 400px;
	}
	.bio{
		background-color: #336A00;
	}
	.bio-text p{
	font-size: 20pt;
	}
	.bio h1 {
		font-size: 28pt;
	}
			.bio-lists h2{
		font-size: 28pt;
		color: #F082D9;
	}
		.bio-education h2{
	text-align: center;
	}
	.bio-lists li{
		font-size: 20pt;
	}
		.bio-interests {
		float: right;
}
	.pubs {
		font-size: 20pt;
	}
		.pubs2 {
		font-size: 20pt;
	}
	pubs-list li{
		font-size: 20pt;
	}
	.pubs-text h1{
		font-size: 28pt;
		font-family: "Oswald", sans-serif;
		font-weight: 700;
	}
	.featured {
		padding: 0px 20px;
	}
	.featured h2{
		font-size: 20pt;
	}
	.featured p{
		font-size: 16pt;
		text-align:left;
	}
	#research_home p{
		padding: 0px 0px;
	}
	.topic-one h3{
		font-size: 24pt;
	}
	.topic-one p{
		font-size: 18pt;
	}
		.topic-two h3{
		font-size: 24pt;
	}
	.topic-two p {
		font-size: 18pt;
	}
	.topic-two li{
		font-size: 18pt;
	}
	.footer h3{
		font-size: 18pt;
	}
	.footer p{
		font-size: 14pt;
		font-family: "Roboto", sans-serif;
	}
	.row {
		font-size: 20pt;
		font-family: "Roboto", sans-serif;
	}
	.bio {
	padding:20px;
	width: auto;
	display:block;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#336A00;
	border-radius: 15px 50px 15px 50px;
}
	.pubs li {
		font-size: 20pt;
	}
	.pubs {
	padding:20px 40px;
	width: auto;
	display:block;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#336A00;
	border-radius: 15px 50px 15px 50px;
}
	.pubs2 {
	padding:20px 40px;
	width: auto;
	display:block;
	margin-top: 20px;
	margin-bottom: 20px;
	background-color:#55008F;
	border-radius: 15px 50px 15px 50px;
}
pubs-text {
width: 38%;
	margin-left: 50px;
	margin-right: 50px;
	padding: 20px 20px 20px 20px;
}
.pubs-text a{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 20pt;
}
.pubs-text li{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 20pt;
}
.pubs-text p{
	text-align: left;
	color: white;
	font-family: "Roboto", sans-serif;
	font-weight: 500;
	font-size: 20pt;
}
.pubs-text h3{
	text-align: left;
	color: white;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 20pt;
}
.pubs-text h1{
	text-align: center;
	color: #F082D9;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 28pt;
}
.pubs-text h2{
	text-align: left;
	color: #F082D9;
	font-family: "Oswald", sans-serif;
	font-weight: 700;
	font-size: 24pt;
}
}
@media screen and (min-width:1210px){
.featured h2{
		font-size: 24pt;
	}
}@media screen and (min-width:1372px){
	#research_home p{
		text-align: justify;
	}
	.bio-interests {
		float: right;
	}
	#bio-pic {
		height: 555px;
		width: 410px;
	}
}
/*Changed §*/
@media screen and (max-width: 955px){
	.nav-bar a{
		font-size: 18pt;
		margin-bottom: 1px;
		padding: 2px 0px 0px;
	}
}
@media screen and (max-width: 590px){
	.main p{
		font-size: 16pt;
	}
	.main a{
		font-size: 16pt;
	}
	.main li{
		font-size: 16pt;
	} 
	.main h2{
		font-size: 20pt;
	}
	.main h1{
		font-size: 24pt;
	}
	.main h3 {
		font-size: 20pt;
	}
	#biopic {
		width: 150px;
		height: 100px;
	}
	.bio-text {
		padding-bottom: 20px;
		padding-right: 0px;
	}
	.container-featured {
		width: 100%;
margin: 0px;
		padding: 0px;
	}
	#pic1, #pic2, #pic3, #pic4 {
		width: 200px;
		height: 200px;
	}
	.featured {
		width: 46%;
		margin-left: 2%;
		margin-right: 2%;
		padding: 0px;
	}
	.featured-images {
		margin-top: 0px;
		margin-bottom: 30px;
		padding: 20px 5px 0px;
	}
	.featured h2{
		font-size: 24pt;
	}
	.footer p{
		font-size: 12pt;
	}
	.footer h3 {
		font-size: 16pt;
	}
	.pubs {
		padding: 10px 20px;
		margin-top: 0px;
		margin-bottom: 30px;
	}
		.pubs2 {
		padding: 10px 20px;
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.nav-bar a{
		font-size: 20pt;
		margin-bottom: 5px;
		padding: 2px 0px;
	}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (max-width: 535px){
	#bio-pic {
		height: 500px;
		width: 90%;
		float: left;
	}
	.bio-text p{
		text-align: left;
	}
	.featured h2{
		font-size: 12pt;
	}
	.featured p{
		font-size: 12pt;
	}
	.featured li{
		font-size: 12pt;
	}
.main p{
		font-size: 14pt;
	}
	.main a{
		font-size: 14pt;
	}
	.main li{
		font-size: 14pt;
	} 
	.main h2{
		font-size: 20pt;
	}
	
	.main h3 {
		font-size: 18pt;
	}
	.bio-text {
		padding-bottom: 20px;
		padding-right: 0px;
	}
	.container-featured {
		width: 100%;
margin: 0px;
		padding: 0px;
	}
	.featured-images {
		padding: 20px 5px 0px;
		margin-top: 0px;
		margin-bottom: 30px;
	}
	#pic1, #pic2, #pic3, #pic4 {
		width: 175px;
		height: 175px;
	}
	.featured {
		width: 46%;
		margin-left: 2%;
		margin-right: 2%;
	}
	.featured h2{
		font-size: 20pt;
	}
	.footer p{
		font-size: 12pt;
	}
	.footer h3 {
		font-size: 18pt;
	}
	.pubs {
		padding: 10px 20px;
	}
		.pubs2 {
		padding: 10px 20px;
	}
	.nav-bar a{
		font-size: 18pt;
		margin-bottom: 1px;
		padding: 2px 0px 0px;
	}
#topic-one-img {
background-image: url("../images/TPhS2.png");
	height: 250px;
}
#topic-two-img {
	height: 250px;
}
	.top-banner {
		width: 100%;
	height: 200px;
	background-image: url("../images/StG8.png");
}
		.top-banner2 {
		width: 100%;
	height: 200px;
	background-image: url("../images/banner2.3.PNG");
}
				.top-banner3 {
		width: 100%;
	height: 200px;
	background-image: url("../images/ettington3.PNG");
}
			.top-banner4 {
		width: 100%;
	height: 200px;
	background-image: url("../images/stG9.PNG");
}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (max-width: 591px){
	.top-banner2 {
	width: 100%;
	background-image: url("../images/banner2.3.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
}}
@media screen and (max-width: 494px){
	.footer p{
		font-size: 11pt;
	}
	.footer h3 {
		font-size: 16pt;
	}
}
@media screen and (max-width: 430px){
	#bio-pic {
		height: 400px;
		width: 90%;
		margin: 0px 0px 20px 15px;
		background-size:cover;
		float:left;
	}
	.bio-text p{
		text-align: left;
	}
	.featured h2{
		font-size: 12pt;
	}
	.featured p{
		font-size: 12pt;
	}
	.featured li{
		font-size: 12pt;
	}
.main p{
		font-size: 14pt;
	}
	.main a{
		font-size: 14pt;
	}
	.main li{
		font-size: 14pt;
	} 
	.main h2{
		font-size: 18pt;
	}
	.main h1{
		font-size: 18pt;
	}
	.main h3 {
		font-size: 14pt;
	}
	#biopic {
		width: 150px;
		height: 100px;
	}
	.bio-text {
		padding-bottom: 20px;
		padding-right: 0px;
	}
	.container-featured {
		width: 98%;
		padding: 0px;
		margin: 0px;
	}
	.featured-images {
		padding: 20px 5px 0px;
		margin-top: 0px;
		margin-bottom: 30px;
	}
	#pic1, #pic2, #pic3, #pic4 {
		width: 140px;
		height: 140px;
	}
	.featured {
		width: 46%;
		margin-left: 2%;
		margin-right: 2%;
		padding: 0px;
	}
	.featured h2{
		font-size: 20pt;
	}
	.footer p{
		font-size: 11pt;
	}
	.footer h3 {
		font-size: 14pt;
	}
	.pubs {
		padding: 10px 20px;
	}
		.pubs2 {
		padding: 10px 20px;
	}
	.nav-bar a{
		font-size: 16pt;
		margin-bottom: 1px;
		padding: 2px 0px 0px;
	}
#topic-one-img {
background-image: url("../images/TPhS2.png");
	height: 200px;
}
#topic-two-img {
	height: 200px;
}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
		.top-banner2 {
	width: 100%;
	background-image: url("../images/banner2.3.png");
	background-position: left;
	background-size: cover;
	margin-bottom: 0px;
	}
}
@media screen and (max-width: 350px){
	.bio-top {
		width: 100%;
	}
	#bio-pic {
		width: 98%;
		height: 350px;
		margin: 0px 0px 20px 0px;
		background-size:cover;
		float:left
	}
	.main p{
		font-size: 14pt;
	}
	.main a{
		font-size: 14pt;
	}
	.main li{
		font-size: 14pt;
	} 
	.main h2{
		font-size: 18pt;
	}
	.main h1{
		font-size: 18pt;
	}
	.main h3 {
		font-size: 14pt;
	}
	#pic1, #pic2, #pic3, #pic4 {
		width: 120px;
		height: 120px;
	}
	.featured-images {
		margin-top: 0px;
		margin-bottom: 30px;
		padding: 20px 5px 0px;
	}
	.container-featured {
		padding: 0px;
		margin: 0px;
	}
	.featured {
		width: 46%;
		margin-left: 2%;
		margin-right: 2%;
		padding: 0px;
		margin-bottom: 0px;
		margin-top: 0px;
	}
	.featured h2{
		font-size: 16pt;
	}
	.footer p{
		font-size: 10pt;
	}
	.footer h3 {
		font-size: 12pt;
	}
	.pubs {
		padding: 10px 20px;
	}
		.pubs2 {
		padding: 10px 20px;
	}
	.nav-bar a{
		font-size: 16pt;
		margin-bottom: 1px;
		padding: 2px 0px 0px;
	}
#topic-one-img {
background-image: url("../images/TPhS2.png");
	height: 160px;
}
#topic-two-img {
	height: 160px;
}
	.top-banner {
		width: 100%;
	height: 200px;
	background-image: url("../images/StG8.png");
	}
		.top-banner2 {
		width: 100%;
	height: 200px;
	background-image: url("../images/banner2.3.png");
	}
			.top-banner3 {
		width: 100%;
	height: 200px;
	background-image: url("../images/ettington3.png");
	}
			.top-banner4 {
		width: 100%;
	height: 200px;
	background-image: url("../images/stG9.png");
	}
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
}
@media screen and (min-width: 590px){
		.bio {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 0px;
	}
	.pubs {
		margin-top: 0px;
		margin-bottom: 30px;
	}
	.pubs2 {
		margin-top: 0px;
		margin-bottom: 30px;
	}
}
@media screen and (min-width: 768px){
		.bio {
		margin-top: 20px;
		margin-bottom: 30px;
	}
	.bio-top {
		margin-top: 20px;
	}
	.pubs {
		margin-top: 20px;
	}
		.pubs2 {
		margin-top: 20px;
	}
}