body{
    font-family: 'Ramabhadra', sans-serif; 
    color:black;
  }
  p {
    font-size: 1rem !important;
    color: rgb(105, 105, 105);
  }
 
  .font-trainOne {
    font-family: 'Train One', cursive;
  }
  .underline {
      background-color: rgb(55, 169, 173);
      height: 0.3rem;
      width: 50px;
      margin: 20px;
  }
 
  /* preloader */
  .preloader{
    position: fixed;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index: 999;
    background: white;
  }
 
  .hidePreloader{
    display: none!important;
  }
    
  .logo {
    height: 65px;
  }
  /* navbar */
  .navbar{
    background: white;
  }
 
  .navbar-toggler {
    color: rgb(55, 169, 173);
  }
  .nav-link {
    color: black;
    text-transform: capitalize;
  }
  .nav-link:hover{
    color: rgb(55, 169, 173);
  }
  .nav-icon{
    color: rgb(55, 169, 173);
  }
 
  .navbar-nav li {
    padding-right: 30px;
  }
  
  /* ==========header */
  .fonts {
    color: #FFFFFF;
    text-shadow: 0 -1px 4px #FFF, 0 -2px 10px #ff0, 0 -10px 20px rgb(55, 169, 173), 0 -18px 40px rgb(104, 119, 116);
    font-size: 7vw;
 
  }
  
  .height-max{
    min-height: 60vh;
    /* Photo by <a href="https://unsplash.com/@adigold1?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Adi Goldstein</a> on <a href="https://unsplash.com/s/photos/cyber-security?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>
   */
    background:url(../img/headerBcg.jpeg); 
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
  }
 
 
  /* ==============about us =============*/
  .about-img__container2 {
    position: relative;
  }
  .about-img__container2::before {
    content: "";
    position: absolute;
    top: -24px;
    top: -1.5rem;
    right: -27.2px;
    right: -1.7rem;
    width: 100%;
    height: 100%;
    outline: 8px solid rgb(55, 169, 173);
    outline: 0.5rem solid rgb(55, 169, 173);
    z-index: -1;
    -webkit-transition: all 1s linear;
    transition: all 1s linear;
  }
  .about-img__container2:hover:before {
    top: 0;
    right: 0;
  }
  /* =============services========= */
  .about-img__container {
    position: relative;
  }
  .about-img__container::before {
    content: "";
    position: absolute;
    top: -24px;
    top: -1.5rem;
    left: -27.2px;
    left: -1.7rem;
    width: 100%;
    height: 100%;
    outline: 8px solid rgb(55, 169, 173);
    outline: 0.5rem solid rgb(55, 169, 173);
    z-index: -1;
    -webkit-transition: all 1s linear;
    transition: all 1s linear;
  }
  .about-img__container:hover:before {
    top: 0;
    left: 0;
  }
 
 
 
/* ============contact-us=========== */
#contact-us a {
  text-decoration: none;
  color:rgb(55, 169, 173) !important;
}
#contact-us a:hover {
  text-decoration: none;
  color: grey!important;
  text-decoration: underline !important;
}
 
.map-responsive{
  overflow:hidden;
  padding-bottom:75%;
  position:relative;
  height:0;
  border: 0.5rem solid rgb(55, 169, 173);
}
 
.map-responsive iframe{
  left:0;
  top:0;
  height:100%;
  width:100%;
  position:absolute; 
}
 
 
/* ===============footer================= */
 
  
  .footer-top {
    padding: 20px; 
    background: rgb(209, 212, 211);
    color: grey; 
    text-align: left; 
  }
 
  
  .footer-contact i { 
    color: rgb(55, 169, 173) !important;
    padding-right: 10px; 
    font-size: .8rem; 
  }
 
  .footer-contact a {
      color: grey !important;
      text-decoration: none;
  }
  
  .footer-contact address, p {
    font-size: .8rem;
  }
  
   .footer-contact a:hover {
    color: rgb(55, 169, 173) !important;
    text-decoration: underline !important;
  } 
  
  .footer-bottom { 
    padding-left: 20px;
    background: rgb(55, 169, 173); 
    text-align: left; 
    color: rgb(189, 197, 197); 
    font-size: 0.8rem;
  }
  
  .footer-copyright { 
    padding-top: 3px; 
  }
  .footer-copyright a { 
    color:  white; 
    border: 0; 
    text-decoration: none;
  }
  .footer-copyright a:hover, .footer-copyright a:focus { 
    color: grey; 
    border: 0; 
  }
  .logoF {
    height: 110px;
  }
  
  @media (max-width: 576px) {
    .footer a {
        height: 50px !important;
    }
    .footer-contact {
        margin-top: 10px;
    }
    
  .rows {
    display: flex;
    flex-flow: column-reverse;
      }
 
  .height-max {
    background-attachment: scroll;
    }
 
  .fonts {
    font-size: 18vw;
    color: #FFFFFF;
    text-shadow: 0 -1px 4px #FFF, 0 -2px 10px #ff0, 0 -10px 20px rgb(55, 169, 173), 0 -18px 40px rgb(104, 119, 116);
    }
  .logoF {
      height: 80px;
    }
  .nav-item {
    padding-left: 20px;
  }
 }