/********** Template CSS **********/
:root {
    --primary: #a6b949;
    --secondary: #489014;
    --light: #F2F2F2;
    --dark: #111111;
}

.fw-medium {
    font-weight: 600 !important;
}

.back-to-top {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 45px;
    z-index: 99;
}


/*** Spinner ***/
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}


/*** Button ***/
.btn {
    font-weight: 500;
    text-transform: uppercase;
    transition: .5s;
    border-radius: 7px;
}

.btn.btn-primary,
.btn.btn-secondary {
    color: #FFFFFF;
}

.btn-square {
    width: 38px;
    height: 38px;
}

.btn-sm-square {
    width: 32px;
    height: 32px;
}

.btn-lg-square {
    width: 48px;
    height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 7%;
}


/*** Navbar ***/
.navbar .dropdown-toggle::after {
    border: none;
    content: "\f107";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    vertical-align: middle;
    margin-left: 8px;
}

.navbar-light .navbar-nav .nav-link {
    margin-right: 30px;
    padding: 25px 0;
    color: #FFFFFF;
    font-size: 15px;
    text-transform: uppercase;
    outline: none;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: var(--primary);
}

@media (max-width: 991.98px) {
    .navbar-light .navbar-nav .nav-link  {
        margin-right: 0;
        padding: 10px 0;
    }

    .navbar-light .navbar-nav {
        border-top: 1px solid #EEEEEE;
    }
}

.navbar-light .navbar-brand,
.navbar-light a.btn {
    height: 75px;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--);
    font-weight: 500;
}

.navbar-light.sticky-top {
    top: -100px;
    transition: .5s;
}

@media (min-width: 992px) {
    .navbar .nav-item .dropdown-menu {
        display: block;
        border: none;
        margin-top: 0;
        top: 150%;
        opacity: 0;
        visibility: hidden;
        transition: .5s;
    }

    .navbar .nav-item:hover .dropdown-menu {
        top: 100%;
        visibility: visible;
        transition: .5s;
        opacity: 1;
    }
}


/*** Header ***/
.carousel-caption {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .7);
    z-index: 1;
}

.carousel-control-prev,
.carousel-control-next {
    width: 10%;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    width: 3rem;
    height: 3rem;
}

@media (max-width: 768px) {
    #header-carousel .carousel-item {
        position: relative;
        min-height: 450px;
    }
    
    #header-carousel .carousel-item img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

.page-header {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.page-header-inner {
    background: #a6b94991;
}

.breadcrumb-item + .breadcrumb-item::before {
    color: var(--light);
}


/*** Facts ***/
.fact {
    background: url(../img/Background\ copy.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}


/*** Service ***/
.service .nav .nav-link {
    background: var(--light);
    transition: .5s;
}

.service .nav .nav-link.active {
    background: var(--primary);
}

.service .nav .nav-link.active h4 {
    color: #FFFFFF !important;
}


/*** Booking ***/
.booking {
    background: url(../img/Background\ copy.png) center center no-repeat;
    background-size: cover;
}

.bootstrap-datetimepicker-widget.bottom {
    top: auto !important;
}

.bootstrap-datetimepicker-widget .table * {
    border-bottom-width: 0px;
}

.bootstrap-datetimepicker-widget .table th {
    font-weight: 500;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    padding: 10px;
    border-radius: 2px;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background: var(--primary);
}

.bootstrap-datetimepicker-widget table td.today::before {
    border-bottom-color: var(--primary);
}


/*** Team ***/
.team-item .team-overlay {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary);
    transform: scale(0);
    transition: .5s;
}

.team-item:hover .team-overlay {
    transform: scale(1);
}

.team-item .team-overlay .btn {
    color: var(--primary);
    background: #FFFFFF;
}

.team-item .team-overlay .btn:hover {
    color: #FFFFFF;
    background: var(--secondary)
}


/*** Testimonial ***/
.testimonial-carousel .owl-item .testimonial-text,
.testimonial-carousel .owl-item.center .testimonial-text * {
    transition: .5s;
}

.testimonial-carousel .owl-item.center .testimonial-text {
    background: var(--primary) !important;
}

.testimonial-carousel .owl-item.center .testimonial-text * {
    color: #FFFFFF !important;
}

.testimonial-carousel .owl-dots {
    margin-top: 24px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.testimonial-carousel .owl-dot {
    position: relative;
    display: inline-block;
    margin: 0 5px;
    width: 15px;
    height: 15px;
    border: 1px solid #afc73b;
    border-radius: 15px;
    transition: .5s;
}

.testimonial-carousel .owl-dot.active {
    background: var(--primary);
    border-color: var(--primary);
}


/*** Footer ***/
.footer {
    background: url(../img/Background\ copy.png) center center no-repeat;
    background-size: cover;
}

.footer .btn.btn-social {
    margin-right: 5px;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--light);
    border: 1px solid #FFFFFF;
    border-radius: 35px;
    transition: .3s;
}

.footer .btn.btn-social:hover {
    color: var(--primary);
}

.footer .btn.btn-link {
    display: block;
    margin-bottom: 5px;
    padding: 0;
    text-align: left;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: normal;
    text-transform: capitalize;
    transition: .3s;
}

.footer .btn.btn-link::before {
    position: relative;
    content: "\f105";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    margin-right: 10px;
}

.footer .btn.btn-link:hover {
    letter-spacing: 1px;
    box-shadow: none;
}

.footer .copyright {
    padding: 25px 0;
    font-size: 15px;
    border-top: 1px solid rgba(256, 256, 256, .1);
}

.footer .copyright a {
    color: var(--light);
}

.footer .footer-menu a {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid rgba(255, 255, 255, .3);
}

.footer .footer-menu a:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
}


/***news section***/
.news-section h1 {
    color: #0077b6;
    font-family: var(--font-playfair);
    font-size: 30px;
    font-style: normal;
    font-weight: 100;
    line-height: normal;
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-skip-ink: none;
    text-underline-offset: 15px;
    /* Adjust the value as needed */
    text-align: center;
    padding-bottom: 20px;
  }

  @media (max-width: 700px) {
    .news-section {
      margin-top: 50px;
    }
    .readmore {
      padding: 5px 15px;
    }
  
    .news-details-carousel {
      display: flex;
      justify-content: center;
      /* Center horizontally */
      flex-wrap: wrap;
      /* Allow cards_album to wrap when screen size is reduced */
    }
    
  }

  .news-details {
    margin-top: 50px;
    padding-bottom: 100px;
  }
  
  .news-details-head {
    display: flex;
  }
  
  /* Styles for images within the news-details-head section */
  .news-details-head-img img {
    border-radius: 25px; /* Rounds the corners of the image */
    max-width: 100%; /* Ensures the image does not exceed its container's width */
    height: 330px; /* Sets a fixed height for the image */
    width: auto\9; /* Specific width for IE8 compatibility */
    /* Adds a subtle shadow around the image */
    box-shadow: 0.375rem 0.3125rem 1.5625rem rgba(0, 0, 0, 0.2);
    object-fit: cover; /* Ensures the image covers the entire area without distorting */
  }
  .news-details-head-texts {
    margin-left: 20px;
  }
  
  .news-details-head-texts h1 {
    max-width: 90%;
    font-family: var(--font-Inter);
    font-size: 28px;
    font-weight: 600;
  }
  
  .dates h6 {
    font-family: var(--font-Inter);
    background-color: #ebf9bf;
    font-size: 13px;
    color: #000;
    padding: 5px 35px;
    border-radius: 5px;
    font-weight: 300;
  }
  
  .readmore {
    font-family: var(--font-Inter);
    padding: 8px 20px;
    color: #fff;
    font-weight: 400;
    background-color: #b9ce54;
    border: none;
    margin-top: 5px;
    text-align: center !important;
    font-size: 14px;
    border-radius: 5px;
    transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
    box-shadow: 0.375rem 0.3125rem 1.5625rem rgba(0, 0, 0, 0.2);
  }
  
  .readmore:hover {
    color: #a6b949;
    background-color: #fff;
  }
  
  .wrapper {
    width: 100%;
    padding-top: 20px;
    text-align: center;
  }
  
  h2 {
    font-family: sans-serif;
    color: #fff;
  }
  .news-section h1 {
    font-size: 25px !important;
    text-align: center;
  }

  .news-details-head-img img {
    height: auto !important;
  }
  .news-details-head-title {
    line-height: 38px !important;
    padding-bottom: 10px;
  }
  .card-body {
    display: flex;
    flex-direction: column;
    /* align-items: center; */
  }
  
  .card-body .btn {
    width: 100%;
  }

.page-header {
    background: url(../img/Background.png) center center no-repeat;
    background-size: cover;
}

/**sample**/
.about-title h1 {
    color: #fff;
    text-align: center;
    margin-top: 100px;
    font-style: normal;
    font-weight: 450;
    font-size: 40px;
    line-height: 1.5;
    text-underline-offset: 10px;
    /* Adjust the value as needed */
  }

    /* Adjust the value as needed */
  .about-para {
    color: #fff;
    text-align: center;
    margin-top: 2em;
    padding: 50px 150px;
    font-family: var(--font-Inter);
    font-size: 1.3em;
    line-height: 1.8;
    font-weight: normal;
  }
  
  @media (max-width: 950px) {
    .org-committe-title h1 {
        font-size: 35px;
    }
    .about-title h1 {
        font-size: 30px;
    }

    .about-para {
        padding: 10px;
        font-size: 1rem;
    }
    .about {
        position: relative;
        z-index: 10;
        margin-top: -33px;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        object-fit: contain;
        height: auto;
        overflow: hidden;
        padding: 20px;
        min-height: 700px !important;
    }
}

.svg-container {
    width: 300px; /* Adjust as needed */
    height: 300px; /* Adjust as needed */
    background: url('your-background-image.png') no-repeat center center;
    background-size: cover;
    clip-path: path('M0 3800 l0 -3800 6830 0 6830 0 0 3801 0 3802 -97 -7 c-198 -14 -305 -47 -544 -165 -225 -111 -278 -124 -499 -125 -223 -1 -256 8 -510 129 -281 135 -374 158 -625 159 -253 0 -363 -28 -637 -163 -203 -100 -273 -120 -444 -128 -225 -10 -330 15 -569 134 -259 130 -369 157 -630 157 -257 0 -365 -27 -627 -156 -185 -91 -243 -112 -357 -129 -114 -16 -313 -7 -415 20 -43 12 -140 52 -217 91 -76 38 -166 81 -201 95 -247 101 -589 110 -853 24 -33 -11 -138 -58 -234 -105 -235 -116 -280 -127 -501 -128 -223 -1 -261 9 -500 124 -294 141 -384 164 -645 164 -261 0 -371 -27 -630 -157 -239 -119 -344 -144 -569 -134 -171 8 -241 28 -444 128 -274 135 -384 163 -637 163 -251 -1 -344 -24 -625 -159 -254 -121 -287 -130 -510 -129 -222 1 -274 14 -505 128 -93 46 -208 96 -255 111 -85 26 -256 54 -337 55 l-43 0 0 -3800z');
}

.svg-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    clip-path: inherit; /* Apply the same clip-path to the image */
}


/*post card styles*/

.card{
  border: none;
  transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  overflow:hidden;
  border-radius:20px;
  min-height:500px;
  box-shadow: 0 0 12px 0 rgba(0,0,0,0.2);
/* Post card styles */

/* 
  The minimum height of the post card is set to 450px on large screens and
  350px on medium screens and 300px on small screens. This is to ensure that the
  post cards are always visible and not cut off. 
*/
@media (max-width: 768px) {
    .card {
        min-height: 350px;
    }
}

@media (max-width: 420px) {
    .card {
        min-height: 300px;
    }
}



 &.card-has-bg{
 transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
  background-size:120%;
  background-repeat:no-repeat;
  background-position: center center;
  &:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: inherit;
    -webkit-filter: grayscale(1);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);}

  &:hover {
    transform: scale(0.98);
     box-shadow: 0 0 5px -2px rgba(0,0,0,0.3);
    background-size:130%;
     transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);

    .card-img-overlay {
      transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
      background: #f7fcca;
     background: linear-gradient(0deg, #cbff6b80 0%, #95c047 100%);
     }
  }
}
 .card-footer{
  background: none;
   border-top: none;
    .media{
     img{
       border:solid 3px rgba(255,255,255,0.3);
     }
   }
 }
  .card-title{font-weight:800}
 .card-meta{color:rgba(0,0,0,0.3);
  text-transform:uppercase;
   font-weight:500;
   letter-spacing:2px;}
 .card-body{ 
   transition: all 500ms cubic-bezier(0.19, 1, 0.22, 1);
 

  }
 &:hover {
   .card-body{
     margin-top:30px;
     transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
   }
 cursor: pointer;
 transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
}
 .card-img-overlay {
  transition: all 800ms cubic-bezier(0.19, 1, 0.22, 1);
 background: #a4fba7;
background: linear-gradient(0deg, #fff6da 0%, #fff6da 100%);
}
}

/* The actual events timeline (the vertical ruler) */
.main-timeline-2 {
  position: relative;
}

/* The actual timeline (the vertical ruler) */
.main-timeline-2::after {
  content: "";
  position: absolute;
  width: 3px;
  background-color: #26c6da;
  top: 0;
  bottom: 0;
  left: 50%;
  margin-left: -3px;
}

/* Container around content */
.timeline-2 {
  position: relative;
  background-color: inherit;
  width: 50%;
}

/* The circles on the timeline */
.timeline-2::after {
  content: "";
  position: absolute;
  width: 25px;
  height: 25px;
  right: -11px;
  background-color: #26c6da;
  top: 15px;
  border-radius: 50%;
  z-index: 1;
}

/* Place the container to the left */
.left-2 {
  padding: 0px 40px 20px 0px;
  left: 0;
}

/* Place the container to the right */
.right-2 {
  padding: 0px 0px 20px 40px;
  left: 50%;
}

/* Add arrows to the left container (pointing right) */
.left-2::before {
  content: " ";
  position: absolute;
  top: 18px;
  z-index: 1;
  right: 30px;
  border: medium solid white;
  border-width: 10px 0 10px 10px;
  border-color: transparent transparent transparent white;
}

/* Add arrows to the right container (pointing left) */
.right-2::before {
  content: " ";
  position: absolute;
  top: 18px;
  z-index: 1;
  left: 30px;
  border: medium solid white;
  border-width: 10px 10px 10px 0;
  border-color: transparent white transparent transparent;
}

/* Fix the circle for containers on the right side */
.right-2::after {
  left: -14px;
}

/* Media queries - Responsive timeline on screens less than 600px wide */
@media screen and (max-width: 600px) {
  /* Place the timelime to the left */
  .main-timeline-2::after {
    left: 31px;
  }

  /* Full-width containers */
  .timeline-2 {
    width: 100%;
    padding-left: 70px;
    padding-right: 25px;
  }

  /* Make sure that all arrows are pointing leftwards */
  .timeline-2::before {
    left: 60px;
    border: medium solid white;
    border-width: 10px 10px 10px 0;
    border-color: transparent white transparent transparent;
  }

  /* Make sure all circles are at the same spot */
  .left-2::after,
  .right-2::after {
    left: 18px;
  }

  .left-2::before {
    right: auto;
  }

  /* Make all right containers behave like the left ones */
  .right-2 {
    left: 0%;
  }
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* 1:1 aspect ratio */
  height: 0;
}

.video-container .video-class {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

/* Default to 1:1 aspect ratio */
#video {
  position: relative;
  width: 100%;
  padding-bottom: 100%; /* 1:1 aspect ratio */
  height: 0;
}

#video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Change to 21:9 aspect ratio on larger screens */
@media (min-width: 992px) {
  #video {
      padding-bottom: 42.86%; /* 21:9 aspect ratio */
  }
}

@media (min-width: 992px) {
  .image-container {
    /* add your styles here */
    position: relative;
    background-color: #fcffe9;
    padding: 1px;
    border: 0px solid #d1ffd9;
    object-fit: cover;
    border-radius: 25px;
    width: 100%;
    height: 0;
    padding-bottom: 47.86%; /* 21:9 aspect ratio */
    overflow: hidden;
      
    .full-image {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }
}

.boo {
  position: absolute;
  top: 5%;
  left: 0%;
  transform: translate(-0%, -5%);
}