
body {
    overflow-x: hidden;
    font-family: "Roboto Slab","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 1.1vw;

    webkit-tap-highlight-color: #1ee2e7;
    margin: 0;
    padding: 0;
    /*box-sizing: border-box;*/

    background:#FCFDFE;

    background :url(/ogplay/images/logos/Logo_fond.png) no-repeat center top;
    background-size: contain;
    height: 95%;
    background-attachment:fixed;
}

.zone {
  display: flex; 
  flex-direction: row;
  justify-content: space-evenly;
  align-content: space-around;
  align-items: center ; /* ou strech */
  gap: 5vw 5vw;
  margin-top: 100px;
  width: 100%;    
  text-align: justify;
  font-size: calc( 8px + 1.5vw);
  line-height: 3.5vw;
  font-family: Lucida;
}

.container {
  display: flex; 
  flex-direction: row;
  justify-content: space-evenly;
  align-content: space-around;
  align-items: center ; /* ou strech */
  
  margin: auto;
  width: 80%;  
  min-width: 300px;
  max-width: 2000px;
  margin-top: 80px;
  margin-bottom: 80px;
}

.container > * {
  padding: 2vw;
  flex: 1 100%;
}


img{ width : auto ; } /* il suffit de modifier le height pour que le width rescale proprement*/
h1, h2, h3, h4 {
 font-family: 'Lora', serif;
 color:#154360; 

}

.gris {
  background: #E4EAE4;
}


.droite{
  text-align: right;  
}

a {
    color:#154360;
    text-decoration:none;
    transition-property: all;
    transition-duration: 1s;
    text-align: center;
}

a.visited {
    color:#4040F0;
}

a:hover {
    background:#D0D6D0;
    color:#454360;
    transition-property: all;
    transition-duration: 1s ;
}
