@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,700');

html, body   {
  height: 100%;
 width: 100%;
 font-family: sans-serif;
 color: #222;
}

.nav-item  {
  font-weight: bolder;
}

.navbar-light .navbar-nav .nav-link.active,
.navbar-light .navbar-nav .nav-link.hover {
  color: #1ebba3;
}

.topsection {
 background-image: url(img/1895690_m.jpg);
 background-size: cover;
 background-position: center, bottom;
 width: 100%;
 height: 80%;
}

h1 {
 padding-top: 310px;
 font-weight: bold;
 color: white;
 font-size: 3.5rem;
 padding-bottom: 200px;
 vertical-align: middle;
}

h2 {
  font-weight: bold;
}

h4 {
  padding-top: 3rem;
}

.index{
  font-size: 25px;
  font-weight: 300;
  color:black;
  padding-bottom: 15px;
}

.info{
  margin: auto;
  max-width: 950px;
  
}



.icon {
  max-width: 125px;
}

.icon:hover{
  transform:scale(1.2,1.2);
  transition:0.3s all;
}


.outline {
  width: 100%;
}

.outline th, .outline td {
  border: 1px solid #ccc;
  padding: 20px;
}

.outline th {
  font-weight: bold;
  background-color: #dedede;
  width: 20%;
}

.outline td{
  /* padding-right: 100px; */

}

.office img{
  max-width: 80%;
}





  @media screen and (max-width:1024px) {
    .topsection {
      max-height: 700px;
    }
  }

  @media screen and (max-width: 767px) {
    /* .outline,
    .outline tr,
    .outline td,
    .outline th {display:block;} */
    .outline th {width:auto;}
    .service {
      padding-bottom: 3rem;
    }
    h1 {
      padding-top: 250px;
      font-size: 3.0rem;
    }
    .topsection {
      max-height: 500px;
    }
    }

  @media screen and (max-width: 415px) {
  
    h1 {
      padding-top: 200px;
      font-size: 2.5rem;
    }
    }
  

.form {
  max-width: 70%;
}


footer {
  background-color: whitesmoke;
}