body {
    background-color:#e2cff4;
    margin: 0px;
    padding:20px;
  }

h1 {text-align: center;}
ul {
    display: block;
    list-style-type: none;
    background-color:#b1bbe7;
    overflow: hidden;
    margin: 0;
    padding: 0;
    }
    li {
        display: inline-block;
        }
        li a {
            display: block;
            color: rgb(16, 16, 16);
            text-align: center;
            padding: 17px;
            text-decoration: none;
            font-family: "Lucida Console", monospace;
            font-weight: bold;
        }
    .navbar a:hover{
        background-color:#79a9d3;
    }
h1 {font-family:"Lucida Console", "Console New", monospace;}
p {font-family:"Console New", monospace;}

h2 {font-family:"Lucida Console", "Console New", monospace;}

* {
  box-sizing: border-box;
}

.img-container {
  float: left;
  width: 25%;
  padding: 5px;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
p{
  white-space: normal;}
  .footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background-color:#006d5e;
    color: black;
    text-align: center;
    width: 100vw;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 20px;
    color: black;
   padding: 20px;
    overflow: hidden;
    box-sizing: border-box;
   background-color:#00838d;
   color: black;
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   text-align: center;
 }
 .footer a{
  text-decoration: none;
  color: black;
 }
 .footer a:hover{
  text-decoration:underline;
 }
 .video-container{
  display:flex;
  justify-content:center;
 }
.navbar{
  padding:0;
}
.logo-container {
  text-align: center;}

  body, html {height: 100%;
   margin: 0;}
  
  .hero-image {
    background-image: linear-gradient(rgba(52, 51, 51, 0.5), rgba(43, 39, 39, 0.5)), url("images/hero.jpg");
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  }
  
  .hero-text {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
  }
  
  .hero-text button {
    border: none;
    outline: 0;
    display: inline-block;
    padding: 10px 25px;
    color: rgb(255, 255, 255);
    background-color: #562088;
    text-align: center;
    cursor: pointer;
  }
  
  .hero-text button:hover {
    background-color: #ffffff;
    color: rgb(0, 0, 0);
  }

* {
  box-sizing: border-box;
}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #000000;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
  font-family:"Lucida Console", monospace;
}

input[type=submit] {
  background-color: #562088;
  color: white;
  padding: 12px 20px;
  border: none;
  cursor: pointer;
  font-family:"Lucida Console", monospace;
}

input[type=submit]:hover {
  background-color: #290e42;
  color: rgb(255, 255, 255);
}

.container {
  border-radius: 5px;
  background-color: #e2cff4;
  padding: 10px;
  font-family:"Lucida Console", monospace;
}

@media screen and (max-width: 600px) {
  .column, input[type=submit] {
    width: 100%;
    margin-top: 0;
  }
}