@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Bold.woff2') format('woff2'),
      url('../fonts/Poppins-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Regular.woff2') format('woff2'),
      url('../fonts/Poppins-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Light.woff2') format('woff2'),
      url('../fonts/Poppins-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Poppins';
  src: url('../fonts/Poppins-Medium.woff2') format('woff2'),
      url('../fonts/Poppins-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'fontello';
  src:url('../fonts/fontello.woff2') format('woff2'),
       url('../fonts/fontello.woff') format('woff');
       font-weight: normal;
       font-style: normal;
}
[class^="icon-"]:before, [class*=" icon-"]:before, .slick-prev:before, .slick-next:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  display: inline-block;
  text-decoration: inherit;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: .2em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-phone:before { content: '\e800'; } /* '' */
.icon-search:before { content: '\e801'; } /* '' */
.icon-twitter:before { content: '\e802'; } /* '' */
.icon-location:before { content: '\e803'; } /* '' */
.icon-left-open-mini:before, .slick-prev:before { content: '\e804'; } /* '' */
.icon-right-open-mini:before, .slick-next:before { content: '\e805'; } /* '' */
.icon-down-open-mini:before { content: '\e806'; } /* '' */
.icon-up-open-mini:before { content: '\e807'; } /* '' */
.icon-left-small:before { content: '\e808'; } /* '' */
.icon-right-small:before { content: '\e809'; } /* '' */
.icon-mail-alt:before { content: '\f0e0'; } /* '' */
.icon-linkedin:before { content: '\f0e1'; } /* '' */
.icon-youtube-play:before { content: '\f16a'; } /* '' */
.icon-instagram:before { content: '\f16d'; } /* '' */
.icon-facebook:before { content: '\f30c'; } /* '' */
.icon-play:before { content: '\e80a'; } /* '' */

:root{
  --primary-font:'Poppins', sans-serif;
   --black:#000;
   --blue:#01FDFE;
   --white:#fff;
}
body {
    width: 100%;
    height: 100%;
    font-family: var(--primary-font);
    font-weight:normal;
    font-size:16px;
    background-color:var(--black);
    line-height:1.8;
	  color:var(--black);
    font-display: swap;
}
html {
    width: 100%;
    height: 100%;
}
a {
    text-decoration: none;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
a:hover,
a:focus {
    text-decoration: none;
    outline: none;
    color: var(--blue);
}
button:focus {
    outline: 0px dotted;
}

b, strong{
  font-family: var(--primary-font);
	font-weight:500;
	color:var(--white);
  }
p{
	color:var(--white);
	line-height:1.8;
	font-size: 16px;
  font-weight: 300;
	}

h1{
    font-family: var(--primary-font);
    color:var(--blue);
    line-height:1.3;
    font-size:40px;
    font-weight:500;
    margin-top: 0;
    margin-bottom:20px;
}
h2{
  font-family: var(--primary-font);
  color:var(--blue);
  line-height:1.4;
  font-size:36px;
  font-weight:500;
  margin-top: 0;
  margin-bottom:20px;
}
h3{
   font-family: var(--primary-font);
   color: var(--blue);
   font-size:21px;
   line-height:1.6;
   font-weight:500;
   margin-bottom:20px;
}
h4{
  font-family: var(--primary-font);
  color: var(--white);
  font-size:21px;
  line-height:1.5;
  font-weight:300;
  margin-bottom: 22px;
}
h5{
  font-size:18px;
  line-height:1.5;
  font-weight:500;
  color:var(--blue);
}
.text-justify{
	text-align: justify;
}
.row-box{
	width:100%;
	clear:both;
	display: flex;
	flex-wrap: wrap;
}
section, footer{
	width:100%;
	clear:both;
  display: flex;
	flex-wrap: wrap;
  position: relative;
	}
.gray-bg{
  background-color:var(--gray-bg);
}  
.m-top{
  margin-top:125px;
}	
.padding{
	padding:60px 0;
	}
.img-zoom img{
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.img-zoom:hover img, .img-zoom:hover img{
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}
.zoom {
  -webkit-animation: zoomout 10s ease-in infinite;
  animation: zoomout 10s ease-in infinite;
  transition: all .5s ease-in-out;
  overflow: hidden;
}
/* Zoom in Keyframes */
@-webkit-keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.2);}
  100% {transform: scale(1);}
}
@keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.2);}
  100% {transform: scale(1);}
} /*End of Zoom in Keyframes */

/* Zoom out Keyframes */
@-webkit-keyframes zoomout {
  0% {transform: scale(1.2);}
  50% {transform: scale(1);}
  100% {transform: scale(1.2);}
}
@keyframes zoomout {
    0% {transform: scale(1.2);}
  50% {transform: scale(1);}
  100% {transform: scale(1.2);}
}/*End of Zoom out Keyframes */


.btn{
  border-radius:50px;
  padding:12px 35px;
  font-family:var(--primary-font);
  font-weight:500;
  font-size:18px;
}  
.btn-br{
  border:1px solid #00F0FF;
  color:#00F0FF;
  background-color:rgba(0, 0, 0, 0.1);
}
.btn-br:hover{
  background-color:var(--blue);
  color:var(--black);
}
.btn-br-black{
  border:1px solid var(--black);
  color:var(--black);
  background-color:var(--blue);
}
.btn-br-black:hover{
  background-color:var(--black);
  color:var(--blue);
}
.btn-blue{
  background-color:var(--blue);
  color:var(--black);
  min-width: 200px;
  border-color: var(--blue);
}
.btn-blue:hover{
  background-color:var(--black);
  color:var(--blue);
  border-color: var(--blue);
}
.btn-black{
  background-color:var(--black);
  color:var(--blue);
  min-width: 200px;
  border-color: var(--black);
}
.btn-black:hover{
  background-color:var(--blue);
  color:var(--black);
  border-color: var(--black);
}

.banner p{
  font-size:18px;
}
 
.f-icons {
  display: flex;
  margin-bottom: 10px;
}
.icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color:var(--blue);
  color: #333;
  margin-right: 15px;
  margin-top: 6px;
  text-align: center;
  font-size: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.icon span{
  color:var(--black);
}
.icon-mail-alt{
  font-size:16px;
}
.f-icon-text{
  -ms-flex: 1;
  flex: 1;
}
.f-icon-text p{
  margin-bottom:0;
}
.fix-nav header{
  background-color:rgba(0, 0, 0, 0.769);
  top: 0;
}
.logo img{
  width:130px;
  transition: width .2s;
}
.fix-nav .logo img{
  width:70px;
  transition: width .2s;
}

footer{
  padding-top: 50px;
  padding-bottom:40px;
}
footer h4{
  font-size:16px;
  color:var(--white);
}
footer p, footer p a{
  color:var(--white);
  font-size: 15px;
  font-weight: 300;
}
.follo-icon {
  display: flex;
  align-items: center;
  justify-content:center;
}
.follo-icon a {
  background-color:transparent;
  padding:0px;
  border-radius: 50%;
  display: block;
  width:33px;
  height:33px;
  text-align: center;
  margin: 3px 5px;
  font-size:18px;
  color:var(--red);
  border:1px solid #AEAEAE;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.follo-icon a:hover{
  background-color:var(--red);
  color:var(--white);
  border-color:var(--red);
}
.f-logo{
  text-align: center;
}
.f-logo img{
  margin-bottom:30px;
}

.form-control,  select{
  height:50px;
  padding: .375rem 1rem;
}
.error {
  font-size: 14px;
  color: red;
}

.slick-prev:before, .slick-next:before{
  font-size:30px;
  color:var(--white);
}
.slick-prev, .slick-next{
  width:40px;
  height:40px;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  -webkit-transition: all 0.35s ease-in-out;
  -moz-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus{
  -webkit-transform: scale(1.2);
  -moz-transform: scale(1.2);
  -ms-transform: scale(1.2);
  -o-transform: scale(1.2);
  transform: scale(1.2);
}

.follo-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}
.follo-icon a {
  background-color:var(--blue);
  padding: 0px;
  border-radius: 50%;
  display: block;
  width: 33px;
  height: 33px;
  text-align: center;
  margin: 3px 4px;
  font-size: 18px;
  color: var(--black);
  border: 1px solid var(--blue);
}
.follo-icon a:hover {
  background-color: transparent;
  color: var(--blue);
  border-color: var(--blue);
}
header{
  position: fixed;
  top:0;
  left: 0;
  right: 0;
  z-index:9;
  padding:8px 0;
}
.head-top{
  display: flex ;
  align-items: center;
  justify-content: space-between;
}
.header-right a svg{
  margin-right:12px;
}
.header-right a:hover svg{
 fill: var(--blue);
} 
.form-floating>label{
  padding: .75rem 1rem;
  color:var(--white);
}
.form-floating>textarea.form-control{
  height: auto;
}
.form-control:focus{
  box-shadow: 0 0 0 .25rem rgba(255, 255, 255, 0.3);
}
 

@keyframes icon-bounce {
  0% { transform: scale(1); }
  25% { transform: scale(1.3) rotate(-10deg); }
  50% { transform: scale(1) rotate(10deg); }
  75% { transform: scale(1.2) rotate(-5deg); }
  100% { transform: scale(1); }
}
.whatsapp_btn{
  position: fixed;
  bottom:2em;
  right:8px;
  width:50px;
  height:50px;
  z-index: 11;
}
.whatsapp_btn .icon_logo{
  position: relative;
  z-index: 100;
  padding: 5px;
}
.whatsapp_btn .icon_logo > a > img{
  width: 100%;
}
.whatsapp_btn .circle_waves{
  border-radius: 50%;
  background-color: #3cc04e;
  width:50px;
  height:50px;
  position: absolute;
  opacity: 0;
  bottom: 1px;
  left: 0px;
  z-index: 99;
  animation: waves 4s infinite cubic-bezier(.36, .11, .89, .32);
}
@keyframes waves {
  from {
      transform: scale(.55, .55);
      opacity: .6;
  }
  to {
      transform: scale(1.8, 1.8);
      opacity: 0;
  }
}

@keyframes hearts {
  0% {
     opacity: 0;
     transform:translate(0, 0%) rotate(0deg) scale(0.3);
  }
  20% { 
     opacity: 0.8;
     transform:translate(0, -20%) rotate(0deg) scale(0.3);
  }
  100% {
     opacity: 0.1;
     transform:translate(0, -2000%) rotate(0deg) scale(0.3); 
  }
}
.br-w-box{
  border:1px solid var(--blue);
  border-radius:10px;
  padding:20px;
  display: flex;
  align-items: center;
  gap:20px;
} 
.btns{
  display: flex;
  align-items: center;
  gap:15px;
}
.img-b-prob{
  border:1px solid #282828;
  
}
.img-box{
  border-radius:20px;
  overflow: hidden;
  position: relative;
}
.img-box .check-svg{
    position: absolute;
    left: 0;
    right: 0;
    top: 40%;
    z-index: 1;
    margin: 0 auto;
}
.list-dot {
    width: 100%;
    display: block;
    list-style-type: none;
    padding-left: 0;
}
.list-dot li {
    position: relative;
    padding-left: 18px;
    padding-bottom: 10px;
    font-size: 21px;
    font-weight: 300;
    color:var(--white);
}
.list-dot li::before {
    content: '';
    position: absolute;
    left: 0;
    background-color: var(--blue);
    width: 6px;
    height: 6px;
    border-radius: 50%;
    top: 16px;
}

.list-icon{
  list-style-type: none;
  padding:0;
}
.list-icon li {
    font-size:21px;
    color: var(--white);
    position: relative;
    padding-left: 34px;
    font-weight: 300;
    padding-bottom: 5px;
}
.list-icon li + li{
  margin-top:25px;
}
.list-icon li::before {
    content: '';
    position: absolute;
    left: 0;
    top:9px;
    background-image: url(../images/check.svg);
    background-repeat: no-repeat;
    width:21px;
    height:21px;
    background-size:21px;
}
.round-img{
  overflow: hidden;
  padding:20px;
  border-radius:50%;
  border:1px solid #5E5E5E;
  background: #3D3D3D;
background: radial-gradient(circle,rgba(61, 61, 61, 1) 0%, rgba(0, 0, 0, 1) 73%);
}
.round-img img{
  width: 100%;
}
.blue{
  color:var(--blue);
}
.timeline-sec ul{
  position: relative;
  list-style-type: none;
  padding:0 50px;
  margin: 0;
  display: flex;
  flex-direction: column;

}
.timeline-sec ul::before{
  content:'';
  height:100%;
  width:4px;
  background-color:var(--blue);
  position: absolute;
  left:0;
  right: 0;
  margin: 0 auto;
}
.timeline-sec ul li{
  position: relative;
  width:50%;
  align-self:self-end;
  display: flex;
  flex-direction: column;
  align-items: end;
}
.timeline-sec ul li::before{
  position: absolute;
  content:'';
  left:0;
  top:38%;
  width:60%;
  height:4px;
  background-color:var(--blue);
  z-index: -1;
}
.timeline-sec ul li::after{
  content:'';
  position: absolute;
    left: -15px;
    top:34%;
  width:28px;
  height:28px;
  background-color: var(--blue);
  border-radius:50px;
}
.timeline-sec ul li:nth-of-type(odd){
align-self:self-start;
align-items: start;
}
.timeline-sec ul li:nth-of-type(odd)::before{
 left:auto;
 right:0;
}
.timeline-sec ul li:nth-of-type(odd)::after{
   right: -15px;
   left: auto;
}
.tim-box{
  width:80%;
  text-align: center;
}
.tim-box h4{
  margin-top:20px;
}
.tim-box iframe{
 border-radius:20px;
 border:4px solid var(--blue);
 height:300px;
}
.tim-box img{
   border-radius:50%;
   border:4px solid var(--blue);
   width:250px;
}
.dot{
    width: 28px;
    height: 28px;
    background-color: var(--blue);
    border-radius: 50px;
    display: block;
    margin: 0 auto;
}
.tit-text{
  max-width:50%;
  margin:0 auto;
  text-align: center;
}
.team-sec img{
 border-radius:256px 256px 0 0 ;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
.team-sec img:hover{
 border-radius:20px ;
}
.blue-sec{
  background-color: var(--blue);
  border-radius:20px;
  padding:60px 220px;
  text-align: center;
  position: relative;
}
.blue-sec::after{
  background-image: url(../images/face2.png);
  background-repeat: no-repeat;
  background-size:200px;
  position: absolute;
  width:200px;
  height:200px;
  content:'';
  z-index:1;
  left:0;
  top:19%;
}
.blue-sec::before{
  background-image: url(../images/face2.png);
  background-repeat: no-repeat;
  background-size:200px;
  position: absolute;
  width:200px;
  height:200px;
  content:'';
  z-index:1;
  right:0;
  top:19%;
}
.blue-sec h2{
  color: #000;
}
.footer-bottom {
  display: flex;
  justify-content: space-between;
  padding-top:30px;
  margin-top:50px;
  border-top:1px solid #999999;
}
footer ul li a{
  color:var(--white);
  font-weight: 300;
  display: block;
  padding-bottom:8px;
}
footer ul li a:hover{
  color:var(--blue);
}
.follow{
  text-align: center;
}
.fadeupX{
  animation: fadeupX both;
  animation-timeline: scroll();
}
@keyframes fadeupX {
  from{
   opacity:0;
   transform:translateX(100px) scale(0.8) ;
  }
  to{
   opacity:1;
   transform:translateX(0) scale(1);
  }
}
.fadeup-X{
  animation: fadeup-X both;
  animation-timeline: scroll();
}
@keyframes fadeup-X {
  from{
   opacity:0;
   transform:translateX(-100px) scale(0.8) ;
  }
  to{
   opacity:1;
   transform:translateX(0) scale(1);
  }
}
.fadeup{
  animation: fadeup both;
  animation-timeline: scroll();
}
@keyframes fadeup {
  from{
   opacity:0;
   transform:translateY(10px) scale(0.5);
  }
  to{
   opacity:1;
   transform:translateY(0) scale(1);
  }
}
.popup .modal-content{
  background-color:var(--blue);
  border:0;
  border-radius:20px;
}
.popup h3{
  color:var(--black);
  font-size:24px;
}
.popup .form-control{
  border-color:var(--black);
  background-color:transparent;
  color:var(--black);
}
.popup label{
  color:var(--black);
}
.popup .modal-body{
  padding:50px;
  text-align: center;
}
.popup .btn-close{
 position: absolute;
 right:15px;
 top:15px;
}
 

@media only screen and (min-width:991px) {
  .page-section{
    overflow:hidden;
  }
  .left-content{
      -webkit-transform: translateX(-30px);
      -ms-transform: translateX(-30px);
      transform: translateX(-30px);
      -webkit-transition: all 2s ease;
      transition: all 2s ease;
  }
  .right-content{
      -webkit-transform: translateX(30px);
      -ms-transform: translateX(30px);
      transform: translateX(30px);
      -webkit-transition: all 2s ease;
      transition: all 2s ease;
  }
  .bottom-content{
      opacity: 0;
      -webkit-transform: translateY(30px);
      -ms-transform: translateY(30px);
      transform: translateY(30px);
      -webkit-transition: all 2s ease;
      transition: all 2s ease;
  }
  .top-content{
      opacity: 0;
      -webkit-transform: translateY(-30px);
      -ms-transform: translateY(-30px);
      transform: translateY(-30px);
      -webkit-transition: all 2s ease;
      transition: all 2s ease;
  }
  .zoom-content{
    opacity: 0;
    -moz-transform: scale(0);
      -webkit-transform: scale(0);
      transform: scale(0);
    -webkit-transition: all 2s ease;
      transition: all 2s ease;
  }
  .animate .zoom-content{
    opacity: 1;
    -moz-transform: scale(1);
      -webkit-transform: scale(1);
      transform: scale(1)
  }
  .animate .left-content, .animate .right-content {
    opacity: 1;
      -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
      transform: translateX(0);
  }
  .animate .bottom-content, .animate .top-content{
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0);
  }

  }
 
 

@media (min-width:1360px) {
  .container{
    max-width:1260px;
  }
 

}

@media (min-width:992px) and (max-width:1199px)  {
  

}
@media (min-width:768px) and (max-width:991px)  {
   .timeline-sec ul{
     padding:0;
   }
  .tim-box {
     width: 90%;
  }
  .tit-text {
    max-width: 90%;
  }
  .btn {
    padding: 12px 26px;
    font-size: 16px;
}
.blue-sec {
  padding: 60px 70px;
}
.blue-sec::before {
  background-size: 110px;
  width: 110px;
  height: 110px;
  top: 42%;
}
.blue-sec::after {
  background-size:110px;
  width:110px;
  height:110px;
  top: 42%;
}

}
@media (max-width:991px) {
.logo img {
  width: 80px;
}
h1 {
  font-size: 26px;
}   
h2 {
  font-size: 24px;
}   
h3, h4 {
  font-size:18px;
}
.banner p {
  font-size: 16px;
}
.list-dot li{
  font-size:16px;
}
.list-dot li::before{
  top: 11px;
}
.list-icon li {
  font-size: 16px;
  padding-bottom: 3px;
}
.list-icon li::before{
  top: 2px;
}

}
@media (max-width:767px) {

.tit-text {
  max-width: 100%;
} 
.timeline-sec ul li:nth-of-type(2n+1) {
  align-self: self-end;
  align-items: end;
} 
.timeline-sec ul li{
  width:100%;
  padding-bottom: 30px;
}
.timeline-sec ul::before{
  left: 15px;
  right: auto;
}
.timeline-sec ul {
  padding: 0 18px;
}
.tim-box {
  width: 90%;
}
.timeline-sec ul li:nth-of-type(2n+1)::after {
  right: auto;
  left: -15px;
}
.dot{
  margin-left: 2px;
}
.tim-box h4 {
  margin-top:10px;
} 
.team-sec h3{
  margin-bottom: 5px;
}
.blue-sec{
  padding:30px;
}
.blue-sec::before, .blue-sec::after{
  content:none;
}
.padding {
  padding: 30px 0;
}
.f-logo{
  text-align: center;
}
footer ul{
  padding-left:0;
}
.follow{
  text-align: start;
}
.follo-icon{
  justify-content: start;
  margin: 13px auto 0 auto;
}
.footer-bottom{
  flex-direction: column;
}  
  
}
@media (max-width:575px){
.btns {
  flex-direction: column;
}   
.btns .btn{
  width:100%;
}
.timeline-sec ul li:nth-of-type(2n+1)::before {
  left: 0;
  right: auto;
}
.head-top .btn {
  padding: 8px 24px;
  font-weight: 500;
  font-size: 16px;
}
.round-img{
  display: none;
}
.list-icon {
  margin-bottom: 0;
}
.popup .modal-body {
  padding: 20px;
}

}