html{
  height: 100%;
}

body{
  height: 100%; 
  text-align: center; 
  background-color: #c69deb; 
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

ol{
  margin-top: 0; 
  padding: 0; 
}

header{
  overflow: hidden; 
}
#top-header{
  text-align: center;
  height: 60%;
}
#logo{
  float: left;
  padding: none;
  margin: none; 
  height: 70px;
  width: 30%;
}
#logo img{
  width: 70px; 
  float: left;
  padding: 10px 0px; 
}

#menu{
  float: right;
  width: 70%;
  height: 100%; 
  margin: none;
}

#menu ul{
  text-align: center;
  float: right;
  margin: none;
  background-color: #c69deb;
}

#menu li{
  display: inline-block;
  padding: none;
  margin: none;
}

#menu li a {
  display: inline-block; 
  padding: 0em 1.5em;
  text-decoration: none;
  font-weight: bold; 
  line-height: 60px;
  text-transform: uppercase; 
  color: black; 
}

#menu li:hover{ 
  background-color: darkviolet;
  color: white;
  border-left: 2px solid black;
  border-right: 2px solid black; 
}
#menu li a:hover{
  color:white; 
}

.active{
  /* background-color: #eaccf6; */
  background-color: #dfb3f2;
  color: black;
} 

#header-image{
  top: 10px;
  position: relative;
}

#header-image img{
  width: 100%;
  height: 600px; 
  margin: none;
  padding: none;
  filter: grayscale(35%);
}

#image-text{
  position: absolute;
  top: 35%; 
  left: 50%; 
  transform: translate(-50%, -50%);
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  color: white;
  text-align: center;
  font-size: 50px; 
}

.pageH1{
  text-align: center; 
  color: white; 
}

.lab-container{
  margin: auto; 
  width: 812px; 
  height: 500px;
  overflow: auto; 
}

.lab-box{
  background-color: lavender; 
  border: 3px solid black;
  margin: 5px;
  padding: 20px 0; 
  height: 30px;
  width: 780px; 
  font-size: 20px;
  text-align: center;
  color: black; 
}

a {
  text-decoration: none;
}

.abtMePage{
  display: flex;
  column-gap: 20px; 
  margin-top: 20px; 
}

.abtMeLeft{
  border: 3px solid black;
  height: 500px;
  width: 40%;
  background-color: lavender;
  margin-left: 25px; 
  overflow: hidden;
}
.abtMeRight{
  border: 3px solid black; 
  height: 500px;
  width: 60%;
  background-color: lavender;
  margin-right: 25px; 
  overflow: hidden; 
}

p{
  padding: 20px; 
  font-size: 20px; 
}

.sub-pg-bg{
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
} 

hr{
  border: 2px solid white;
}

/* Adding more stuff so stuff works*/