* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img {
  max-width: 100%;
}

a,
a:hover,
a:focus,
a:visited,
a:active {
  text-decoration: none;
}

p,
ul,
li {
  padding: 0;
  margin: 0;
}

/* body {
  font-family: 'PT Sans', sans-serif;
} */



/* header */
header {
  position: unset;
  left: 0;
  right: 0;
  top: 0;
  z-index: 99;
}

header .header-top {
  background-color: #000000;
  padding: 10px 0px;
}

header .header-top .top-info li,
header .header-top .top-info li a {
  color: #fff;
  font-size: 14px;
  font-family: 'PT Sans', sans-serif;
}

header .headermn{background-color: #fcfff4;}

header .headermn .navbar .navbar-brand {
  width: 11%;
}

header .nav-link {
  color: #000;
  font-size: 16px;
  font-weight: 600;
  transition: .5s;
  position: relative;
  padding: 0px 0px !important;
  /* text-transform: uppercase; */
  font-family: 'PT Sans', sans-serif;
}

header .nav-link::after {
  content: '';
  background-color: #000;
  width: 0%;
  height: 2px;
  position: absolute;
  bottom: -5px;
  left: 0;
  transition: .5s;
}

header .nav-link:hover::after {
  width: 100%;
}

header .nav-link:hover,
header .nav-link:focus {
  color: #000;
}

header .navbar-nav {
  gap: 40px;
}

header .navbar-toggler {
  border: none;
  color: #000;
  font-size: 28px;
  border-radius: 0;
}

header .navbar-toggler:focus {
  box-shadow: none;
}

header .offcanvas-title img {
  width: 34%;
}

.sticky {
  left: 0;
  right: 0;
  z-index: 999;
  position: fixed !important;
  top: 0px;
  animation: slideDown .5s ease-out;
  background-color: #fff;
  box-shadow: 0 0 10px #00000021;
}

.sticky .headermn .navbar .navbar-brand {
  width: 9%;
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(10);
  }
}

.headermn .top-btn .btn{display: inline-block; padding: 10px 20px; background-color: #000; color: #fff; border-radius: 3px; transition: .5s; border: 1px solid #000;}
.headermn .top-btn .btn:hover{background-color: transparent; color: #000;}


/* slider */

#slider .owl-item {background-position: bottom right; background-repeat: no-repeat; background-size: cover; padding: 274px 0;}
#slider .owl-theme .owl-dots .owl-dot {display: none;}

/* about */

#about{background-color: #5c14eb; padding: 15px 0px; overflow: hidden; margin-top: -11px;}
/*#about .video-se video{width: 100%; height: 100%;}*/
#about h2{color: #fff; margin-bottom: 20px; font-style: italic;}
#about .text{color: #fff;}




/* activities */

#activities{background-color: #8F85D1; padding: 70px 30px; background-image: url(../images/team-one-bubbles.png); background-position: center; background-repeat: no-repeat; background-size: cover;}
#activities .row{row-gap: 30px;}
#activities h2{text-align: center; margin-bottom: 50px; color: #fff; font-size: 40px; font-weight: 600;} 
#activities .iner{position: relative;}
#activities .iner .imgs img{border-radius: 20px;}
#activities .iner::before {position: absolute; top: 0; content: ''; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; opacity: 0; transition: .5s ease; border-radius: 20px; background-color: rgba(0, 0, 0, .8); transition: .5s;}
#activities .iner:hover::before{opacity: 1;} 
#activities .iner .content{position: absolute; left: 0px; right: 0px; bottom: 0px; top: 0px; padding: 20px 15px; text-align: center; z-index: 2; opacity: 0; transition: .5s;}
#activities .iner:hover .content{opacity: 1;}
#activities .iner .content h3{color: #fff; margin-top: 45px;}


/* video-sc-bg */

#reels{background-image: url(../images/video-sc-bg.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 15px 0px;}
#reels .imgs{border: 2px solid #000;}
#reels .iner{width: 100%; height: 100%;}
#reels .iner .content{margin-top: 26%;}
#reels .iner .content h2{color: #fff;}
/* #reels .iner .content h5{color: #fff;} */
#reels .owl-theme .owl-dots .owl-dot{display: none;}

/* #video-sc-bg{background-image: url(../images/video-sc-bg.jpg); background-position: center; background-repeat: no-repeat; background-size: cover; padding: 15px 0px;}
#video-sc-bg .imgs{border: 2px solid #000;}
#video-sc-bg .iner{background-color: #000; width: 100%; height: 100%; padding: 10px 20px; text-align: center;}
#video-sc-bg .iner .content{margin-top: 26%;}
#video-sc-bg .iner .content h2{color: #fff;}
#video-sc-bg .iner .content h5{color: #fff;}
#video-sc-bg .owl-theme .owl-dots .owl-dot{display: none;} */

/* testimonails */

#testimonails{background-image: url(../images/testmonaiol-bg.jpg); background-repeat: no-repeat; background-size: cover; padding: 20px 0px 0px;}
#testimonails h3{text-align: center; color: #fff; font-size: 20px;}
#testimonails h2{color: #fff; text-align: center; margin-bottom: 20px;}
#testimonails .content{padding: 20px; box-shadow: 0px 0px 10px #00000083;}
#testimonails .content .text{color: #fff; text-align:center;}
#testimonails .content h5{color: #fff; text-align:center; margin-top: 20px;}
#testimonails .owl-theme .owl-dots .owl-dot {display: none;}
#testimonails .owl-carousel .owl-stage-outer {padding: 15px 5px;}

/* contact */

#contact{background-color: #000; overflow: hidden;}
#contact h6{color: #fff; font-family: arefRuqaa;}
#contact .content{padding: 31px 10px;}
#contact h2{color: #fff; font-size: 34px; font-weight: 600; margin: 10px 0px 22px; font-family: arefRuqaa;}
#contact .iner{row-gap: 30px;}
#contact .iner .form-control{background-color: transparent; border: transparent; border-radius: 0px; border-bottom: 1px solid #fff; padding: 24px 4px 50px; box-shadow: none; color: #fff; font-family: arefRuqaa;}
#contact .iner .form-control::placeholder{color: #fff; font-family: arefRuqaa;}
#contact .iner .btn{padding: 13px 55px; background-color: #fff; color: #000; border-radius: 4px; border: 1px solid #fff;   font-family: arefRuqaa;}
#contact .iner .btn:hover{background-color: transparent; color: #fff;}



/* footer */

footer .footertop {background: url(../images/banner-shape.png) #111; background-size: cover; padding: 72px 0 42px;}

footer .row {
  row-gap: 25px;
}

footer .footertop h3{font-size: 20px; margin-bottom: 15px; color: #fff;}

footer .footertop .about img {
  width: 111px;
  filter: invert(1);
}

footer .footertop .about p {
  color: #fff;
  font-size: 14px;
  width:77%;
  margin-top: 20px;
}

footer .footertop ul {
  list-style: none;
}

footer .footertop ul li {
  color: #fff;
  font-size: 14px;
  margin-top: 10px;
}

footer .footertop ul li a {
  color: #fff;
  font-size: 14px;
  transition: .5s;
  display: inline-block;
  border-bottom: 1px solid transparent;
}

footer .footertop ul li a:hover {
  color: #fff;
}

footer .footertop .addres li {
  margin-bottom: 20px;
}

footer .footertop .addres li i {
  color: #fff;
  font-size: 22px;
}

footer .footerboo ul {
  display: flex;
  justify-content: space-between;
  margin: 0;
  border-top: 1px solid #fff;
  padding-top: 20px;
}

footer .footerboo {
  background-color: #111;
  padding: 20px;
}

footer .footerboo .soical li:first-child {
  color: #000000;
  text-align: center;
}

footer .footerboo .soical li:first-child a {
  color: #000;
  font-size: 16px;
  display: inline-block;
  width: 35px;
  height: 35px;
  line-height: 35px;
  background-color: #fff;
  border-radius: 50%;
  transition: .5s;
}


footer .footerboo ul li img {
  width: 195px;
  background-color: #000000;
  padding: 0px 10px 8px;
  border-radius: 100px;
}

/* heading */





/* quickcontact */
.quickcontact {
  width: 45px;
  position: fixed;
  top: 77%;
  right: 15px;
  z-index: 102;
}



/* modal */

.modal form.row {
  row-gap: 20px;
}

.modal .form-control {
  border-radius: 0px;
  border: none;
  box-shadow: none;
  background-color: #f1f1f1;
}

.modal .form-control:focus {
  border-color: #000;
}

.modal .submit {
  background-color: #000;
  color: #fff;
  font-weight: 500px;
  padding: 10px;
  border: 0;
  transition: .5;
}

.modal .submit:hover {
  background-color: #000;
}



/* gallery */

#gallery {
  background-color: #b724b0;
  padding: 60px 0 40px;
  overflow: hidden;
}

#gallery .row{row-gap: 20px;}

#gallery h2 {
  font-size: 38px;
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin-bottom: 30px;
}

#gallery h2 span {
  color: #000;
}

#gallery .img-wrapper {
  position: relative;
  margin-top: 15px;
  overflow: hidden;
  border-radius: 10px;
  box-shadow: 0 0 8px #00000033;
}

#gallery .img-wrapper img {
  width: 100%;
}

#gallery .img-overlay {
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
}

#gallery .img-overlay i {
  color: #fff;
  font-size: 3em;
}

#overlay {
  background: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 999;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

#overlay img {
  margin: 0;
  width: 80%;
  height: auto;
  -o-object-fit: contain;
  object-fit: contain;
  padding: 5%;
}

@media screen and (min-width: 768px) {
  #overlay img {
    width: 60%;
  }
}

#nextButton i {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
}

#nextButton:hover {
  opacity: 1;
}

#prevButton i {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
}

#prevButton:hover {
  opacity: 0.7;
}

#exitButton i {
  color: #fff;
  font-size: 2em;
  transition: opacity 0.8s;
  position: absolute;
  top: 15px;
  right: 15px;
}

#exitButton:hover {
  opacity: 0.7;
}
