body, html {
    height: 100%;
    margin: 0;
  }

  
  
  .bg {
    /* The image used */
    background-image: url("fondecrean.jpg");
  
    /* Full height */
    height: 100%; 
  
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  .souscontainer{
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: auto;
    width: 50%;
    left:25%;
  }
  .monTexte {
    writing-mode: vertical-rl;
    text-orientation: sideways-left;
    color:white;
    position:absolute;
    top:30%;
    right:20%;
    text-align:center;
  
  }
  .logostcergues{
    position:absolute;
    top:10px;
    left: 10px;
  }
  .logostcergues>img{
    max-width:10%;
  }
  h2{
    color:white; 
    text-align:center
  }
  .logo>img{
    max-width: 40%; display: block; margin-left: auto; margin-right: auto;
  }


  .investisseurs{
    position: absolute;
    top:30px;
    right:10%;
  }

  .investisseurs>a{
    color:white; text-align:center;display: block; margin-left: auto; margin-right: auto;
  }




  


  @media(max-width: 767px){
    .logo>img{
        max-width: 75%; display: block; margin-left: auto; margin-right: auto; margin-top:10px;
      }
      .logostcergues>img{
        max-width:20%;
      }
      .monTexte {
        writing-mode: vertical-rl;
        text-orientation: sideways-left;
        color:white;
        position:absolute;
        top:30%;
        right:5%;
        text-align:center;
      
      }

      .bar {
        width: 75%;
      }
      .levee{
        width: 75%;
      }

}
