
 
.captiion-holder{
  /*align-self: end;
 width:300px;*/
 width: 50%;
 padding-left:30px;
 margin-top:150px;
 border-left:4px solid var(--tertiary-color);
 text-transform:uppercase;

}
.captiion-holder h2 {
 font-size: 44px;
 line-height: 52px;
 font-weight:var(--font-bold);
 color: #fff;
 /* margin-left:80px; */


}
.captiion-holder h3 {
 font-size: 68px;
 line-height:70px;
 font-weight:var(--font-heaavy);
 /*background: linear-gradient(180deg, #FFFD00,   #96DD01, #00B800 );
 background-clip: text;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;*/
/** Text Gradient Example */ 


background-image: linear-gradient(0deg, #85D801 50%, #85D801 50%, #FFFD00 50%, #FFFD00 50%); 
background-clip: text; 
-webkit-background-clip: text; 
-webkit-text-fill-color: transparent; 
}





/*--------------------------------------------------------------
 #hero-style
--------------------------------------------------------------*/

.slider-outer{
 padding:0;
}
.hero-style {
  height: 100vh; 
  position:relative;
  transition:all .9s ease;
  overflow:hidden;
 
}

.hero-slider {
 width: 100%;
 height: 752px; 
  display: -webkit-box;
 display: -ms-flexbox;
 display: flex;
 position: relative;
 z-index: 0;
}
 
.hero-slider .swiper-slide {
 overflow: hidden;
 color: #fff; 
}

.hero-slider .swiper-container {
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0;
 top: 0;
}
.punchline{
    background: #065772de;
   padding: 15px 10px;
   border-radius: 10px;
}
.punchline a{
   font-size: 18px;
   font-weight: 700;
   color: var(--body-color);
  background-color: var(--primary-color);
    padding: 7px 12px;
    border-radius: 7px;
    margin-right: 7px;
}
.punchline a:hover {
   color: #a7e9ff;
}
.punchline a:last-child {
    margin-right: 0;
}


.hero-slider .slide-inner {
 width: 100%;
 height: 100%;
 position: absolute;
 left: 0;
 top: 0;
 z-index: 1;
 background-size: cover;
 background-position: center;
 display: flex;
 justify-content: flex-end;
 align-items: flex-end;
 padding: 0 20px 20px;
} 
.nav-bt{
 position:absolute;
 left:13%;
 bottom:100px;
}
.hero-slider .swiper-button-prev,
.hero-slider .swiper-button-next {
 background: transparent;
 width: 70px;
 height: 70px;  
 line-height: 70px;
 margin-top: -30px;
 text-align: center;
 border: 1px solid #FFF;
 border-radius: 50px;
 opacity:0;
 visibility:hidden;
 transition:all .3s ease;
 /*display:none;*/
}
.hero-slider:hover .swiper-button-prev,
.hero-slider:hover .swiper-button-next {
 transform:translateX(0);
 opacity:1;
 visibility:visible;

}



.hero-slider .swiper-button-prev {
 left: 25px;
 transform:translateX(50px);
}

.hero-slider .swiper-button-prev:before {
 font-family: "Font Awesome 5 Free";
 content: "\f060";
 font-size: 20px;
 color: #fff;
 font-style: normal;
 display: inline-block;
 vertical-align: middle;
 font-weight: 900;
}

.hero-slider .swiper-button-next {
 left: 110px;
 transform:translateX(-50px); 
}

.hero-slider .swiper-button-next:before {
 font-family: "Font Awesome 5 Free";
 content: "\f061";
 font-size: 20px;
 color: #FFF;
 font-style: normal;
 display: inline-block;
 vertical-align: middle;
 font-weight: 900;
}

.hero-slider .swiper-pagination-bullet {
 width: 14px;
 height: 14px;
 text-align: left;
 line-height: 12px;
 font-size: 12px;
 color: #000;
 opacity: 0.3;
 background:#fff;
 transition:all .2s ease;
 display:none;

}

.hero-slider .swiper-pagination-bullet-active {
 opacity:1;
}

.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets,
.hero-slider .swiper-pagination-custom,
.hero-slider .swiper-pagination-fraction {
 bottom: 30px;
}


.swiper-pagination {
 text-align:left;
}

.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{
   bottom:25px;
   max-width: 1200px;
   padding: 20px 20px;
   margin: 0 auto;
   left: 50%;
   transform: translateX(-50%);
}
.punchline-wrap{ position: absolute;
   bottom: 15px;
   right: 15px;
   z-index: 1;}

@media only screen and (max-width: 1280px) {
.hero-slider{ height: 690px;}
}

@media only screen and (max-width: 1199.99px) {
.hero-slider:before,.hero-slider:after{
 display:none;

}
}

@media only screen and (max-width: 1180px) {
.hero-slider{ height: 630px;}
}

/*******************************/



@media (max-width: 1024px) {
.hero-slider {
        height: 525px;
    }
}

@media (max-width: 980px) {
 .hero-slider, .hero-style {
   height: 500px;
 }


 

}

/***********767*************/

@media (max-width: 767px) {


 .hero-slider,  .hero-style {
   height: 250px;
  
 }

 .hero-slider .swiper-button-prev,
 .hero-slider .swiper-button-next {
   display: none;
 }

.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets,
.hero-slider .swiper-pagination-custom,
.hero-slider .swiper-pagination-fraction {
   bottom: 0;
  
}


.hero-slider .swiper-pagination-bullet {
   display:inline-block;

}

.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{
   padding:5px 20px;

}

.captiion-holder{
 width: 50%;
 padding-left:0;
 border-left:0;
 margin-top:0px;


}
.captiion-holder h2 {
 font-size: 18px;
 line-height: 20px;


}
.captiion-holder h3 {
  font-size: 30px;
  line-height: 32px;
}
.punchline a{ font-size: 12px; padding: 5px 6px; margin-bottom: 5px;display: inline-block;}
.punchline {
    background: #065772de;
    padding: 15px 5px 10px 5px;
    border-radius: 0px;
}
.hero-slider, .hero-style{ height: 385px;}
 
}


@media (max-width: 575px) {
   .hero-slider, .hero-style {
      height: 295px;
  }
  .hero-slider .swiper-pagination-bullet{width: 10px; height: 10px;}
  .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{ margin: 0px 6px !important;}
/* .punchline a{ font-size: 14px;} */
.punchline-wrap {
   position: relative;
  
   width: 100%;
   text-align: center;
   right: 0px;
   bottom: 0;
}
/* .punchline {
 
   border-radius: 0 0 10px 10px;} */
}

@media (max-width: 480px) {
   .hero-slider, .hero-style {
      height: 245px;
  }

}

@media (max-width: 360px) {
   .hero-slider, .hero-style { height: 185px;}
}
@media (max-width: 320px) {
   .hero-slider, .hero-style { height: 170px;}
}




