html{
  position: relative;
  overflow-x: hidden;
}

body{
  background-color: rgba(135,206,176,1) !important;
  height: 100%;
  width: auto;
}

#navbar{
  background-color: rgb(50,71,101);
}

.navbar .navbar-nav .nav-link{
  font-family: "Oswald" !important;
}

#form-head{
  color: black;
  padding-top: 9%;
  font-family: "Oswald";
}

#to-text{
  color:black;
  padding-right: 80%;
  font-family: "Oswald";
  font-size: 20px;
}

#from-text{
  color:black;
  padding-right: 75%;
  font-family: "Oswald";
  font-size: 20px;
}

#subject-text{
  color:black;
  padding-right: 80%;
  font-family: "Oswald";
  font-size: 20px;
}

#body-text{
  color:black;
  padding-right: 80%;
  font-family: "Oswald";
  font-size: 20px;
}

.form-group, .form-control {
    padding-left: 10%;
    width: 90%;
    resize: none;
}

#subbtn{
  background-color: rgb(50,71,101) !important;
  font-family: "Oswald";
}

#title-text{
  color: white;
  text-align: center;
  font-family: "Oswald";
}

.content-half{
    background-color: white;
    color: white;
    height: 40rem;
    width: 25rem;
    text-align: center;
    margin-top: 1%;
}

#info-head{
  color: black;
  font-weight: 800;
}

.contact-icons{
    position: relative;
    overflow: none;
    padding-top: 10%;
    list-style: none;
    font-family: 'Oswald';
    right: 5%;
  }

  .contact-icons li {
    display: block;
    margin: 20px;
    border-radius: 50%;

  }

  .contact-icons li a {
    color: black;
    text-decoration: none;
    top: 10%;
  }

  .contact-icons li a:hover, .contact-icons li a:active{
    color: rgb(135,206,176);
    text-decoration: none;
  }

  #cicon{
    padding-right:5%;
  }

  #picon{
    padding-right:7%;
  }

#mapid {
  position: relative;
  top: 1.7rem;
  left: 0;
  height: 350px;
  width: auto;
 }

 @media only screen and (min-width: 320px) and (max-width: 767px){
   .content-half{
       background-color: white;
       color: white;
       height: 45rem;
       width: 100%;
       text-align: center;
       margin-top: 1%;
       margin-bottom: 5%;
   }

   #mapid {
     position: relative;
     top: 7.5rem;
     left: 0;
     height: 420px;
     width: auto;
    }
 }

 @media only screen and (min-width: 768px) and (max-width: 1023px){
   .content-half{
       background-color: white;
       color: white;
       height: 45rem;
       width: 100%;
       text-align: center;
       margin-top: 1%;
       margin-bottom: 5%;
   }

   #mapid {
     position: relative;
     top: 7.5rem;
     left: 0;
     height: 341px;
     width: auto;
    }
 }