/*********************************************            HOME top                                ********************************************************** */
.custom-slider
{
  position: relative;
  min-height: 100vh;
}

.custom-slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-background-size: cover !important;
  background-size: cover !important;
  background-attachment: fixed !important;
  -webkit-transition: .5s  all;
  -o-transition: .5s  all;
  transition: .5s  all;
  opacity: 0;
}

.custom-caption
{
  position: absolute;
  top: 50%;
  left:0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  color:#fff;
  -webkit-transition: .5s  all;
  -o-transition: .5s  all;
  transition: .5s  all;
  overflow: hidden;
  text-align: center;
}

.custom-caption h1
{
  -webkit-transform: translateY(100vh);
  -ms-transform: translateY(100vh);
  transform: translateY(100vh);
  -webkit-transition: 1s all;
  -o-transition: 1s all;
  transition: 1s all;
  text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}
.custom-caption h3
{
  -webkit-transform: translateY(100vh);
  -ms-transform: translateY(100vh);
  transform: translateY(100vh);
  -webkit-transition: .5s all;
  -o-transition: .5s all;
  transition: .5s all;
  text-shadow: 0px 4px 3px rgba(0,0,0,0.4),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);
}

.active-slide .custom-caption h1,.active-slide .custom-caption h3,.active-slide .custom-caption .button
{
  -webkit-transform: translateY(0) !important;
  -ms-transform: translateY(0) !important;
  transform: translateY(0) !important;
  opacity:1
}


.active-slide
{
  opacity:1;
  z-index: 10;
}

.button
{
  display: inline-block;
  padding: 9px 16px;
  border-radius: 15px;
  background: #008080;
  color:white;
  border:2px solid #008080;
  -webkit-transition: transform 1.5s,background .5s,color .5s,opacity 1s;
  -o-transition: transform 1.5s,background .5s,color .5s,opacity 1s;
  transition: transform 1.5s,background .5s,color .5s,opacity 1s;
}
.button:hover
{
  border-radius: 15px;
  background: transparent;
  color:#fff !important;
  cursor:pointer;
}

.button-b2
{
  display: inline-block;
  padding: 9px 16px;
  border-radius: 15px;
  background: #008080;
  color:white;
  border:2px solid #008080;
  -webkit-transition: transform 1.5s,background .5s,color .5s,opacity 1s;
  -o-transition: transform 1.5s,background .5s,color .5s,opacity 1s;
  transition: transform 1.5s,background .5s,color .5s,opacity 1s;
}
.button-b2:hover
{
  border-radius: 15px;
  background: transparent;
  color:#000 !important;
  cursor:pointer;
  text-decoration: none;
}
.custom-slide .button
{
    opacity: 0;
    -webkit-transform: translateY(100vh);
    -ms-transform: translateY(100vh);
    transform: translateY(100vh);
}
/*********************************************           HOME SLIDER END                                 ********************************************************** */
.logo{
  width: 33vw;
  padding-left: 20%;
}

.navbar{
  background: rgba(0,0,0,.5);
}

.nav-link
{
  font-size: 18px;
}

.trf-up
{
  -webkit-transform: translateY(-90px);
  -ms-transform: translateY(-90px);
  transform: translateY(-90px);
  z-index: 999 !important;
  position: relative;
}

.custom-overlay
{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.5);
  z-index: 2
}
.text-purple
{
  color:#008080;
}
.bg-purple
{
  background: #008080;
}

.bg-transpare
{
  background: purple;
}
.item .container .border-bottom
{
  border-radius:  0px 0px 10px 10px;
  overflow: hidden;

}
.carousel-image
{
  height: 330px;
  background-position: center !important;
  background-repeat: no-repeat !important;
  -webkit-background-size: cover !important;
  background-size: cover !important;
  border-radius: 10px 10px 0px 0px;
  position: relative;
  overflow: hidden;
}
.caroussel-text,.paralax-text,.slide-overlay,.back-content
{
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  width: 100%;
  height: 100%;
}
.caroussel-text p,.paralax-text .parallax-content,.back-content .container,.rc-lateral-text
{
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}
.see-more:after
{
content: '»';
display: inline-block;
animation:more 2s infinite;
}

.parallaxhs{
  min-height: 500px;
  height: 50vh;
  position:relative;
  overflow: hidden; 
}

.parallaxh{
  height: 1000px;
  position:relative;
  overflow: hidden; 
}
.parallax-container {
  position: absolute;
  width: 100%;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}



/*********************************************           3D CARD BEGIN                                 ********************************************************** */

.txtunder{
  padding-top: 20em;
}

.imgteam{
max-height: 200px;
min-height: 200px;
max-width: 200px;
min-width: 200px;
}

.perspective
{
  -webkit-perspective: 1500px;
  -moz-perspective: 1500px;
  -ms-perspective: 1500px;
  overflow: hidden;
  min-height: 360px;
  border-radius: 10px 10px 0px 0px ;

}
.rc-container
{
  position: relative;
  width: 100%;
  -webkit-transition: .5s all;
  -o-transition: .5s all;
  transition: .5s all;
  -webkit-transition-timing-function: ease-in-out ;
  -o-transition-timing-function: ease-in-out ;
  transition-timing-function: ease-in-out ;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.perspective:hover .rc-container
{
-webkit-transform: rotateY(90deg) translateX(50%);
-ms-transform: rotateY(90deg) translateX(50%);
transform: rotateY(90deg) translateX(50%);
}
.perspective:hover .rc-container .rc-back
{
  -webkit-transform: rotateY(-90deg) translateX(0) translateZ(300px) ;
  -ms-transform: rotateY(-90deg) translateX(0) translateZ(300px) ;
  transform: rotateY(-90deg) translateX(0) translateZ(300px) ;
  opacity:1;
}
.perspective:hover .rc-container .rc
{
opacity:0;
}
.rc{
  position: absolute;
  top: 0;
  left: 0;
  min-height: 300px;
  width: 100%;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: .2s all;
  -o-transition: .2s all;
  transition: .2s all;
  -webkit-background-size: cover !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  border-radius: 10px 10px 0px 0px ;
}
.rc-back{
  position: absolute;
  top: 0;
  left: 0;
  min-height: 300px;
  width: 100%;
  -webkit-transform: rotateY(-90deg) translateX(100%) ;
  -ms-transform: rotateY(-90deg) translateX(100%) ;
  transform: rotateY(-90deg) translateX(100%) ;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: .5s all;
  -o-transition: .5s all;
  transition: .5s all;
  opacity:0;
  -webkit-background-size: cover !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center !important;

}


/*********************************************           3D CARD END                                 ********************************************************** */



@keyframes more {
  0%{
    -webkit-transform: translateX(0) ;
  -ms-transform: translateX(0) ;
  transform: translateX(0) ;
  opacity: 0;
    }
    25%{
      -webkit-transform: translateX(25%) ;
    -ms-transform: translateX(25%) ;
    transform: translateX(25%) ;
    opacity: .25;
      }
      50%{
        -webkit-transform: translateX(50%) ;
      -ms-transform: translateX(50%) ;
      transform: translateX(50%) ;
      opacity: .50;
      }
        75%{
          -webkit-transform: translateX(100%) ;
        -ms-transform: translateX(100%) ;
        transform: translateX(100%) ;
        opacity: 1;
        }
          100%{
            -webkit-transform: translateX(0) ;
          -ms-transform: translateX(0) ;
          transform: translateX(0) ;
          opacity: 0;
              }
}
/*********************************** CAROUSSEL BOOTSTRAP *******************************************************************************************************/
.caroussel-container
{
  position: absolute;
  top: 50px;
  right: 50px;
  padding: 15px;
  border-radius: 15px;
  background: rgba(0,0,0,.5);
  color:white;
  width: 400px;
}
@media  (max-width: 401px) {
 body{
 max-width: 100%;
 overflow-x: hidden;
  }
} 
@media  (max-width: 601px) {

 body{
 max-width: 100%;
 overflow-x: hidden;
  }

.imgteam{
margin-right: 20%;
margin-left: 20%;
max-height: 300px;
min-height: 300px;
max-width:300px; 
min-width:300px;
}
  .caroussel-container
  {
    top: 0 !important;
    right: 0 !important;
  }
  .logo{
  width: 52%;
  height: 52%;
  padding-left: 1px;
}
}

h3 {
  margin: 10px 0;
}

h6 {
  margin: 5px 0;
  text-transform: uppercase;
}

p {
  font-size: 14px;
  line-height: 21px;
}

.card-container {
  background: rgba(0,0,0,.5);
  border-radius: 25px;
  box-shadow: 10px 10px 15px rgba(0,0,0,0.35);
  color: #B3B8CD;
  padding: 30px 0 0;
  position: relative;
  width: 350px;
  max-width: 100%;
  height: 360px;
  text-align: center;
  margin: 20px 0;
  overflow: hidden;
}

.card-container img {
  border: 1px solid #000;
  border-radius: 50%;
  padding: 7px;
  height: 150px;
  width: 150px;
}

.card-containermobile {
  background: #008080;
  border-radius: 25px;
  box-shadow: 10px 10px 15px rgba(0,0,0,0.35);
  color: #fff;
  padding: 30px 0 0;
  position: relative;
  max-width: 100%;
  min-width: 250px;
  min-height: 360px;
  text-align: center;
  margin: 20px 0 20px 1px;
  overflow: hidden;
}

.card-containermobile img {
  border: 1px solid #000;
  border-radius: 50%;
  padding: 7px;
  height: 150px;
  width: 150px;
}

.card-containermobilereasons {
  background: #008080;
  border-radius: 25px;
  box-shadow: 10px 10px 15px rgba(0,0,0,0.35);
  color: #fff;
  padding: 30px 0 0;
  position: relative;
  max-width: 100%;
  min-width: 250px;
  min-height: 380px;
  text-align: center;
  margin: 20px 0 20px 1px;
  overflow: hidden;
}

.card-containermobilereasons img {
  border: 1px solid #000;
  border-radius: 50%;
  padding: 7px;
  height: 150px;
  width: 150px;
}

html {
  scroll-behavior: smooth;
}

.teamcontainer{
    max-width: 100%;
 overflow-x: hidden; 
}

.teamcontainer-mobile {
  padding: 10px 0 ;
  position: relative;
  max-width: 100%;
  min-width: 280px;
  min-height: 360px;
  text-align: center;
  margin: 20px 0 1px 1px;
  overflow: hidden;
}

.ourteamtxt{
padding-left: 20%;
}