@media all and (max-width:817px){
    #sceno {
       display: none;
   
    }
    nav {
    justify-content: center;
    }
    header h1{
    font-size:2em;
    }
    
    .bouton_sortie {
    display: inline;
    position: absolute;
    top: 60px;
    left: 30px;
    }
    #contenu {
        top: 41px;
        left: 0;
        margin-right: 0px;
    }
    .vignette {
        display: flex;
        margin:0px;
        width: 100vw;
        height: 50vw;
        margin-bottom: 1px;
    }
    .image_vignette {
        width: 50%;
        order: 1;
    }
    .contenu_vignette {
        left: 0;
        top: 0;
        width: 50%;
        height:50vw;
        opacity: 0.8;
        background-color: grey;
        padding: 0;
        order: 10;
    }
    .contenu_vignette h1 {
        height: 20vw;
        font-size: 2em;
        margin: 0;
    }
    .contenu_vignette h3 {
        padding-top: 5vw;
        font-size: 1em;
        height: 15vw;
        margin: 0;
    }
    .contenu_vignette h4 {
        height: 5vw;
        margin: 0;
    }
    .spectacle {
        width: 100%;
        height: 100%;
        margin: 0;
        margin-top: 41px;
        border: none;
    }
    .spectacle header {
        height: auto;
    }
    article {
    width: 100%;
    margin-right: 0px;
    margin-top: 0px;
}
    article nav a {

    padding: 3px;
    padding-top: 10px;
    padding-bottom:10px;
/*    margin-right: auto;*/
    width: 15vw;
    }
    #credit_photo {
    margin-right: 10px;
    }
    .notes {
        margin: 10px;
    }
    
    aside {
    width: 100%;
    margin-bottom: 30px;
   
    } 
    .generique {
        margin-bottom: 15vw;
    }
    #encadre_generique {
        overflow: scroll;
        height: auto;
    }
    .diapoPlusMoins {
        width: 40%
    }
    #diapoplus {
        left: 50%;}
    
}
@media all and (max-width:460px){
    .titre_complet {
        display: none;
    }
    #eg {
        display: block;
    }
    .titre_vignette {
        font-size: 16px;
    }
    
}