
/* CSS Document */

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

	
	.NavBar{
		border-bottom: solid #FFFFFF thin;
	}
		
	.ActiveNavListItem{
		font-size: 4.8vw;
	}
	
	.NavListItem a {
		font-size:4.8vw;
	}
	
	.Home{
		width: 100%;
		position: relative;
		flex-direction: column;
		flex-wrap: wrap;
		margin: auto;
		margin-top:none;
		padding-bottom: 6em;
	}

	.HomeImage{
		position: relative;
		margin-bottom: -120px;
		text-align: center;
	}

	.HomeImage img{
		overflow-y: hidden;
		display: block;
		width: 100%;
		z-index: -1;
		margin-top:0vw;
		border-bottom: 12px double rgba(89,0,6,1.00);
		max-height: 400px;
		object-fit: cover;
		
	}
	#LabLogo{
		position:relative;
		margin-bottom:0.2vw;
	}

	.HomeImage h1{
		color: #000000;
		font-size: 8vw;
		margin-top:0vw;
		width:100%;
		
	}

	.Home h3{
		width: 91%;
		left: 4.5%;
		font-size: 2.5vw;
	}
	
	.Home p{
		position: relative;
		margin-top: 130px;
		width: inherit;
		margin-left:inherit;
		font-size: 1.2em;
		text-align:justify;	
	}
	
	.News {
		width: 100%;
		margin-left: none;
		position: relative;
		padding-bottom: 0vw;
		margin:auto;
	}
	
	.NewsHeading{
		text-decoration-line: underline;
		
	}
	
	.News h1{
		font-size: 2.4em;
		text-decoration: underline;	
		padding-bottom: 0em;
	}
	.NewsUpdate{
		
		padding-bottom:5vw;
	}
	.UpdateHeading{
		display: flex;
		flex-flow: row wrap;
		padding-bottom: .5em;
		color: rgba(88,0,6,1.00);
		padding-top: -.5em;
		
	}
	.News h3{
		margin: 0;	
		font-size: 1.7em;	
	}

	.News h5{
		font-size: 1.1em;
		padding-top: 0;
		padding-left: 0;
		font-style: italic;
	}
	.News p{
		margin: 0;
		font-size: 1.2em;
	}
	
	
	.Research{
		position: relative;
		width: 100%;
		display: flex;
		flex-flow: row wrap;
		max-width: 888.88px;
		margin:auto;
	}
	
	.ResearchTitle  {
		font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
		font-size: 2em;
		text-decoration: underline;
		font-style: normal;
		font-weight: 100;
		text-transform: none;
		position: relative;
	}
	
	.ResearchPara {
		font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-size: 1.2em;
		text-align: justify;
		position: relative;
		margin-top:-.8em;
	}
	
	.Member{
		width: 100%;
		overflow-x: hidden;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		margin:auto;
	}
	
	.PI {
		padding-bottom: 1em;
	}
	
	.PI h4{
		font-size: 8vw;
		text-align: center;
		position: relative;
		margin-top:30px;
		margin-bottom:.5em;
		width: inherit;
	}
	
	#PIRow{
		display: flex;
		flex-flow: column wrap;
		justify-content: center;
		align-items: center;
	}
	
	.PIphoto{
		max-width: 50%;
		min-width:30%;
		position:relative;
		display: inherit;
		flex:1 1;
		justify-content: space-around;
		align-items: center;
	}
	
	.PIphoto img{
		width:90%;
		max-width:500px;
	}
	
	.PIPara{
		position: relative;
		display: flex;
		flex-flow: column wrap;
		align-items: center;
		justify-content: center;
		flex: 1 1;
	}
	
	.PILinks{
		width: 8vw;
		display: block;
	
	
	}
	
	.PI p{
		font-size:1.02em;
		position:relative;
		margin-top: 1em;
		width: 90%;
		display:block;
	}
	
	.GradMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:flex-start;
		position:relative;
		margin-top:2em;
	}
	
	.GradBlock{
		width:45vw;
		height:90vw;
		margin-bottom:2vw;
		display: inherit;
		z-index: 0;
		flex-flow: column nowrap;
		justify-content: flex-start;
		
	}
	
	.GradImage{
		height:54vw;
		width:44.4vw;
	}
	
	.GradPara{
		float:left;
		width:inherit;
		display: block;
	}
	
	.GradMember h4{
		position: relative;
		width:100%;
		font-size:5.8vw;
		float:left;
		margin-bottom:.2vw;
	}
	
	.GradMember p{
		width:100%;
		font-size:4vw;
		margin-top: 1.vw;
	}
	
	.GradMediaLink{
		margin-top: 4vw;
		margin-left: 0.5vw;
		width:6vw;
		padding-bottom:.5vw;
	}
	
	.UndergradMember{
		width: 100%;
		float: left;
	}
	
	.Undergrad{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: space-evenly;
	}
	.UndergradBlock{
		width:30vw;
		height:67.8vw;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2vw;
		margin-left: 1vw;
		display:flex;
		flex-flow:  column nowrap;
		align-items: center;
		justify-content: flex-start;
	}
	
	.UndergradPhoto{
		width:29.5vw;
		height:35.53vw;
		float:left;
	}
	
	.UndergradPara{
		float:left;
		clear:none;
		width:100%;
		position: relative;
		margin-left: 2%;
	}
	
	.UndergradMember h4{
		position:relative;
		margin-top:2vw;
		font-size: 5vw;
	}
	
	.UndergradMember p{
		position:relative;
		margin-top:-4vw;
		font-size:4vw;
		width:100%;
		
	}
		
	.UndergradMediaLink {
		width: 6vw;
		float:left;
		clear:none;
		position: relative;
		top:-1vw;
		left:auto;
		
	}
	.PastMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:flex-start;
		position:relative;
		margin-top:auto;
	}
	
	.Past{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: space-evenly;
	}
	
	.PastBlock{
		width:30vw;
		height:67.8vw;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2vw;
		margin-left: 1vw;
		display:flex;
		flex-flow:  column nowrap;
		align-items: center;
		justify-content: flex-start;
	}
	.PastMember h4{
		position:relative;
		margin-top:2vw;
		font-size: 5vw;
	}
	
	.PastMember p{
		position:relative;
		margin-top:-4vw;
		font-size:4vw;
		width:100%;
	}
		
	
	.PublicationText{
		width: 90%;
		height: 100%;
		margin-left: 5%;
		text-align: left;
		margin-top: -1.8%;
		margin-bottom: 10%;
		text-decoration: none;
		position:relative
	}
	
	.PublicationImage{
		display: none;	
	}
}

@media screen and (max-width:326px){
	.NavList{
		flex-flow:wrap-reverse;
	}
	
	.ActiveNavListItem{
		font-size: 6vw;
	}
	
	.NavListItem a {
		font-size: 6vw;
	}
	
	.Member{
	margin-top:2em;
	9}
	
	.Tour{
		margin-top:8em;
	}
}

@media screen and (min-width:501px){
	.Home{
		width:95%;
	}
	.Home p{
		width:100%;
		margin-left:0%;
		font-size:1.5rem;
	}
	
	.HomeImage h1{
		margin-top: 1vw;
	}
	
	.HomeImage img{
		margin-top:0vw;
	}
	
	.News{
		width:95%;
	}
	
	.Research{
		width:95%;
	}
	
	.Member{
		width: 100%;
		overflow-x: hidden;
		margin:auto;
	}
	
	.PI {
		padding-bottom: 1em;
	}
	
	.PI h4{
		font-size: 5vw;
		text-align: center;
		position: relative;
		margin-top:30px;
		margin-bottom:.5em;
		width: inherit;
	}
	
	#PIRow{
		display: flex;
		flex-flow: column wrap;
		justify-content: center;
		align-items: center;
	}
	
	.PIphoto{
		position:relative;
		display: inherit;
		flex:1 1;
		justify-content: space-around;
		align-items: center;
	}
	
	.PIphoto img{
		width:31vw;
	}
	
	.PIPara{
		position: relative;
		display: flex;
		flex-flow: column wrap;
		align-items: center;
		justify-content: center;
		flex: 1 1;
	}
	
	.PILinks{
		width: 6vw;
		display: block;
	
	}
	
	.PI p{
		font-size:1.02em;
		position:relative;
		margin-top: 1em;
		width: 90%;
		display:block;
	}
	
	.GradMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:flex-start;
		position:relative;
		margin-top:2em;
	}
	
	.GradBlock{
		width:30vw;
		height:66vw;
		margin-bottom:2vw;
		margin-left:1.5vw;
		display: inherit;
		z-index: 0;
		flex-flow: column nowrap;
		justify-content: flex-start;
		
	}
	
	.GradImage{
		height:36vw;
		width:29.6vw;
		
	}
	
	.GradPara{
		float:left;
		width:28.1vw;
		display: block;
	}
	
	.GradMember h4{
		position: relative;
		width:100%;
		font-size:5.5vw;
		float:left;
		margin-bottom:.2vw;
	}
	
	.GradMember p{
		width:100%;
		font-size:2.5vw;
		margin-top: 1.vw;
	}
	
	.GradMediaLink{
		margin-top: 2vw;
		margin-left: 0.5vw;
		width:4vw;
		padding-bottom:.5vw;
	}
	
	.UndergradMember{
		width: 100%;
		float: left;
	}
	
	.Undergrad{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: space-evenly;
	}
	.UndergradBlock{
		width:20vw;
		height:45.0vw;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2	vw;
		margin-bottom:3vw;
		margin-left: 2vw;
		display:flex;
		flex-flow:  column nowrap;
		align-items: center;
		justify-content: flex-start;
	}
	
	.UndergradPhoto{
		width:19.6vw;
		height:23.53vw;
		float:left;
	}
	
	.UndergradPara{
		float:left;
		clear:none;
		width:100%;
		position: relative;
		margin-left: 2%;
	}
	
	.UndergradMember h4{
		position:relative;
		margin-top:2vw;
		font-size: 3vw;
	}
	
	.UndergradMember p{
		position:relative;
		margin-top:-3vw;
		font-size:2.5vw;
		width:100%;
	}
		
	.UndergradMediaLink {
		width: 4vw;
		float:left;
		clear:none;
		position: relative;
		top:-1vw;
		left:auto;
		
	}
	
	.PastMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:flex-start;
		position:relative;
		margin-top:auto;
	}
	
	.Past{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: space-evenly;
	}
	
	.PastBlock{
		width:20vw;
		height:43.0vw;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2vw;
		margin-bottom: 2vw;
		margin-left: 2vw;
		display:flex;
		flex-flow:  column nowrap;
		align-items: center;
		justify-content: flex-start;
	}
	
	.PastMember h4{
		position:relative;
		margin-top:2vw;
		font-size: 3vw;
	}
	
	.PastMember p{
		position:relative;
		margin-top:-3vw;
		font-size:2.5vw;
		width:100%;
	}
	
	.Publication{
		display: flex;
		flex-flow: column nowrap;
		width:100%;
		max-width: 1100px;
		margin:auto;
		top:80px;
	}
	
	.PublicationYear{
		font-size: 2em;
		margin-bottom:1vw;
	}
		
	.PublicationEntry{
		border-bottom: thin solid #590006;
		display:flex;
		flex-flow: row;
		margin-bottom:1em;
		padding-bottom:2em;
		align-items: center;
		justify-content: center;
		
	}
	
	.PublicationImage{
		align-items:center;
		max-width:30%;
		margin-right:5%;
		float:left;
	}	
	
	.PublicationImage img{
		width:100%;
	}
	
	.PublicationText{
		width: 60%;
		float:left;
		text-decoration: none;
		font-size:2.4vw;
	}
		
	.PublicationText h3{
		text-align: justify;	
	}
}

@media screen and (min-width:750px){
	
	
	.ActiveNavListItem{
		font-size: 1.8em;
	}
	
	.NavListItem a{
		font-size:1.8em;
		
	}
	.HomeImage img {
		margin-top:none;
		max-height: 450px;
	}
	
	#HomeImageNarrow{
		display:none;
	}
	
	#HomeImageWide{
		display:inherit;
		flex-shrink:1.2;

		
	}
	
	.PI {
		padding-bottom: 1em;
	}
	
	.PI h4{
		font-size: 5vw;
		text-align: center;
		position: relative;
		margin-top:4%;
		margin-bottom:1em;
		width: inherit;
	}

	.PIphoto img{
		width:22vw;
	}
	
	.PILinks{
		width:4vw;
		display: block;
	}
	
	.PI p{
		font-size:2vw;
		position:relative;
		margin-top: 2em;
		width: 90%;
		display:block;
	}

	
	.Member h3{
		font-size: 2em;
		margin-bottom: .5em;
		width: 100%;
		margin-left: 1%;
	}
	
	.GradMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:center;
	}
	
	.GradBlock{
		width:45vw;
		height:20vw;
		margin-left:1vw;
		margin-right:2vw;
		margin-bottom:4vw;
		flex-flow: row wrap;
	}
	.GradImage{
		height:19.7vw;
		width:16.6vw;
	}
	.GradPara{
		float:left;
		width:28.1vw;
		font-size:1em;
		display: flex;
		justify-content: flex-start;
		flex-flow: column wrap;
	}
	
	.GradMember h4{
		position: relative;
		width:100%;
		font-size:3.5vw;
		float:left;
		margin-bottom:-2vw;
	}
	
	.GradMember p{
		width:100%;
		font-size:2vw;
		margin-top: 2vw;
	}
	
	.GradMediaLink{
		margin-top: 1.4vw;
		margin-left: .6vw;
		width:2em;
	}
	
	.UndergradMember{
		width: 100%;
		float: left;
	}
	
	.Undergrad{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: flex-start;
	}
	.UndergradBlock{
		width:200px;
		height:400px;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2vw;
		margin-bottom:2vw;
		margin-left:1vw;
		display: inherit;
		flex: row wrap;
		justify-content: flex-start;
	}
	
	.UndergradPhoto{
		width:90%;
		height:auto;
	}
	
	.UndergradPara{
		float:left;
		clear:none;
		width:100%;
		position: relative;
		margin-left: 2%;
		text-align:center;
		justify-content: center;
		align-content: center;
	}
	
	.UndergradMember h4{
		font-size: 28px;
		position: inherit;
		margin-bottom:3.5vw;
	}
	
	.UndergradMember p{
		font-size:20px;
		width:100%;
	}
		
	.UndergradMediaLink {
		width: 2em;
		position: relative;
		justify-content: center;
		float:none;
	}
	
	.PastMember{
		display: flex;
		flex-flow: row wrap;
		height: inherit;
		justify-content:center;
		margin-bottom: 2em;
	}
	
	.Past{
		display:flex;
		flex-flow:  row wrap;
		align-items: center;
		justify-content: flex-start;
		justify-content: center;
	}
	
	.PastBlock{
		width:200px;
		height:375px;
		position: auto;
		margin: auto;
		float: left;
		margin-bottom:2vw;
		margin-left:1vw;
		display: inherit;
		flex: row wrap;
		justify-content: flex-start;
	}
	
	.PublicationText{
		font-size:1.17em;
	}
	
	.PastMember h4{
		font-size: 28px;
		position: inherit;
		margin-bottom:3.5vw;
	}
	
	.PastMember p{
		font-size:20px;
		width:100%;
	}
	
	.VertPhoto{
		width:100%;
		position:relative;
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		justify-content: center;
	

	}
	
	.VertPhoto img{
		flex-flow: row;
		width:350px;
		margin-bottom: 2em;
		margin-right:1em;
		margin-left:1em;
	
		
	}
	
	.HoriPhoto{
		width:100%;
		position:relative;
		display: flex;
		flex-flow: row wrap;
		align-items: center;
		justify-content: center;

	}
	
	.HoriPhoto img{
		flex-flow: row;
		width:500px;
		margin-bottom: 2em;
		margin-right:1em;
		margin-left:1em;
	}
}

@media screen and (min-width:1100px){
	
	.HomeImage h1{
		font-size:5em;
	}
	
	.HomeImage img{
		margin-top:vw;
	}
	
	.Home p{
		width:88.88%;
		margin-left:5.55%;
	}
	
	.Member{
		width: 100%;
		max-width:1000px;
		overflow-y: hidden;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		margin:auto;
	}
	
	.PI {
		padding-bottom: 1em;
	}
	
	.PI h4{
		font-size: 3em;
		text-align: center;
		position: relative;
		margin-top:4%;
		margin-bottom:1em;
		width: inherit;
	}
	.PIphoto img{
		width:250px;
	}
	.PILinks{
		width:2.5em;
		display: block;
	}
	
	.PI p{
		font-size:1.36em;
		position:relative;
		margin-top: 2em;
		width: 90%;
		display:block;
	}
	
	.GradMember{
		display: flex;
		flex-flow: row wrap;
		justify-content:center;
	}
	
	.GradBlock{
		width:450px;
		height:200px;
		margin-right:.5vw;
		margin-left:.5vw;
		flex-flow: row wrap;
		justify-content: flex-start;
	}
	.GradImage{
		height:198px;
		width:166px;
	}
	.GradPara{
		float:left;
		width:282px;
		font-size:1em;
		display: block;
	}
	
	.GradMember h4{
		position: relative;
		width:100%;
		font-size:2em;
		float:left;
		margin-bottom:.1em;
	}
	
	.GradMember p{
		width:100%;
		font-size:1.3em;
		margin-top: .95em;
	}
	
	.GradMediaLink{
		margin-top: 1.2em;
		margin-left: 0.5em;
		width:2em;
	}
	
	.UndergradMember{
		padding-bottom: 2em;
		min-height:450px;
	}
	.UndergradBlock{
		width:200px;
		height:400px;
		position: relative;
		margin: auto;
		float: left;
		margin-top: 2vw;
		margin-bottom:0vw;
		margin-left:1vw;
		display: inherit;
		flex: row wrap;
		justify-content: flex-start;
	}
	
	.UndergradPhoto{
		height:auto;
		width:90%;
	}
	
	.PastBlock{
		width:200px;
		height:375px;
		position: auto;
		margin: auto;
		float: left;
		margin-bottom:2vw;
		margin-left:1vw;
		display: inherit;
		flex: row wrap;
		justify-content: flex-start;
	}
	
	
}
