/*!
 * Cédric le 160208
 */
/*! spécification  */

html,
body {
    height: 100%;
}

.carousel,
.carousel-item,
.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%;
      -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
  animation: zoomin 10s linear;
    animation-fill-mode: none;
  animation-fill-mode: forwards;
          animation-timing-function: ease-in;
        -webkit-animation-timing-function: ease-in;
         -webkit-animation: zoomin 10s linear;
             -webkit-animation-fill-mode: none;
  -webkit-animation-fill-mode: forwards;
}
@-webkit-keyframes zoomin {
    0% {
      -webkit-transform: scale(1);
      transform: scale(1);
       -webkit-animation-timing-function: ease-in;
    }
    100% {
      -webkit-transform: scale(1.05);
      transform: scale(1.05);
      animation-timing-function: ease-in;
    }

}


.footer {
    margin: 50px 0;
}

.responsive-slider .slides ul li .slide-body .caption.header {
  top: 15%;
  left: 40%;
}
.slider-control {
  position: absolute;
  -webkit-transition: 500ms linear;
  -moz-transition: 500ms linear;
  -o-transition: 500ms linear;
  -ms-transition: 500ms linear;
  transition: 500ms linear;
  font-size: 50px;
  color: #fff;
  background-color: transparent;
  padding: 10px;

}
.slider-control.left {
  left: 2%;
  padding-left: 13px;
  opacity:0;
}
.slider-control.right {
  right: 2%;
  padding-right: 13px;
  opacity:0;
}
.slider-control:hover , .slider-control.left:focus{
  fill:#fff;
}
#my_carousel2 .carousel-caption .carousel-caption-bas,
#my_carousel2 .carousel-caption .carousel-caption-haut {
  opacity: 0;
  filter: alpha(opacity=0);
}


.carousel-indicators .active {
    fill:#bea669;
}

#carouselprinc:hover  .slider-control.left {
    opacity: 1;
}
#carouselprinc:hover  .slider-control.right{
    opacity: 1;
}
#carouselprinc .slider-control.left:hover  {
    opacity: 1;
}
#carouselprinc  .slider-control.right:hover {
    opacity: 1;
}
/*
#imagecentrale:hover ~ #carouselprinc .slider-control.right{
    opacity: 1;
}

#imagecentrale:hover ~ #carouselprinc .slider-control.left {
    opacity: 1;
}*/



    @media (min-width: 0px) {
      .slider-control {
        top:80%;
        display:none;
      }
    }
    @media (min-width: 768px) {
      .slider-control {
        top:40%;
        display:block;
      }
    }