#preloader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: black;
    z-index: 99;
    height: 100%;
    overflow: hidden;
    overflow-y: hidden;
    overflow-x: hidden;
}
#status {
      background-image: url("../media/logo_wide.jpg"); /* The image used */
      /*background-color: black; /* Used if the image is unavailable */
      height:550px; /* You must set a specified height */
      background-position: center center; /* Center the image */
      background-size:200%;
      background-repeat: no-repeat; /* Do not repeat the image */
      /*background-size: cover; /* Resize the background image to cover the entire container */
      background-attachment: fixed;
      /*position: relative; /* */ 
      max-width:2000px;
      overflow: hidden;
      overflow-y: hidden;
      overflow-x: hidden;
}
#status_wide {
    width: 100%;
    height: 640px;
    position: absolute;
    /*left: 100%;/**/
    top: 50%;/**/
    background-image: url("../media/logo_wide.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    margin: -320px 0 0 0;/**/
    background-size:100%;
}
#teaser_wide {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
#teaser_small {
    position: absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%,-50%);/**/
}
@media (max-width:600px){#video{width:400px; height:280px}}
@media (min-width:601px){#video{width:600px; height:500px}}
#page{display: none}
#intro{
    display:none;
    overflow: hidden;
    overflow-y: hidden;
    overflow-x: hidden;
}
body {
    transition: 2s;  
    background-color: black;
    font-family: "Lato", sans-serif;
}
.backgroundLogoWide{
        width: 100%;
        height: 640px;
        position: absolute;
        /*left: 100%;/**/
        top: 50%;/**/
        background-image: url("../media/logo_wide.jpg");
        background-repeat: no-repeat;
        background-position: center center;
        background-size: cover;
        margin: -320px 0 0 0;/**/
        background-size:100%;
        max-width:2000px;
        background-attachment: fixed;
      overflow: hidden;
      overflow-y: hidden;
      overflow-x: hidden;

}
.backgroundLogoWide2{
      background-image: url("../media/logo_wide.jpg"); /* The image used */
      /*background-color: black; /* Used if the image is unavailable */
      height:900px; /* You must set a specified height */
      background-position: center center; /* Center the image */
      background-size:50%;

      background-repeat: no-repeat; /* Do not repeat the image */
      background-size: cover; /* Resize the background image to cover the entire container */
      background-attachment: fixed;
      position: relative;
      max-width:2000px;
      overflow: hidden;
      overflow-y: hidden;
      overflow-x: hidden;
}
.backgroundLogo{
      background-image: url("../media/logo_wide.jpg"); /* The image used */
      /*background-color: black; /* Used if the image is unavailable */
      height:550px; /* You must set a specified height */
      background-position: center center; /* Center the image */
      background-size:200%;
      background-repeat: no-repeat; /* Do not repeat the image */
      /*background-size: cover; /* Resize the background image to cover the entire container */
      background-attachment: fixed;
      /*position: relative; /* */ 
      max-width:2000px;
      overflow: hidden;
      overflow-y: hidden;
      overflow-x: hidden;
}
.fondu {
    opacity: 0;
    /*animation: fondu 0s 0s;/* TEST ONLY */
    animation: fondu 5s 0s;/* PROD ONLY*/
    animation-fill-mode:forwards;
   /* animation-timing-function: ease-in;/**/
}
@keyframes fondu {
  0%{opacity:0;}
  33%{opacity:100}
  66%{opacity:100}
  100%{opacity:0;}
}
.fonduPage {

    opacity: 0;
    /*animation: fonduPage 2s 0s;/* TEST ONLY */
    animation: fonduPage 2s 0s;/* PROD ONLY */    
    animation-fill-mode:forwards;
    animation-timing-function: ease-in;
}
@keyframes fonduPage {
  0%{opacity: 0;}
  100%{opacity: 100;}
}
.fonduModal {
    opacity: 0;
    animation: fonduModal 1s 0s;  
    animation-fill-mode:forwards;
    animation-timing-function: ease-in;
}
@keyframes fonduModal {
  0%{opacity: 0;}
  100%{opacity: 100;}
}
.fonduDiapo {
    background-color:black;
    opacity: 0;
    animation: fonduDiapo 6s 0s;
    animation-fill-mode:forwards;
    animation-timing-function: ease-in-out;
}
@keyframes fonduDiapo {
  0%{opacity: 0;}
  5%{opacity: 100;}
  95%{opacity: 100;}
  100%{opacity: 0;}
}
.monDiaporama {display: none}
.anchor{
  display: block;
  height: 105px; /*same height as header*/
  margin-top: -105px; /*same height as header*/
  visibility: hidden;
}.column-layout {
  display: table;
  width: 100%;
  border-collapse: separate;
}
.column-layout > div {
  display: table-cell;
  width: 33.333%; /* 100%/3 = 3 colonnes */
  /*padding: 10px;
  margin: 10px 10px 10px 10px;/**/
  border: 10px black solid;
}
.column-layout > div > img {
  width:100%;
  height : 100%;
}
