/* SLIDESHOW */

#stages-slideshow {
 z-index: -1;
 position: relative;
 padding: 0;
 }
#stages-slideshow LI {
 position: absolute;
 top: 0;
 left: 0;
 display: block;
 width: 100%;
 margin: 0;
 padding-top: 300px;
 background-size: cover;
 background-position: center center;
 background-repeat: none;
 text-align: center;
 opacity: 0;
 animation: stagesSlideshow 15s linear infinite 0s;
 }
#stages-slideshow LI:nth-child(2) {
 animation-delay: 5s;
 }
#stages-slideshow LI:nth-child(3) {
 animation-delay: 10s;
 }
#stages-slideshow EM {
 font-style: normal;
 background: rgba(255,255,255,0.7);
 margin: 0;
 padding: 2px 10px;
 position: relative;
 }
#stages-slideshow CITE {
 font-style: normal;
 text-shadow: 1px 1px 0 #222222;
 background: rgba(255,255,255,0.7);
 margin: 0 15px;
 padding: 2px 10px;
 }
#stages SPAN {
 display: block;
 position: relative;
 top: 250px;
 }
#stages SPAN A.dot:nth-child(2) {
 animation-delay: 5s;
 }
#stages SPAN A.dot:nth-child(3) {
 animation-delay: 10s;
 }
#stages H1 A,
#stages H1 A:visited,
#stages H1 A:active {
 color: #ffffff;
 text-shadow: 1px 1px 0 #222222;
 text-decoration: none;
 }


/* LAYOUT */

@media all and (min-width: 1024px) {
 #container {
  padding-top: 15px;
  }
 #stages {
  height: 420px;
  }
 #stages-slideshow {
  top: -100px;
  }
 #stages-slideshow LI {
  height: 400px;
  }
 #stages-slideshow EM {
  top: -35px;
  left: 40px;
  }
 #galerie {
  background: url('../img/textures/wall.png');
  padding-top: 50px;
  }
 #galerie DIV {
  white-space: nowrap;
  overflow: hidden;
  }
 }

@media all and (max-width: 1023px) {
 TABLE, TD {
  display: block;
  }
 #une H1 {
  display: none;
  }
 #stages {
  height: 300px;
  }
 #stages-slideshow {
  top: -70px;
  }
 #stages-slideshow LI {
  height: 150px;
  }
 #stages-slideshow CITE {
  position: relative;
  top: -45px;
  }
 #stages-slideshow EM {
  top: -60px;
  left: 20px;
  }
 #galerie {
  background-color: #dddddd;
  padding: 30px;
  }
 #galerie DIV {
  white-space: nowrap;
  overflow: auto;
  }
 }


@keyframes stagesSlideshow {
 0% {
  opacity: 0;
  }
 4% {
  opacity: 1;
  }
 34% {
  opacity: 1;
  }
 38% {
  opacity: 0;
  }
 100% {
  opacity: 0;
  }
 }

@keyframes stagesSlideshowDots {
 0% {
  background-color: transparent;
  }
 4% {
  background-color: #ffffff;
  }
 34% {
  background-color: #ffffff;
  }
 38% {
  background-color: transparent;
  }
 100% {
  background-color: transparent;
  }
 }