@charset "UTF-8";

@font-face {
    font-family: avant garde book;
    src: url('../assets/ITCAvantGardeStd-Bk.woff2') format('woff2'),
        url('../assets/ITCAvantGardeStd-Bk.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: avant garde xtra lt;
    src: url('../assets/ITCAvantGardeStd-XLt.woff2') format('woff2'),
        url('../assets/ITCAvantGardeStd-XLt.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

body{
	position:relative;
	padding:0px;
	margin:0px;
	text-align:center;
	background-image:url("../assets/degrees-page-assets/type-gray-bg.png");
	height:auto;
	background-repeat:no-repeat;
	background-position:cover;
		
}

header{
	
	min-height:350px;
	background-color:white;
	z-index:3;
	display:flex;
	justify-content:center;
	align-items:center;
	
}

main{
	position:relative;

	justify-content: center;
	align-items:center;
	min-height:1000px;
}
	


.logo{
	width:80%;
	height:auto;
}





nav{
	bottom:0%;
	width:100%;
	background-color: white;
	border-top:3px solid black;
	border-bottom:3px solid black;
	z-index:5;
}




nav ul{
	list-style-type:none;
	display:flex;
	justify-content: center;
}

nav ul li a{
	margin:100px;
	font-family:avant garde xtra lt;
	font-size:1.9em;
	text-decoration:none;
	color:black;
	align-items:center;
}



.top-bg-image{
	background-image:url("../assets/instructors-page-assets/diploma-bg-image.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	display: flex;
  	justify-content: center;
  	align-items: center;
	z-index:2;
	min-height:500px;
	width:100%;	
}

h1{
	font-family: avant garde book;
	color:rgba(252,98,52,1.00);
	font-size:10em;
	font-weight:bolder;
	z-index:5;
}

.main-body-copy{
	/*position:absolute;*/
	color:white;
	font-size:1.7em;
	font-family: avant garde book;
	z-index: 4;
	line-height:1.9em;
	top:65%;
	width:80%;
	margin: 0px auto;
	padding-top:3%;
	padding-bottom:1%;
}


.ron{
	position:relative;
	margin-top:1%;
	margin-bottom:1%;
	float:left;
}



h2{
	font-family:avant garde book;
	color:white;
	font-size:5em;
	margin-bottom: 1%;
	margin-top:4%;
	margin-right:5%;
	text-align:right;
	z-index:4;
	align-items:center;
	text-decoration:underline;
}

.ron-bio-text{
	
	font-size:2em;
	font-family:avant garde book;
	color:white;
	text-align: right;
	margin-left:5%;
	margin-top:1%;
	float:left;
	width:45%;
	line-height:1.5em;
}

.ron-img{
	margin-right:5%;
	float:right;
	margin-top:0%;
	width:40%;
}

.dan{
	position:relative;
	margin-top:1%;
	margin-bottom:1%;
	float:right;
}


h3{
	font-family:avant garde book;
	color:white;
	font-size:5em;
	margin-bottom: 1%;
	margin-top:4%;
	margin-left:5%;
	text-align:left;
	z-index:4;
	align-items:center;
	text-decoration:underline;
}

.dan-bio-text{
	font-size:2em;
	font-family:avant garde book;
	color:white;
	text-align: left;
	margin-right:5%;
	margin-top:1%;
	float:right;
	width:45%;
	line-height:1.5em;
}

.dan-img{
	margin-left:5%;
	float:left;
	margin-top:0%;
	width:40%;
}

.brian{
	position:relative;
	margin-top:1%;
	margin-bottom:1%;
	float:left;
}

h4{
	font-family:avant garde book;
	color:white;
	font-size:5em;
	margin-bottom: 1%;
	margin-top:4%;
	margin-right:5%;
	text-align:right;
	z-index:4;
	align-items:center;
	text-decoration:underline;
}

.brian-bio-text{
	font-size:2em;
	font-family:avant garde book;
	color:white;
	text-align: right;
	margin-left:5%;
	margin-top:1%;
	float:left;
	width:45%;
	line-height:1.5em;
}

.brian-img{
	margin-right:5%;
	float:right;
	margin-top:0%;
	width:40%;
}

.michael{
	position:relative;
	margin-top:2%;
	margin-bottom:2%;
	float:right;
	
}

h5{
	font-family:avant garde book;
	color:white;
	font-size:5em;
	margin-bottom: 1%;
	margin-top:4%;
	margin-left:5%;
	text-align:left;
	z-index:4;
	align-items:center;
	text-decoration:underline;
}


.michael-bio-text{
	font-size:2em;
	font-family:avant garde book;
	color:white;
	text-align: left;
	margin-left:5%;
	margin-top:1%;
	float:right;
	width:45%;
	line-height:1.5em;
}

.michael-img{
	margin-left:5%;
	float:left;
	margin-top:0%;
	width:40%;
}







@media only screen and (max-width:1480px){
	nav ul li a{
		margin:70px;
	}	
	
	.logo{
		width:80%;
		height:auto;
	}
}


@media only screen and (max-width:1280px){
	nav ul li a{
		margin:50px;
		font-size:1.6em;
	}
}

@media only screen and (max-width:1200px){
	
	h2, h3, h4, h5{
		font-size:4em;
		margin-bottom: 1%;
		margin-top:4%;
		margin-right:5%;
	}
	
	
	.dan-bio-text, .ron-bio-text, .brian-bio-text, .michael-bio-text{
		font-size:1.6em;
	}

}

@media only screen and (max-width:1000px){
	nav ul li a{
		margin:50px;
		font-size:1.3em;
	}
	
	h1{
		font-size:8em;
	}

	.top-bg-image{
		min-height:300px;
	}
	
	.main-body-copy{
		font-size:1.6em;
		line-height:1.6em;
		margin-top:4%;
		margin-bottom:2%;
	}
	
	h2, h3, h4, h5{
		font-size:3em;
		margin-bottom: 1%;
		margin-top:4%;
		margin-right:5%;
		text-align:center;
	}
	
	.dan-bio-text, .ron-bio-text, .brian-bio-text, .michael-bio-text{
		font-size:1.5em;
		float:none;
		text-align:center;
		width:90%;
		margin-right:3%;
		margin-left:3%;
	}
	
	.michael-img, .dan-img, .brian-img, .ron-img{
		float:none;
	}
	
}

@media only screen and (max-width:900px){
	nav ul li a{
		margin:40px;
		font-size:1em;
	}
	
	h1{
		font-size:6em;
	}

	.top-bg-image{
		min-height:270px;
			
	}
	
	.main-body-copy{
		font-size:1.5em;
		line-height:1.7em;
		margin-top:4%;
		margin-bottom:2%;
	}
	
	header{
		min-height:270px;
	}
}

@media only screen and (max-width:800px){
	nav ul li a{
		margin:40px;
		font-size:1em;
	}
	
	h1{
		font-size:4em;
	}
	
	
	header{
		min-height:250px;
	}
	
	.top-bg-image{
		min-height:250px;
			
	}

}

@media only screen and (max-width:700px){
	
	nav ul li a{
		margin:20px;
		
	}
	
	h1{
		font-size:3.5em;
	}
	
	.main-body-copy{
		font-size:1.2em;
		line-height:1.5em;
		margin-top:2%;
		margin-bottom:1%;
	}
	
	.bolder-type{
		font-size:1.3em;
		margin-bottom:3%;
		margin-top:1%;
	}
}

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

	h1{
		font-size:3.5em;
	}
	
	.main-body-copy{
		font-size:1.2em;
		line-height:1.5em;
		margin-top:2%;
		margin-bottom:1%;
	}
	
	.bolder-type{
		font-size:1.3em;
		margin-bottom:3%;
		margin-top:1%;
	}
	
	header{
		min-height:200px;	
	}
	
	nav{
		display:flex;
		justify-content:center;
		align-items:center;
	}
	
	nav ul{
	flex-direction:column;
		margin:30px;
	}
	
	nav ul li a{
		font-size:1.8em;
	}
	
}