body {
    margin: 0;
    font-family: 'Roboto', sans-serif;
 font-size: 1rem;
    overflow-x: hidden;
   height: 100%;
   color: #333333;
   text-align: center;
}


a {
  color: currentColor;
}

h1 {
  font-family: 'PT Serif', sans-serif;
  font-weight: 100;
  font-size: 2rem;
  
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding-bottom: 40px;
  
}

h2 {
  font-family: 'Playfair Display', sans-serif; 
  font-size: 1.3rem;
  font-weight: 100; 
  
  
}

h3 {
  font-family: 'Playfair Display', sans-serif;
  font-weight: 100;
  font-size: 1.4rem;
   
}

h4 {
 
  font-weight: 300;
  font-size: 1.1rem;
  
}

h5 {
  font-family: 'Playfair Display', sans-serif; 
  font-size: 1.1rem;
  font-weight: 100; 
  margin: 15px;
    
}

button {
  
  background-color: #6FC6D2;
  border: none;
  color: white;
  padding: 2px 7px ;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  /* margin-top: 12px; */
  border-radius: 4px;
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  cursor: pointer;
}

button:hover {
  background-color: #b66c9c;
  /* background-color: #008DB9; */
  transition: all 0.15s ease-in-out;
}
.headercontainer  {
  display: flex;
  justify-content: space-between;
  /* background-color: #4D495B; */
  /* background-color: white; */
  align-items: top;
  /* padding-top: 10px;
  padding-bottom: 10px; */
  /* padding-left: 8px; */
  padding-left: 10px;
  padding-right: 15px;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
 }


.headercontent1 {

  flex: 20%;
  overflow: hidden;
  text-align: left;
  /* padding-left: 12px; */
  padding-top: 10px;
  
}
.headercontent2 {

  flex: 80%;
  display: flex;
  flex-direction: column;
  /* background-color: red; */
 
  overflow: hidden;
  text-align: right;
    overflow: hidden;
  font-family: 'Poppins', sans-serif;
  font-size: 1.2rem;
  
}

.headercontent2 a {
 
  flex: 80%;
  /* padding-right: 12px; */
  padding-top: 8px;
  text-align: right; 
  
  /* color: white; */
    
  }
.fbbanner {
  text-align: center;
 align-self: flex-end;
  position: sticky;
  background-color: #00b0b9;
  border-radius: 0px 0px 10px 10px;
  font-size: 0.9rem;
  color: white;
  padding: 5px 10px;
  text-decoration: none;
  /* max-width: 1000px; */
}


.fbbanner a {
  
  text-decoration: none;
  padding: 0px;
}

.menu {
padding-top: 25px;
  text-align: right;
}

.topnav a {
  
  padding-left: 14px;
 
  text-decoration: none;
  font-size: 1.1rem;
}

.topnav a:hover {
  color:#00b965;
  color:#0053b9;
  color:#e18700;
  /* color:#b90053; */
  transition: all 0.2s ease-in-out;
  
}

/* Hide the burger menu icon */

.topnav .icon {
  display: none;
  padding-right: 10px;
  padding-top: 25px;

}

.headertitle {
  font-family: 'Poppins', sans-serif;
  font-size: 1.4rem;
}



.headersection {
  padding-left: 10px;
}



  

.divider {
  display: flex;
  justify-content: space-between;
  font-size: 0.8rem;
  font-family: 'Poppins'sans-serif;

}

.divider2wide {
  background-color: #6FC6D2;
  color: #4d495b;
  flex:33%;
  text-align: center;
  padding: 3px;
}
.divider1wide {
  background-color: #00b0b9;
  color: #4d495b;
  flex:33%;
  text-align: center;
  padding: 3px;
}
.divider3wide {
  background-color: #B66C9C;
  color: #4d495b;
  flex:33%;
  text-align: center;
  padding: 3px;
}

.divider2 {
  background-color: #6FC6D2;
  color: #4d495b;
  flex:33%;
  text-align: center;
  padding: 1px;
}

.divider1 {
  background-color: #00b0b9;

  flex:33%;

  padding: 1px;
}

.divider3 {
  background-color: #B66C9C;
 
  flex:33%;

  padding: 1px;
}
  
.imageblock {
  display: block;
}
.imageblock1 {
  display: none;
}

.herobox {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
}
.heroimage {
  flex: 30%;
}
.heroimagemob {
  display: none;
}

.herotext {
  flex: 70%;
  padding: 10px;
}

  .topsection {
    padding: 10px;
  }

.textblock {
  
  max-width: 1024px;
  margin-left: auto;
    margin-right: auto;
}

.textblock a {
  
  text-decoration: none;
  color: #008db9;
}

.servicesection {
  background-color: #008DB9;
  color: white;
  padding: 10px 10px 20px 10px;
}

.servicesection a {
  color: white;
  text-decoration: underline;
}
 .servicesection h3 {
   color: white;
  }

  .services {
    display: flex;
    align-items: baseline;
    
  
  }
  .servicetitle {
    flex: 13%;

     color: white;   
  }
  
  .servicedescription {
    flex: 87%;
   padding-left: 20px;
   padding-right: 20px;
    color: white;  
  } 
  .servicedescription p {
   margin: 0px;
   align-items: center;  
  } 

.whysection {
  background-color: #6fc6d2;
  color: white;
  padding: 10px;
}

.whysection h3 {
  color: white;
 }

 .whysection p {
  color: white;
 }

 .howsection {
  background-color: #b66c9c;
  color: white;
  padding: 10px;
}

.howsection h3 {
  color: white;
 }

 .howsection p {
  color: white;
 }
 .newssection {
  background-color: #008db9;
  color: white;
  padding: 10px
}

.newssection h3 {
  color: white;
 }

 .headline {
  /* font-weight: 600; */
  color: white;
  font-family: 'Playfair Display', sans-serif;
  padding-bottom: 4px;
  /* font-size: 0.9rem; */
}

.article {
  color: white;
  font-family: 'Poppins', sans-serif;
  font-size: 0.9rem;
  padding-bottom: 10px;
}

 .blogsection {
  /* display: none;  */
  padding: 10px;
 }



.latestblogposts {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
  padding: 10px;
}

.post {
  width: 30%;
}

.contactsection {
  background-color: #008db9;
  color: white;
  padding: 10px;
}

.contactsection h3 {
  color: white;
 }

 .contactsection p {
  color: white;
 }

.responsive {
  width: 100%;
  height: auto;
}



.fab {
  
  font-size: 1.4rem;

}

.contactbox {
  display: flex;
  justify-content: space-between;
  max-width: 1024px;
  margin-right: auto;
  margin-left: auto;
  text-align: center;
  align-items: top;
  
}

.contactdetails {
  flex: 33%;
  justify-content: space-between;
  text-align: center;
  align-items: top;
  
}

.privacy {
  font-size: 0.9rem;
}

.partners {
  display: flex;
  justify-content: space-between;
  text-align: center;
  align-items: center;
  padding: 20px;
}



.footercontainer  {
  display: flex;
  justify-content: space-between;
  background-color: #00b0b9;
  align-items: center;
  padding: 10px;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.9rem;
  border-radius: 25px;
 }




.footercontent1 {

  flex: 40%;
  overflow: hidden;

 
  color: white;
  text-align: left;

  padding-left: 10px;
  
}

.footercontent2 {

  flex: 20%;
  overflow: hidden;
  font-family: 'Poppins', sans-serif;
 
  color: white;
  text-align: center;
  
  
}

/* Add a black background color to the top navigation */


.footercontent3 {
 
  flex: 40%;
  padding-right: 10px;
  
  text-align: right; 
  overflow: hidden;
   
   
    color: white;
    
  }

footer {
  background-color: #00b0b9;
  font-family: 'Poppins', sans-serif;
 
  text-align: center;
  
  font-size: 0.9rem;
  color: white;
}



footer a {


  
  text-decoration: none;
 
}

/* Change the color of links on hover */
footer a:hover {
  color:#6FC6D2;
  
  transition: all 0.2s ease-in-out;
  
}

.mainbody {
  text-align: center;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 150px;
  padding-left: 10px;
  padding-right: 10px;
  
}

.mainbody a {
  
  color:#008db9;
   
  text-decoration: none;
}

.mainbody a:hover {
  color:#a56403;
  transition: all 0.2s ease-in-out;
}

.vacancybody {
  text-align: center;
  max-width: 1024px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 50px;
  padding-left: 10px;
  padding-right: 10px;
  
}

.vacancybody a {
  
  color:#008db9;
   
  text-decoration: none;
}

.vacancybody a:hover {
  color:#a56403;
  transition: all 0.2s ease-in-out;
}

.holding-paragraph {
  max-width: 600px;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  padding-top: 30px;
}

.vacancy-paragraph {
  max-width: 900px;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  padding-top: 30px;
}

.contactimage_mobile {
  display: none;
}

.contactheader {
  display: flex;
  justify-content: space-between;
  margin-left: auto;
  margin-right: auto;
  max-width: 1024px;
  
  
}

.contactheader a {
  
  text-decoration: none;
  color: #008DB9;
}

.contactleft {
  flex:67%;
  text-align: left;
  padding: 0px;
}

.contactright {
  flex: 33%;
  padding-top: 20px;
  
}

.form {
  max-width: 60%;

}

.blogpost {
  display: flex;
}

.blogimage {
  flex: 33%;
}

.blogtext {
  flex: 67%;
}

.commentsection {
  margin-top: 15px;
}

/* CAROUSEL */

.testimonials {
 
  background-color: #00b0b9;
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  border-radius: 15px;
  color: white;
  font-size: 0.9rem;
  text-align: center;
  align-items: center;
  padding: 10px 40px;
}

.testimonialtext {
background-color: #00b0b9;
padding: 10px 35px 5px 40px;
color: white;
font-size: 0.9rem;
border-radius: 5px;
}

.regular slider {
  align-items: center;
}

/* Media Queries */



@media screen and (max-width: 800px) {

    h1{
      text-align: center;
    }
   
.mainbody {
  padding-top: 80px;
}
 h3{
   text-align: center;
 }

.menu {
  padding-top: 0px;
}

 .menu a {

  padding-bottom: 10px;
 }

    .headercontent3 a {
      font-size: 1rem;
      
     
    }


    
    .heroimage {
      flex: 40%;
    }
    .herotext {
      flex: 60%;
    }

.footercontainer {
    display: block;

}

  .topnav a {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
    padding-top: 25px;
  }
  .headercontent1 {
    flex:33%;
  }

  .headercontent2 {
  flex:33%;
  text-align: center;
 
  }

  .headercontent3 {
    flex: 33%;
    padding-top: 0px;
  }

  

  .footercontent1 {
    text-align: center;
    padding: 0px;
    display: none;
  }

  .footercontent2 {
    text-align: center;
    padding: 0px;
    
    
  }
  
  .footercontent3 {
    text-align: center;
    padding: 0px;
    display: none;
  }

  .topnav.responsive {position: relative;
    padding-top: 55px;
    }

    .topnav.responsive a.icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      
      position: relative;
          float: none;
      display: block;
      text-align: right;
    }
  .headercontent3 a:hover {
    background-color: none;
 
    transition: ease-in;
    transition-duration: 0.2s;
  }
  


  .services {
    display: block;
    text-align: center;
    padding-top: 1px;
    padding-bottom: 1px;
  }

  .topsection {
    text-align: center;
  }

  .whysection {
    text-align: center;
  }
 
  .howsection {
    text-align: center;
  }

.contactheader {
  display: block;
}

.contactright {
  display: none;
}

.contactimage_mobile {
  display: block;
}

.form {
  max-width: 95%;

}

}

@media screen and (max-width: 600px) {

  .partners {
    display: none;
  }
  
.regular slider {
  background-color: #00b0b9;

}

.herobox {
  display: block;
}

.heroimage {
  display: none;
}
.heroimagemob {
  display: block;
}

.testimonialtext {
  padding: 7px;
}

.latestblogposts {
width: 70%;
display: block;
text-align: center;
padding:0px;
margin-left:auto;
margin-right: auto;

}
.post {
text-align: center;
width: 100%
}

.contactbox {
  display: block;
}

.imageblock1 {
  display: block;
}


.imageblock{
  display: none;
}

h1 {
  padding:10px;
  font-size: 1.4rem;
  
}

h2 {
  font-size: 1.2rem;
}

h3 {
  font-size: 1.3rem;
}

 h5 {
   margin-bottom: 10px;
 }
 .holdingcontent {
  padding-top: 180px;
}

   }

  
  @media screen and (max-width: 400px) {

    h1 {
      font-size: 1.3rem;
      text-align: center; 
    }
.headersection{
  padding:0px;
}
    .latestblogposts {
      width: 70%;
    }

.button {
  text-align: center;
}
       .headercontent3 {
         font-size: 0.9rem;
       }
      
.fbbanner a {
  font-size: 0.8rem;
}
    
      }

      @media screen and (max-width: 370px) {
        .topnav.responsive a {
          font-size: 0.9rem;
        }
        .mainbody {padding-top: 50px;}

      }

      @media screen and (max-width: 340px) {
        
       


      }
    