.preview__loop {
    bottom: 0;
    height: 100%;
    left: 0;
    margin: 0;
    order: 3;
    right: 0;
    top: 0;
    width: 100%;
    z-index: -9999;
    padding: 0;
}

.preview__loop video {
    height: 100%;
    left: 0;
    object-fit: cover;
    top: 0;
    width: 100%;
    position: absolute;
    display: block;
    max-width: 100%;
}

/*** carousel **/
#myCarousel {
    height: 100%;
    position: absolute;
    width: 100%;
}
.carousel-inner {
    float: left;
    height: 100%;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right {
    display: none;
}
.carousel-control:hover > span {
    display: block;
}
.carousel-inner .item {
    background-size: cover;
}
.carousel-inner .item > img {
    height: 100%;
    max-width: none;
    width: auto;
}
.carousel-inner .item {
    background-position: center center;
    float: left;
    height: 100%;
    width: 100%;
}

#myCarousel img {
    max-width: none;
    width: auto;
}

#myCarousel .carousel-control {
    top: -9px;
    width: 86px;
}

.carousel-control {
    z-index: 11111;
    left: 0;
}

.carousel-control.right {
    right: 0;
}

.carousel-control.left, .carousel-control.right {
    background: none;
}

.carousel-control .glyphicon {
    display: inline-block;
    font-style: normal;
    margin-top: -40px;
    padding: 15px 20px;
    position: absolute;
    top: 50%;
    z-index: 5;
    left: 0;
}

.carousel-control .glyphicon.right {
    left: auto;
    right: 0;
}

.carousel-btn-down-content {
    -moz-animation: reveal-banner 2.5s 3.5s ease-in-out;
    -webkit-animation: reveal-banner 2.5s 3.5s ease-in-out;
    -o-animation: reveal-banner 2.5s 3.5s ease-in-out;
    -ms-animation: reveal-banner 2.5s 3.5s ease-in-out;
    animation: reveal-banner 2.5s 3.5s ease-in-out;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    opacity: 0;         
}

.carousel-btn-down-content {
    bottom: 18px;
    list-style: outside none none;
    padding-left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
    z-index: 15;
}

.carousel-btn-down-content .fa.fa-angle-double-down {
    color: #fff;
    font-size: 41px;
}

/* Carousel Fading slide */
.carousel-fade .carousel-inner { background: #000; }
.carousel-fade .carousel-control { z-index: 2; }  
.carousel-fade .item {
    opacity: 0;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-property: opacity;
}

.carousel-fade .next.left,
.carousel-fade .prev.right,
.carousel-fade .item.active { opacity: 1; }

.carousel-fade .active.left,
.carousel-fade .active.right {
    left: 0;
    opacity: 0;
    z-index: 1;
}


/* Safari Fix */
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
        opacity: 0;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}


/* Carousel Control custom */
.carousel-control .control-icon {
  font-size: 48px;
  height: 30px;
  margin-top: -15px;
  width: 30px;
  display: inline-block;
  position: absolute;
  top: 50%;
  z-index: 5;
}

/* Animation */
.control-box, a.carousel-control, .carousel-indicators li {
  -webkit-transition: all 250ms ease;
  -moz-transition: all 250ms ease;
  -ms-transition: all 250ms ease;
  -o-transition: all 250ms ease;
  transition: all 250ms ease;   
  /* hardware acceleration causes Bootstrap carousel controlbox margin error in webkit */
  /* Assigning animation to indicator li will make slides flicker */
} 

/** slider images **/
.img-one {
    background: url("../img/home-slider-03.jpg") no-repeat scroll center bottom / cover #000;
}

.img-two {
    background: url("../img/home-slider-02.jpg") no-repeat scroll center bottom / cover #000;
}

.img-three {
    background: url("../img/home-slider-04.jpg") no-repeat scroll center bottom / cover #000;
}

/* @media(max-width:767px) {
    .img-one {
        background: url("../img/main-slider-mobile.jpg") no-repeat scroll center bottom / cover #000;
    }
} */


.carousel-indicators li, .carousel-indicators .active {
    width: 6px;
    height: 10px;
    margin: 0 1px;
}

.carousel-indicators {
    margin-bottom: 0;
}

.carousel-indicators .active {
    background-color: #9bd4d7;
}

.carousel-indicators li {
    border-color: #fff;
}