a:link {
    text-decoration: none;
}
a.bouton:active {
    outline-style: none;
}
a:focus {
    outline: 0;
}
html, body {
    background-color:#1a1a1a;
    position: fixed;
    left: 0;
    margin: 0;
    padding: 0;
    outline: 0;
    width:100vw;
    height: 100vh}

   #enter{
         position:absolute;
    display:block;
z-index:20;
    left:0vw;
    top:0vh;
    width:100vw;
    height:100vh; 
                  box-shadow:2px 2px 50px #000000;
} 

#enter img{
         position:absolute;
    display:block;
    right:0%;
    bottom:0%;
    width:10%;
    height:20%; 
                  box-shadow:2px 2px 20px #000000;
    
}




#petitbaigneur{
         position:absolute;
    display:block;
    left:0%;
    top:0%;
    width:100%;
    height:100%; 
                  box-shadow:2px 2px 50px #000000;
}

#nav{
      position:absolute;
    display:block;
    z-index:18;
    right:0px;
    bottom:0px;
    width:15vw;
    height:100vh;
    box-shadow:2px 2px 10px #ffffff;

}
#fondnav{
      position:absolute;
    display:block;
    z-index:18;
    right:0px;
    bottom:0px;
    width:15vw;
    height:100%;
    background-color:#36363d;
    box-shadow:2px 2px 10px #ffffff;

}

#baigneur{
      position:absolute;
    display:block;
    z-index:15;
    right:2%;
    top:2%;
    width:80%;
    height:15%;
color:white;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}

#meteo{
      position:absolute;
    display:block;
    z-index:15;
    right:2%;
    top:40%;
    width:80%;
    height:15%;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}
#piano{
      position:absolute;
    display:block;
    z-index:15;
    right:2%;
    bottom:5%;
    width:80%;
    height:15%;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}

#zoom{
      position:absolute;
    display:block;
    z-index:15;
    right:2%;
    top:78%;
 
    width:80%;
    height:15%;

    text-align:center;

}





#visuel{
    margin:0px;
    position:absolute;
    display:block;
    z-index:10;
    top:0px;
    width:auto;
    background-color:#36363d;



}
#player{
    position:relative;
    display:block;
    height:100%;

top:0%;
left:0%;
        box-shadow:2px 2px 20px #000000;


}
#entete{
    position:absolute;
        margin:0px;
    display:block;
    z-index:10;
    left:0px;
    top:0px;
    width:30%;
    height:100%;

}


#resize{
    position:absolute;
        margin:0px;
    display:block;
    z-index:10;
    left:2%;
    bottom:0px;
    width:8%;
    height:15%;

}

#cvs{

    width:100%;
    box-shadow:2px 2px 10px #ffffff;
    
}




#anim{
position:absolute;
    display:none;
    top:1%;
    right:25%;
    width:40%;
    height:40%;
    z-index:20;

    opacity:0.9
    box-shadow:2px 2px 10px #000000;

    
}

@media screen and (orientation: portrait)  {

    #resize{
    display:none;
}
#fondnav{
    display:none
}
#enter{
background-color:#464646;
}
#petitbaigneur{
    height:40vh
}

#enter img{
    right:35%;
    bottom:15%;
    width:30%;
    height:20%; 
                  box-shadow:0px 0px 20px #ffffff;
    
}

    #nav{

    z-index:18;
    right:0px;
    bottom:0px;
    width:100vw;
    max-height:50vh;
    box-shadow:2px 2px 10px #ffffff;
}

    #baigneur{

    left:2%;
    top:2%;
    width:40%;
    height:30%;
color:white;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}

#piano{
    z-index:15;
    right:2%;
    top:2%;
    width:40%;
    height:30%;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}
#meteo{
    z-index:15;
    right:27%;
    btom:2%;
    width:40%;
    height:30%;
    text-align:center;
          box-shadow:2px 2px 10px #000000;
}
    
    
#visuel{
    margin:0px;
    position:absolute;
    display:block;
    z-index:10;
    right:0vw;
    top:0px;
    max-width:100vw;
    background-color:#36363d;
    height:auto;
    width:100vw;
}
    #player{
    position:relative;
    display:block;
        width:100%;
    height:auto;

top:0%;
left:0%;
        box-shadow:2px 2px 20px #000000;


}


#anim{

    top:8%;
    right:0%;
    width:60%;
    height:25%;
    z-index:20;

    opacity:0.9
    box-shadow:2px 2px 10px #000000;

    
}
    
}


@media screen and (orientation: portrait) and (min-width: 423px) and (max-width: 1920px) {


}


@media screen and (orientation: landscape) and (min-width: 751px) and (max-width: 1024px) {
    

}


@media screen and (orientation: landscape) and (min-width: 1024px) and (max-width: 1400px) {


}


@media screen and (orientation: landscape) and (min-width: 1401px) {

}