.slide-wrapper .carousel-inner, .slide-wrapper .carousel, .slide-wrapper .item, .slide-wrapper .container, .fill  { 
  height: 100%; 
  width: 100%; 
  background-position: center center; 
  background-size: cover;
    
}
.slide-wrapper {
    display: inline;
}

.slide-wrapper .container {
    padding: 0px;
}


/*------------------------------ vertical bootstrap slider----------------------------*/

.carousel-inner> .item.next ,   .carousel-inner > .item.active.right {
    transform:  translateY(100%);
    -webkit-transform:  translateY(100%);
    -ms-transform:  translateY(100%); 
    -moz-transform:  translateY(100%);
    -o-transform:  translateY(100%);
    top:  0;
    left: 0;
}

.carousel-inner > .item.prev , .carousel-inner > .item.active.left {
    transform:  translateY(-100%);
    -webkit-transform:  translateY(-100%);
    -moz-transform:  translateY(-100%); 
    -ms-transform:  translateY(-100%);
    -o-transform:  translateY(-100%);
    top:  0;
    left: 0;
}

.carousel-inner > .item.next.left ,  .carousel-inner > .item.prev.right ,  .carousel-inner > .item.active {
    transform: translateY(0);
    -webkit-transform: translateY(0); 
    -ms-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    top: 0;
    left: 0;
}


/*------------------------------- vertical carousel indicators ------------------------------*/
.carousel-indicators { 
    position: absolute; 
    top: 0; 
    bottom: 0; 
    margin: auto; 
    height: 20px; 
    right: 100px;
    left: auto; 
    width: auto;
    
}
.carousel-indicators li {
    display: block;
    margin-bottom: 5px;
    border:2px solid rgba(255, 255, 255, 0.831);
    height: 12px;
    width: 12px;
    border-radius: 50%;
 }

.carousel-indicators li.active {
    margin-bottom: 5px;
    background: #d6ad34;
    border-color: #d6ad34;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    margin-left: 1px;
}

/*-------- Animation slider ------*/

.animated { 
	animation-duration: 3s;
	-webkit-animation-duration: 3s;
	-moz-animation-duration: 3s;
	-ms-animation-duration: 3s;
	-o-animation-duration: 3s;
	visibility: visible;
	opacity: 1;
	transition: all 0.3s ease;
    
}
.carousel-img {
    display:  inline-block;
    margin:  0 auto;
    width:  100%;
    text-align:  center;
    position: absolute;
    top: 45%;
    transform: translateY(-50%);
    z-index: -1;
}
.item img {
    margin: auto;
/*
    visibility: hidden;
     opacity: 0;
*/
     transition: all 0.3s ease;
     -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
     -ms-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
    max-width: 100%;
}

.item1 .carousel-img img ,  .item1.active .carousel-img img {
/*    max-height: 300px;*/
}

.item1.active .carousel-img img.animated {
    visibility: visible;
     opacity: 1;
     transition: all 1s ease;
     -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
     -ms-transition: all 1s ease;
     -o-transition: all 1s ease;
    
animation-duration: 2s;
    -webkit-animation-duration: 2s;
    -moz-animation-duration: 2s;
    -ms-animation-duration: 2s;
    -o-animation-duration: 2s;
    animation-delay: 0.3s ;
    -webkit-animation-delay: 0.3s; 
    -moz-animation-delay: 0.3s;
    -ms-animation-delay: 0.3s;
 }

.item .carousel-desc {
    color: #fff;
     text-align: center;
}
 

.item2 .carousel-img img ,  .item2.active .carousel-img img {
/*    max-height: 300px;*/
}

.item2.active .carousel-img img.animated {
    visibility: visible;
     opacity: 1;
     transition: all 0.3s ease;
     animation-duration: 3s;
     animation-delay: 0.3s;
}
.item2 h2 ,  item2.active h2 {
    visibility: hidden;
     opacity: 0;
     transition: all 5s ease;
}

.item2.active h2.animated {
    visibility: visible;
     opacity: 1;
      animation-delay: 3s;
}


.item .fill {
    padding: 0px 30px;
     display: table;
 }

.item .inner-content {
    display:  table-cell;
    vertical-align:  middle;
}

.item3 .col-md-6 {
    float: none;
     display: inline-block;
     vertical-align: middle;
     width: 49%;
}


.item3.active .carousel-img img.animated {
    visibility: visible;
     opacity: 1;
     transition: all 0.3s ease;
     animation-duration: 2s;
     animation-delay: 0.3s;
}
.item3 h2 ,  item3.active h2 {
    visibility: hidden;
     opacity: 0;
     transition: all 5s ease;
 }

.item.item3 .carousel-desc {
    text-align: left;
}

.item3.active h2.animated {
    visibility: visible;
     opacity: 1;
      animation-delay: 1.5s;
}
.item3 p ,  item3.active p {
    visibility: hidden;
     opacity: 0;
     transition: all 5s ease;
     width: 100%;
  }

.item3.active p.animated {
    visibility: visible;
     opacity: 1;
      animation-delay: 2.5s;
}

 
@media(max-width:768px){
    
    .item .carousel-img img,  .item.active .carousel-img img {
        max-height: 155px;
    }

    .item  h2 {
        font-size: 30px;
         margin-top: 0px;
    }

    .item .carousel-desc p {
        width: 100%;
         font-size: 12px;
    }

}
@media(max-width:480px){ 
    .item  h2 {
        font-size: 30px;
    }

    .item .carousel-desc p {
        width: 100%;
    } 
    .item3 .col-md-6{
        width: 100%;
    }
}