/* -----------------------------------
Template : maharat - Corporate HTML5 Template

NOTE: This is Slider style file. All Slider related style included in this file.

--------------------------------------*/

/*---------- Slider caption -------------*/
.slider-section {
-webkit-background-size: cover;
    background-size: cover;
}
.slide-caption-wrap .title-h1 {
  margin-bottom: 8px;
}
.slide-desc {
  color: #fff;
  font-size: 18px;
  font-weight: 400;
  line-height: 30px;
  margin: auto;
  max-width: 700px;
  margin: auto auto 30px;
}
.slide-caption-wrap .slide-desc{
  margin: auto auto 10px;
}
.nivo-caption p{
  padding: 0;
}
.slider-area > img {
  height: 100vh;
  width: 100%;
}
.slide-caption-wrap .button-primary{
  margin-bottom: 0;
}
.slide-caption-wrap.text-left .slide-desc{
  margin-left: inherit;
  margin-right: inherit;
}
.slide-caption-wrap.text-right .slide-desc{
  margin-right: inherit;
  text-align: right;
}
.slider-wrapper{
  position: relative;
}

/*---------- Single side banner -------------*/
.single-slide-banner img{
  max-width: 100%;
}
.single-slide-banner {
  background: url("../../slider/img/slider1.jpg") no-repeat scroll center center / cover ;
}
.header-text-item .cd-words-wrapper, .header-text-item .cd-words-wrapper b,.header-text-item .cd-words-wrapper i{
  color: #2AAAE2;
}

/*----------------------------------------*/
/*  # Video slider 
/*----------------------------------------*/
.swiper-container{
  width: 100%;
  height: 100vh;
}
.slider-video{
  width: 100% !important;
  visibility: visible;
}
.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #fff;
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
/* Next prev css */
.swiper-navarrow{
  background: rgba(0, 0, 0, 0.2);
  color: #fff;
  font-size: 22px;
  font-weight: normal;
  padding: 38px 5px;
  text-align: center;
  transition: .6s;
  margin-top: 0;
  transform: translateY(-50%);
  height: auto;
  width: auto;
}
.swiper-navarrow.swiper-button-next{
  right: 0;
}
.swiper-navarrow.swiper-button-prev{
  left: 0;  
}
.swiper-navarrow:hover{
    background: #2AAAE2;
    color: #fff;
}
.swiper-container-horizontal > .swiper-pagination {
  bottom: 20px;
}
/* Slider nav */
.swiper-pagination-bullet{
  display: inline-block;
  height:5px;
  margin: 0 5px;
  text-indent: -9999px;
  width:23px;
  color: #fff;
  line-height: 8px;
  background: #fff;
  cursor: pointer;
  position: relative;
  z-index: 9999;
  border-radius: 0;
  opacity: 1;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active{
    background: #2AAAE2;
    cursor: pointer;
}

/* Text Overlay */
.lab_video_text_overlay {
  position: absolute;
  color: #FFF;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.swiper-slide-caption {
  width: 100%;
  height: 100%;
}
.swiper-caption-wrap {
  left: 0;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-80%);
  z-index: 999;
}
.slide-desc{
    max-width: 850px;
}