* {







    margin: 0;







    padding: 0;







    box-sizing: border-box;







}















body {







    font-family: 'Open Sans', sans-serif;







    color: #014669;







}















.container-fluid {







  color: #014669!important;







}















.content {







  padding: 10px;







  margin-top: 20px;







}















.header {







  display: grid;







  grid-template-columns: 1fr repeat(10, 1fr) 1fr;







  gap: 10px;







  padding: 10px;







  background-color: #fff;







  color: #014669;







  z-index: 30000;







}



.header-container {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  z-index: 30000;

}













.logo {







    grid-column: 2 / span 3; 







    justify-content: left; 







    align-items: center;







}















.menu {







    grid-column: 6 / span 6;







    display: flex;







    justify-content: flex-end;







    align-items: center;







    z-index: 1000000;







}















.menu ul li a {







  color: #014669;







  text-decoration: none;







  font-weight: bold;







  transition: all 0.3s ease;







}















/* Underline effect on hover */







.menu ul li a:hover {







  text-decoration: underline;







  text-decoration-color:#014669;







  text-decoration-thickness: 2px;



  bottom: -5px;







}















.menu ul li a.active {







  font-weight: bold;







  text-decoration: underline;







  text-decoration-color: #014669;







}















.headerImage {







    position: relative;







    width: 100%;







    justify-content: center;







    align-items: center;







    overflow: hidden;



    margin-top: 133px;



}















.headerImage img {







    width: 100%;







    height: 100%;







    object-fit: cover;







    position: absolute;







    top: 0;







    left: 0;







}















.text-overlay {







    display: flex;







    flex-direction: column;







    justify-content: center;







    align-items: center;







    position: absolute;







    top: 0;







    left: 0;







    z-index: 1;







    color: white;







    text-align: center;







    background-color: rgba(0, 0, 0, 0.3);







    padding: 10px;







    width: 100%;







}















.text-overlay h1 {







    font-size: clamp(1.1rem, 5vw, 4rem);







}















.text-overlay p {







    font-size: clamp(1.1rem, 3vw, 3rem);







    font-weight: lighter;







    padding-top: 10px;







}















.footer {







  background-color: #014669;







  margin-top: 20px;







  color: #fff;







  text-align: center;







  font-weight: lighter;







  padding: 25px;







}















.footer p {







  font-size: clamp(0.3rem, 3vw, 1rem);







}















/* Map container style */







#map {







  height: 100%;







  width: 100%;







}















.info-window-content {







  font-size: 16px;







  color: #333;







  font-family: Arial, sans-serif;







}















.info {







  color: #014669;

  margin-top: 3rem !important;

  margin-bottom: 3rem !important;



}















.info p {







  font-size: clamp(0.5rem, 4vw, 1.1rem);







  margin-top: 6px;







}















.map {







  height: 300px!important;







  margin-bottom: 20px;







}





.contactEmail {







  margin-top: 5px;







}















.contactPhone p, .contactEmail p {







  display: inline;







  margin-right: 10px;







}















.contactInfo {







  margin-top: 20px;







}















.sectionTitle {







  font-weight: bold; 







  font-size: larger; 







  margin-bottom: 10px;







  font-size: clamp(0.3rem, 3vw, 1.2rem);

}















.text {







  text-align: justify;







  font-size: clamp(0.3rem, 3vw, 1rem);







}



.textServices {







  text-align: justify;







  font-size: clamp(0.3rem, 3vw, 1.2rem);







}















.photo {







  overflow: hidden;







}











.underline-half {



  position: relative;



}







.underline-half::after {



  content: '';



  position: absolute;



  bottom: -5px;



  left: 0;



  width: 100%;



  height: 3px;



  background-color: #014669;



}





.responsiveTitle {







  font-size: clamp(1.1rem, 3vw, 2rem);







}









@media only screen and (max-width: 767px) {







  .photo {







    justify-content: center !important;







    display: flex !important;







  }



  .serviceContent {

    margin-left: auto !important;

    margin-right: auto !important;

  }



}





/* Extra Small Devices, Phones */ 

@media only screen and (min-width : 320px) and (max-width: 768px) {  







    .logo {







      width: 100%;







      height: 100%;







      background-size: cover;







      background-position: center;







    }    















    #menu__toggle {







      opacity: 0;







    }















    #menu__toggle:checked + .menu__btn > span {







      transform: rotate(45deg);







    }















    #menu__toggle:checked + .menu__btn > span::before {







      top: 0;







      transform: rotate(0deg);







    }















    #menu__toggle:checked + .menu__btn > span::after {







      top: 0;







      transform: rotate(90deg);







    }















    #menu__toggle:checked ~ .menu__box {







      right: 0 !important;







    }















    .menu__btn {







      position: relative;







      margin-top: 20px;







      width: 26px;







      height: 26px;







      cursor: pointer;







      z-index: 1;







    }















    .menu__btn > span,







    .menu__btn > span::before,







    .menu__btn > span::after {







      display: block;







      position: absolute;







      width: 100%;







      height: 2px;







      background-color: #014669;







      transition-duration: .25s;



    }















    .menu__btn > span::before {







      content: '';







      top: -8px;







    }















    .menu__btn > span::after {







      content: '';







      top: 8px;







    }















    .menu__box {







      display: block;







      position: fixed;







      top: 0;







      right: -100%;







      width: 210px;







      height: 100%;







      margin: 0;







      padding: 80px 0;







      list-style: none;







      background: rgb(255,255,255);







      background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(205,214,231,1) 100%);







      transition-duration: .25s;







    }















    .menu__item {







      display: block;







      padding: 12px 24px;







      color: #333;







      font-family: 'Roboto', sans-serif;







      font-size: 20px;







      font-weight: 600;







      text-decoration: none;







      transition-duration: .25s;







    }















    .menu ul li a:hover {







      background-color: #CFD8DC;







      z-index: 10000;







    }















    .headerImage {







      height: 250px;



      margin-top: 115px;



    }















    .text-overlay {







        height: 250px;







    }















  .overlay {







    position: fixed;







    top: 0;







    left: 0;







    width: 100%;







    height: 100%;







    background-color: rgba(0, 0, 0, 0.7);







    display: none;







    z-index: 999;







  }















  .info {







    color: #014669;







  }















  .text {







    font-size: 0.7rem !important;







  }

}





@media only screen and (max-width: 767px) {

  .info {

    margin-top: 0px !important;

  }

}









/* Medium Devices, Desktops */







@media only screen and (min-width : 769px) {







    .logo {







        width: 100%;







        height: 100%;







        background-size: cover;







        background-position: center;







    }  















    .menu ul {







        display: flex;







        list-style: none;







        padding: 0;







    }















    .menu ul li {







        margin-left: 40px;







    }















    .menu ul li a {







        font-weight: bold;







        font-size: larger;







    }















    #menu__toggle {







        display: none;







    }















    .menu__btn {







        display: none;







    }















    .headerImage {







        height: 500px;







    }















    .text-overlay {







        height: 500px;







    }







}





/* Large Devices, Wide Screens */







@media only screen and (min-width : 1025px) {







}



.map-responsive {

  position: relative;

  overflow: hidden;

}



.map-responsive iframe {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}



/* Map dimensions for every device */

.map-responsive {

  padding-bottom: 75%;

}



/* Media Query for tablet */

@media only screen and (min-width: 768px) {

  .map-responsive {

    padding-bottom: 48%;

  }

}



/* Media Query for desktop */

@media only screen and (min-width: 1024px) {

  .map-responsive {

    padding-bottom: 20%; 

  }

}