/*!
 * Start Bootstrap - Full Slider HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

html,
body {
    height: 100%;
}

.carousel,
.item,
.active {
    height: 100%;
}

.carousel-inner {
    height: 100%;
}

/* Background images are set within the HTML using inline CSS, not here */

.fill {
    width: 100%;
    height: 100%;
    background-position: center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

footer {
    margin: 50px 0;
}



/*.carousel-fade .carousel-inner .item {
  -webkit-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  opacity: 0;
}
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
  z-index: 2;
}


*/

/* Carousel Fading slide */


/*.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);
  }
}




/* CSS used here will be applied after bootstrap.css */
@-webkit-keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeIn {
0% {opacity: 0;}
100% {opacity: 1;}
}

@-webkit-keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

@keyframes fadeOut {
  0% {opacity: 1;}
  100% {opacity: 0;}
}

.carousel-inner.anim > .item {
  left: 0;
}

.carousel-inner.anim > .next,
.carousel-inner.anim > .prev {
  position: absolute;
  top: 0;
  width: 100%;
}
.carousel-inner.anim > .next.left {
  
  -webkit-backface-visibility: visible;
          backface-visibility: visible;
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  -webkit-animation-duration:0.6s;
          animation-duration:0.6s;
    

}
.carousel-inner.anim > .prev.right {
  -webkit-animation-name: fadeIn;
          animation-name: fadeIn;
  -webkit-animation-duration:0.6s;
          animation-duration:0.6s;
   

}
.carousel-inner.anim > .active.left {
    -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
  -webkit-animation-duration:0.6s;
          animation-duration:0.6s;
    

}
.carousel-inner.anim > .active.right {
        -webkit-animation-name: fadeOut;
          animation-name: fadeOut;
  -webkit-animation-duration:0.6s;
          animation-duration:0.6s;

}