@import url("animate.min.css");
.blackbg{ background:#000; overflow: hidden;}
.rnOuter {
  background: hsl(0, 80%, 38%);
  overflow: hidden;
  position: relative;
  height: 100vh;
}
.rnInner {
  width: 100%;
  position: absolute;
  top: -10%;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  transform-style: preserve-3d;
  transition: transform 6s ease;
  transform-origin: -120% top;
}
.rnUnit {
  width: 10vw;
  height: 120vh;
  background: repeating-linear-gradient(to left, hsl(0, 80%, 50%) 4vw, hsl(0, 80%, 30%) 8vw, hsl(0, 80%, 70%) 10vw);
  background-size: 100% 100%;
  display: inline-block;
  transform-origin: 0 0%;
  transform: rotate(3deg);
  -webkit-animation: rnUnit 2s ease infinite;
          animation: rnUnit 2s ease infinite;
}
@-webkit-keyframes rnUnit {
  50% {
    transform: rotate(-3deg);
  }
}
@keyframes rnUnit {
  50% {
    transform: rotate(-3deg);
  }
}
.rnUnit:nth-child(1) {
  -webkit-animation-delay: -0.1s;
          animation-delay: -0.1s;
}
.rnUnit:nth-child(2) {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
.rnUnit:nth-child(3) {
  -webkit-animation-delay: -0.3s;
          animation-delay: -0.3s;
}
.rnUnit:nth-child(4) {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}
.rnUnit:nth-child(5) {
  -webkit-animation-delay: -0.5s;
          animation-delay: -0.5s;
}
.rnUnit:nth-child(6) {
  -webkit-animation-delay: -0.6s;
          animation-delay: -0.6s;
}
.rnUnit:nth-child(7) {
  -webkit-animation-delay: -0.7s;
          animation-delay: -0.7s;
}
.rnUnit:nth-child(8) {
  -webkit-animation-delay: -0.8s;
          animation-delay: -0.8s;
}
.rnUnit:nth-child(9) {
  -webkit-animation-delay: -0.9s;
          animation-delay: -0.9s;
}
.rnUnit:nth-child(10) {
  -webkit-animation-delay: -1s;
          animation-delay: -1s;
}
.aoTable {
  display: table;
  width: 100%;
  height: 100vh;
  text-align: center;
}
.aoTableCell {
  color: hsl(0, 80%, 38%);
  display: table-cell;
  vertical-align: middle;
  transition: color 3s ease;
}
.rnOuter:hover .rnInner {
  transform-origin: -120% top;
  transform: scaleX(0);
}
.rnOuter:hover .aoTableCell {
  color: white;
}


.home-video {
    position: relative;
}

.video-section {
    width: 100%;
}
.hero-banner-text h1 {
    font-size: 4.30625vw;
    font-weight: 700;
   
}
.hero-banner-text p{
    font-size:18px;
    font-weight: 400;
    color: #e69112; margin-top: 20px;
   
}
.video-section .overlaybg {
    background-size: 100%;
    background: #000;
    opacity: 0.3;
    position: absolute;
    height: 100%;
    width: 100%;
}
.video-section video {
    width: 100%;
     min-height:100%;
     object-fit: cover;
     height: 100vh;

}

.hero-banner-text {
    position: absolute;
    bottom: 14vh;
    z-index: 1;
   
    color: white;
    font-weight: 700;
}
.hero-banner-text h6 {
    font-size: 1.9vw;
    color: #c795fe;
}

    .btn-landing {
         margin-top: 30px;
         display: flex;
         column-gap: 10px
      }

      .btn-landing .common-btn-div {
         background: #e69112;
         padding: 10px 50px;
         border-radius: 50px;
         color: #fff;
         font-size: 18px;
         text-transform: uppercase;
         font-weight: 600;
         border: solid 2px #e69112;
      }

      .btn-landing .common-btn-div:hover {
         background: transparent;
         color: #fff;
         border: solid 2px #e69112;
      }

      .btn-landing .common-btn-div1 {
         background: transparent;
         padding: 10px 50px;
         border-radius: 50px;
         color: #fff;
         font-size: 18px;
         text-transform: uppercase;
         font-weight: 600;
         border: solid 2px #e69112;
      }

      .btn-landing .common-btn-div1:hover {
         color: #fff;
         border: solid 2px #e69112;
         background: #e69112;
      }

    
    .animate-img{ position:absolute; z-index:9 ; right: 0}


.wrap {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.button {
  min-width: 200px;
  min-height: 60px;
  display: inline-flex;
  font-size: 18px;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 1.3px;
  font-weight: 500;
  color: #fff;
  background: #e69112;

   border: 2px solid #e69112;
  border-radius: 1000px;
  box-shadow: 12px 12px 24px rgba(218,173,132,.64);
  transition: all 0.3s ease-in-out 0s;
  cursor: pointer;
  outline: none;
  position: relative;
  padding: 10px; text-decoration: none;
  }

.button::before {
content: '';
  border-radius: 1000px;
  min-width: calc(200px + 12px);
  min-height: calc(60px + 12px);
  border: 2px solid #e69112;
  box-shadow: 0 0 60px rgba(181,137,96,.64);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: all .3s ease-in-out 0s;
}

.button:hover, 
.button:focus {
  color: #fff;
  background: transparent;
  transform: translateY(-6px);
}

.button:hover::before, 
.button:focus::before {
  opacity: 1;
}

.button::after {
  content: '';
  width: 30px; height: 30px;
  border-radius: 100%;
  border: 6px solid #e69112;
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: ring 1.5s infinite;
}

.button:hover::after, 
.button:focus::after {
  animation: none;
  display: none;
}

@keyframes ring {
  0% {
    width: 30px;
    height: 30px;
    opacity: 1;
  }
  100% {
    width: 200px;
    height: 200px;
    opacity: 0;
  }
}


.button1 {
  min-width: 200px;
  min-height: 60px;
  display: inline-flex;
  font-size: 18px;
  align-items: center;
  justify-content: center;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 1.3px;
  font-weight: 500;
  color: #fff;
  background:transparent;

   border: 2px solid #e69112;
  border-radius: 1000px;
  box-shadow: 12px 12px 24px rgba(218,173,132,.64);
  transition: all 0.3s ease-in-out 0s;
  cursor: pointer;
  outline: none;
  position: relative;
  padding: 10px;
  text-decoration: none;
  }

.button1::before {
content: '';
  border-radius: 1000px;
  min-width: calc(200px + 12px);
  min-height: calc(60px + 12px);
  border: 2px solid #e69112;
  box-shadow: 0 0 60px rgba(181,137,96,.64);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: all .3s ease-in-out 0s;
}

.button1:hover, 
.button1:focus {
  color: #fff;
  background: transparent;
  transform: translateY(-6px);
}

.button1:hover::before, 
.button1:focus::before {
  opacity: 1;
}

.button1::after {
  content: '';
  width: 30px; height: 30px;
  border-radius: 100%;
  border: 6px solid #e69112;
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: ring 1.5s infinite;
}

.button1:hover::after, 
.button1:focus::after {
  animation: none;
  display: none;
}

@keyframes ring {
  0% {
    width: 30px;
    height: 30px;
    opacity: 1;
  }
  100% {
    width: 200px;
    height: 200px;
    opacity: 0;
  }
}
.text-video{ position:relative; }
.animate-img img{ height:100vh }
.white-text{ color:#fff!important }
.position-div{ position:relative; }

.btn-landing{justify-content: center;}
.heading-top{ color:#fff;  font-size: 40px;}
.hero-banner-text1 { position:absolute; top:0; width:100%; margin-top:3%; z-index: 99;} 
.blackbg .logo  { display: flex; column-gap: 15px; justify-content: center;}