body {
  background-color: #FFFFFF;
  text-decoration-color: #666666;
  font-family: 'Veranda', sans-serif;
  background-image: linear-gradient(180deg,#eeeeee, #ffffff);
  background-attachment: fixed;
  padding-left: 2em;
  padding-right: 2em;
  display: block;
  margin: 0px;

}
main {
    padding-left: 2em;
    padding-right: 2em;
    background-color: #FFFFFF;
    padding-top: 1px;
    padding-bottom: 1px;
    grid-row: 4 / 5;
    grid-column: 2 / 8;
}
header {
  background-color: #BA1C21;
  color: #FFFFFF;
  font-family: Georgia, Times, "Times New Roman", serif;
  padding-bottom: 2rem;
  grid-row: 1 / 2;
  grid-column: 2 / 8;

}
header h1 {
  line-height: 240%;
  background-repeat: no-repeat;
  padding: 1em;
  padding-left: .5rem;
  height: 72px;
  margin: 0;
  list-style-type: none;
}
header a {
  text-decoration:none;
  color: #FFFFFF;
}


nav {
      position: sticky;
      top: 0;
      font-weight: bold;
      padding: 0px;
      margin: 0px;
      background-color: #424242;
      grid-row: 2 / 3;
      grid-column: 2 / 8;
}

nav a:hover{
  background-color: #BA1C21;
}

nav a {
  text-align: center;
  text-decoration: none;
  padding: 1rem 0rem;
  display: block;
  color: #FFFFFF
}

nav ul li {
  width: 100%;
}
nav ul{
    margin: 0px;
    padding: 0px;
    list-style-type: none;
    display: flex;
    flex-flow: row;
    flex-wrap: nowrap;
}

section {
  float: left;
  width: 33%;
  padding-right: 1rem;
}

.clear {
  clear:both;
}

h2{
  color: #424242;
  font-family: Georgia, Times, "Times New Roman", serif;
}
dt {
  color: #BA1C21;
  font-weight: bold;
}
.dsu {
  color: #BA1C21;
  font-size: 1.2rem;
}
footer{
  font-size: .70em;
  font-style: italic;
  text-align: center;
  padding-left: 1em;
  padding-right: 1em;
  padding-top: 1em;
  padding-bottom: 1em;
  background-color: #ffffff;
  grid-row: 5 / 6;
  grid-column: 2 / 8;
}
#wrapper {
    display: grid;
    grid-auto-rows: minmax(0px,auto);
    grid-template-columns: minmax(0px, 1fr) repeat(6, minmax(0, 150px)) minmax(0px, 1fr)
}


h3{
  color: #BA1C21;
}

#homehero {
  background-image: url("images/homehero.jpg");
  height: 300px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  grid-row: 3 / 4;
  grid-column: 1 / 9;
}
#studenthero {
  background-image: url("images/studenthero.jpg");
  height: 300px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  grid-row: 3 / 4;
  grid-column: 1 / 9;

}
#facultyhero {
  background-image: url("images/facultyhero.jpg");
  height: 300px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  grid-row: 3 / 4;
  grid-column: 1 / 9;
}
#redbar{
  background-color: #BA1C21;
      grid-row: 1 / 2;
      grid-column: 1 / 9;
}
#graybar{
  background-color: #424242;
    grid-row: 2 / 3;
    grid-column: 1 / 9;
}


*{
  box-sizing:border-box;
}

@media only screen and (max-width: 1100px){
  #wrapper {
  grid-template-columns:
  minmax(0px, 1fr) repeat(6, minmax(0, 150px)) minmax(0px, 1fr);}
}
@media only screen and (max-width: 900px){
	nav {
		grid-row: 2 / 3;
		grid-column: 1 / 5;
	}
	nav ul {
		flex-flow: column nowrap;
	}
	#homehero {
	grid-row: 2 / 3;
	grid-column: 5 / 8;
	height: auto;
	}
	#studenthero {
	grid-row: 2 / 3;
	grid-column: 5 / 8;
	height: auto;
	}
	#facultyhero {
	grid-row: 2 / 3;
	grid-column: 5 / 8;
	height: auto;
	}
section {
	float: none;
	width: 100%;
	padding-right: 0px;
	}
}

@media only screen and (max-width: 600px){
	header h1 {
		background-image: none;
		text-align: center;
	}
	nav {
		grid-column: 1 / 9;
		grid-row: 2 / 3;
	}
		#homehero {
	display: none;
	}
	#studenthero {
	display: none;
	}
	#facultyhero {
	display: none;
	}
}
