@charset "utf-8";
@import url("https://fonts.googleapis.com/css?family=Raleway:300,400,700,900&display=swap");
@import url("https://cdn-uicons.flaticon.com/uicons-regular-rounded/css/uicons-regular-rounded.css ");

html,
body,
h1,
h2,
h3,
h4,
h5,
p,
a,
li {
  font-family: "Raleway", sans-serif;
}

body,
html {
  height: 100%;
}
.bx-viewport,
.bx-wrapper {
  position: relative;
  width: 100%;
  height: 100% !important;
  top: 0;
  left: 0;
}
.bxslider,
.bxslider li {
  height: 100% !important;
}
.bxslider li {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
.bx-wrapper .bx-viewport {
  border: none !important;
}

/* Helper Classes */
.font-big {
  font-weight: 600;
}

.font-thick {
  font-weight: 500;
  text-align: center;
  color: #000;
  margin-bottom: 35px;
}

a:hover{
    text-decoration: none !important;
    color: black;
}
.font-regular {
  font-weight: 400;
}

.font-light {
  font-weight: 300;
}

.text-white {
  color: var(--white) !important;
}


.text-white1 {
  color: var(--white) !important;
}

/* Variables */
:root {
  --primary-color: #123a29;
  --small-font: 13px;
  --primary-dark: #000503;
  --white: #ffffff;
  --dark: #333333;
}

/* Overwrites */

.btn-primary {
  background-color: var(--primary-color) !important;
  border: none;
}

.bg-dark {
  background-color: var(--primary-color) !important;
  /*opacity:0.85;*/
}
.nav-item a {
  font-size: var(--small-font) !important;
}

.bx-wrapper {
  padding: 0;
  border: 0;
  margin-bottom: 0;
  box-shadow: none;
}

.bx-viewport,
.bx-wrapper {
  position: relative;
  width: 100%;
  height: 100% !important;
  top: 0;
  left: 0;
}
.bxslider,
.bxslider li {
  height: 100% !important;
}
.bxslider li {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
.bx-wrapper .bx-viewport {
  border: none !important;
}

.text-book-style {
  margin: 0 auto;
}

/* End Overwrites */

.navbar-expand-lg .navbar-nav .nav-link {
  padding-left: 1rem;
  padding-right: 1rem;
  color: ghostwhite;
}

.nav-item:hover {
  transition-property: width;
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
}

.nav-item a:hover{
    color: #df9408 !important;
    
}
/* .nav-link:after {
  content: "";
  position: absolute;
  z-index: -1;
  right: 0;
  width: 0;
  bottom: -5px;
  background:var(--white);
  height: 2px;
  transition-property: width;
  transition-duration: 0.3s;
  transition-timing-function: ease-out;
}
.nav-link:hover:after,
.nav-link:focus:after,
.nav-link:active:after {
  left: 0;
  right: auto;
  width: 100%;
} */

.slide-text {
  position: absolute;
  top: 28%;
  width: 100%;
  margin: 0 auto;
  text-shadow: 1px 1px 1px #000;
}

.vids {
  background: #efefef;
  padding: 3rem 0;
}

.clear-nav {
  height: 83px;
}

footer {
  /*background: var(--dark);*/
  background: #000;
  padding: 3rem;
}

.page-banner {
  padding: 1.5rem 0;
  background: var(--primary-color);
  opacity: 0.85;
}

/*.page-banner h3 {*/
/*  text-decoration: underline;*/
/*}*/

.about-section-2 {
  background: #efefef;
  padding: 3rem 0;
}

.school-details td {
  line-height: 1.5rem;
}

.gray {
  background: #efefef;
  padding: 3rem 0;
}

li {
  margin-bottom: 15px;
}

nav ul li {
  margin-bottom: 0 !important;
}

form ul li {
  list-style: none !important;
}

#map {
  height: 370px;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 50px;
  z-index: 10;
  overflow-y: auto;
}




/* Gallery */

.filter-button {
  font-size: 18px;
  border: 1px solid var(--primary-color);
  border-radius: 2px;
  text-align: center;
  color: var(--primary-color);
  margin-bottom: 30px;
}
.filter-button:hover {
  font-size: 18px;
  border: 1px solid var(--primary-color);
  border-radius: 2px;
  text-align: center;
  color: #ffffff;
  background-color: var(--primary-color);
}
.btn-default:active .filter-button:active {
  background-color: var(--primary-color);
  color: white;
}

.port-image {
  width: 100%;
}

.gallery_product {
  margin-bottom: 30px;
}

.active {
  background: var(--primary-color) !important;
  color: #fff !important;
}

#contactForm ul {
  padding: 0;
}

.second-text{
    
    background-color: #6c757d1c;
}
   select {
    background-color: #f9f9f9; /* Dropdown background color */
    color: #333; /* Text color */
    border: 1px solid #ccc;
    border-radius: 4px;
    padding: 10px;
    font-size: 16px;
    appearance: none; /* Removes default styling */
  }
  
  select option {
    background-color: #ffffff; /* Option background color */
    color: #333; /* Option text color */
  }
  
  /* Optional: Change hover or focus styling for options */
  select option:hover {
    background-color: #f0f0f0; /* Hover background */
    color: #000; /* Hover text color */
  }
  
      .form-area{
      background: aliceblue;
    /* flex: 1; */
    /* min-width: 280px; */
    width: 30%;
    padding: 16px;
    border-radius: 10px;
    right: 0;
    }
      .form-container {
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 144px;
    position: absolute;
    z-index: 1;
    top: 50%;
    /*right: 0px;*/
    transform: translate(5%, -28%);
}
  .home-btn{
    padding: 10px;
     background-color: #123a29; 
     color: white; 
     border: none; 
     border-radius: 5px; 
     cursor: pointer;
  }
  input:focus, select:focus, button:hover {
    outline: none;
    border-color: #28a745;
    box-shadow: 0 0 5px rgba(40, 167, 69, 0.5);
  }
  button:hover {
    background-color: #218838;
  }
  
  
    .form-text h2 {
      font-size: 2.5rem;
      color: #fff;
    }
  
    .form-text p {
      font-size: 1rem;
      color: #fff;
  
    }
    .form-text{
      width: 60%;
    }
  .text-field{
    padding: 4px; 
    border: 1px solid #fff; 
    border-radius: 5px;
     font-size: 15px;
  }
  
  .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #123A29;
    list-style: none;
    margin: 0;
    padding: 16px;
    min-width: 215px;
    text-align: left;
  }
  
  .dropdown-menu li {
    width: 100%;
    padding-bottom: 10px;
  }
  
  .dropdown-menu a {
    padding: 5px 0px !important;
    color: #fff;
    font-size: 13px;
    
  }
  
  
 .image-box-sec a{
     color: #ffc107;
      
  }
   .image-box-sec a:hover{
       color: #fff;
       
       
   }
  .navbar-collapse{
    flex-grow: 0 !important;
  }
  .dropdown-toggle{
    font-size: 13px;
    color: ghostwhite !important;
    padding: 8px 16px;
  
  }
  .dropdown, .dropleft, .dropright, .dropup{
    top: 5px
  }
  .dropdown-menu a:hover {
    background-color: #123A29;
  }
  a:hover {
    /*color:  rgba(255, 255, 255, .5);*/
    color: blue;
  }
  /* Show dropdown on hover for desktop */
  .dropdown:hover .dropdown-menu {
    display: block;
  }
  .login-header{
      font-weight: bold;
    border: 1px solid white; 
    color: white; 
    padding: 10px !important; 
    border-radius: 10px; 
    font-size: 12px;
    /*margin-left: 20px;*/
    background: #DF9408;
  }
.form-resize{
  display: flex; 
  flex-direction: column; 
  gap: 21px; 
  padding: 12px 12px;
}
.scroll-top-button{
    background: #DF9408 !important;
}
.login{
    margin-top: 6px;
}
.navbar-nav .nav-item:last-child:hover {
    border-bottom: none !important;
}

.nav-item .login-header:hover {
    color: #fff !important;
}
.bx-wrapper .bx-controls-direction a {
  top: 38% !important;  
  z-index: 1 !important;
    
}
.home-section{
    margin-bottom: 60px;
}




  .dropdown-toggle:hover {
     color:#DF9408;
    }

  .dropdown-menu a {
      text-decoration: none;
      color: #fff;
      padding: 5px 0px;
      display: block;
    }
    .dropdown-menu a:hover {
      color: #DF9408;
    }
    .dropdown:hover .dropdown-menu {
      display: block;
    }


.form-heading{
    text-align: center;
    font-weight: 600 !important;
    color: #394d61;
    text-transform: uppercase;
}

.home-video-section {
    max-width: 100%;
    margin: 0 auto;
    padding-top: 75px;
}

@media (max-width: 1400px) {
  .form-resize {
    gap: 13px;
  }
  .home-section{
      margin-bottom: 28px;
  }

}
@media (max-width: 1024px) {
  .form-resize {
    gap: 13px;
  }
  .home-section{
      margin-bottom: 28px;
  }
  .navbar-nav{
      font-size: 0rem;
  }
 .whatsapp-consent {
      font-size: 11px;
  }
  .form-container{
      transform: translate(5%, -63%);
  }
  
  .home-image-box-sec .image-box {
    flex: unset !important;
  }

  .home-image-box-sec .image-box {
    max-width: calc(50% - 20px) !important;
  }
}

  @media (max-width: 991px) {
  
      .form-container {
        transform: translate(-5%, -48%);
      }
      
      .form-text h2 {
        font-size: 1.8rem;
        color: #fff;
        max-width: 80%;
        margin: 0 auto 10px;
      }

     .form-resize{
       gap: 8px !important; 
     }

    .text-field {
        padding: 6px 12px;
        border: 1px solid #fff;
        border-radius: 5px;
        font-size: 12px;
    }
    
    .form-text {
        width: 60%;
    }
    
    
    .home-image-box-sec .image-box {
        max-width: calc(100% - 20px) !important;
    }
  }
  
  @media (min-width: 992px) {
    .navbar-expand-lg{
      justify-content: space-between !important;
    }
  }

  @media (max-width: 768px) {
    .form-container {
        transform: translate(-5%, -37%);
        width: 100%;
    }
    .image-box-sec .row {
        display: flex;
        flex-direction: column;
        width: 100%;
   }
   .font-thick{
       font-size: 19px;
   }
    .dropdown-toggle:hover {
     color:#DF9408;
    }

  .dropdown-menu a {
      text-decoration: none;
      color: #fff;
     
    }
    .dropdown-menu a:hover {
      color: #DF9408;
    }
    .dropdown:hover .dropdown-menu {
      display: block;
    }

    .navbar-collapse{
       height: 500px;
    }
    .dropdown, .dropleft, .dropright, .dropup{
        padding-bottom: 10px;
    }
    .dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #123A29;
    list-style: none;
    margin: 0;
    
  }
  .login-header{
      marging-top: 25px !important;
  }
   .dropdown-toggle:hover {
     color:#DF9408;
    }

  .dropdown-menu a {
      text-decoration: none;
      color: #fff;
      display: block;
      padding: 0px !important;
    }
    .dropdown-menu a:hover {
      color: #DF9408;
    }
   .swiper-button-next{
       display: none !important;
   }
   
    .swiper-button-prev{
       display: none !important;
   }
   .login{
    margin-top: 10px !important;
}

.form-heading {
          font-size: 12px;
}
.checkbox-container {
    margin: 0 !important;
}
      .whatsapp-consent {
          font-size: 8px !important;
}
  .form-resize{
      gap: 8px;
  }
}




    @media (max-width: 767px) {
      .form-container {
        flex-direction: column;
        position: initial;
        /* padding: 152px; */
        margin-bottom: 193px;
        margin: 0 auto;
        gap: 50px;
  
      }
      .form-area{
        width: 67%;
        margin-left: 25px;
        margin-top: 40px;
      }
      .form-text {
        text-align: left;
        width: 80%;
        margin-top: 79px;
        font-weight: bold;
       

      }
      .form-text h2 {
        padding-top: 338px;
        color: #fff;
        font-size: 15px;
        font-weight: bold;

      }
      .form-text p {
        color: #fff;
        font-size: 13px;
      }
      .home-section{
        display: flex;
        flex-direction: column-reverse;
        margin-bottom: -399px;
  
      }
    }
    
    
    /* Media Queries */
@media only screen and (max-width: 600px) {
  .slide-text h1 {
    font-size: 20px;
  }
  .slide-text h2 {
    font-size: 16px;
  }
  .mb-sm-4 {
    margin-bottom: 1.5rem;
  }
  .mt-sm-4 {
    margin-top: 1.5rem;
  }
  #contactForm {
    margin-top: 1rem;
  }
  .bxslider li {
    background-repeat: no-repeat;
    background-position: top center;
    background-size: auto;
  }
  .bx-viewport,
  .bx-wrapper {
    height: auto !important;
  }
  .slide-text {
    top: 35%;
  }
  
  .home-video-section {
    padding-top: 60px;
  }
}

  
    @media (max-width: 450px) {
      .form-container {
      transform: translate(-5%, -59%);
      width: 100%;
      margin-bottom: -155px !important;

      }
    }
  












.certificate-card {
  background: #f1f1f1;
  padding: 20px 15px 20px 15px;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  color: #495057;
}

i {
  display: block;
  font-size: 42px;
  margin-bottom: 20px;
}


.bx-wrapper img{
  min-width: 100%;
  filter:brightness(0.6)
}


.image-box-sec {
  text-align: center;
  margin: 40px 20px;
  padding: 20px 20px !important;
  overflow-x: hidden;
}

.image-box-sec .conatiner {
  display: flex;
  justify-content: center;
}

.image-box-sec .row {
  display: flex;
  flex-wrap: wrap;
}

.image-box-sec .image-box {
 flex: 1;
    margin: 10px;
    text-align: center;
    background: #355749;
    padding: 20px;
    border-radius: 10px;
}

.image-box-sec .image {
  max-width: 100%;
  height: auto;
}

.image-box-sec .heading {
  font-size: 17px;
  font-weight: 400;
  margin-top: 10px;
  text-align: left;
  color: #fff;
  font-weight: bold;
}

.image-box-sec .paragraph {
  font-size: 15px;
  margin-top: 10px;
  text-align: left;
  color: #fff;
}



/* CSS for the contact card */
.contact-card {
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 20px;
  background-color: #ffffff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  width: 100%;
}

.contact-card .subhead5 {
  font-weight: 600;
  font-size: 22px;
  margin-bottom: 10px;
}

.contact-card .card-icon {
  font-size: 24px;
  color: #123a29;
}

.contact-card p {
  margin: 0;
  font-weight: 500;
}

/*.imageResize img{*/
/*    max-width: 500px;*/
/*    width: 100%;*/
/*    max-height:254px;*/
/*    height: 254px;*/
/*    object-fit: cover;*/
/*}*/
