@charset "utf-8";
/* CSS Document */
/*nav menu*/
.nav-menu{
	background-color: #657A12;
	height: 6vh;
}

ul{
	list-style-type: none;
	/*border: 2px dashed black;*/
	text-align: center;
}

li{
	display: inline;
	/*border: solid 2px yellow;*/
	font-family: 'Roboto', sans-serif;
	font-size: 20px;
	margin-right: 8%;
}


a{
	text-decoration: none;
	color: white;
}

/*.image-side-container{
	display: inline;
	border: 3px solid pink;
	height: 80vh;
	width: 40%;
}*/

/*Faculty Title*/
h1{
	font-family: 'Yellowtail', cursive;
	font-size: 140px;
	position: absolute;
	top: 6vh;
	left: 10vw;
	color: white;
}

.text-box-intro{
	border: solid blue 4px;
	width: 40%;
	margin-left: 50vw;
}

.faculty-container{
	display: inline;
	/*border: 3px solid blue;*/
	width: 40%;
}

.classroom-img{
	width: 38%;
	height: auto;
}

.grid-container {
  display: inline-grid;
  grid-template-columns: auto auto auto;
  /*background-color: #2196F3;*/
  padding: 10px;
  width: 60%;
  margin-top: 0vh;
  float: right;
}
.grid-item {
  /*background-color: rgba(255, 255, 255, 0.8);*/
  /*border: 1px solid rgba(0, 0, 0, 0.8);*/
  padding: 20px;
  font-size: 30px;
  text-align: center;
}

/*grid content*/

.teacher-images{
	border: solid 4px #657A12;
	border-radius: 118px;
	height: auto;
	width: 230px;
}

.teacher-name{
	font-family: 'Roboto', Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	font-weight: 700;
	font-size: 30px;
	text-align: center;
	/*border: 2px solid white;*/
}

.teacher-job-title{
	font-family: 'Roboto', Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	font-weight: 400;
	font-size: 30px;
	text-align: center;
	margin-top: -25px;
	/*border: 2px dashed yellow;*/
}

.faculty-paragraph-txt{
	font-family: 'Roboto', Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
	font-weight: 400;
	font-size: 15px;
	text-align: center;
	width: 70%;
	margin: 0 auto;
	/*border: 2px dashed yellow;*/
}

footer{
	background-color: #657A12;
	/*have to put margin top due to weird positioning on rest of images*/
	margin-top: 50vh;
	height: 300px;
	color: white;
}

.tmcc-logo-footer{
	display: block;
	padding-top: 50px;
  	margin-left: auto;
  	margin-right: auto;
  	width: 50%;
}