/* Le code CSS de la démo */
/**********************************************************/
/*desktop*/
/**********************************************************/


main{
    width:100%;
    background-image:url("../instructions/ressources/phare.jpg");
    background-size:cover;
    background-repeat: no-repeat;
    text-align:center;
    
}
.image{
    background-color: rgba(255,255,255,0.7);
    width : 100%;
    display:flex;
    flex-wrap:nowrap;
    justify-content:space-around;
    /*padding: 2%;*/
}

.image div{
    margin :  4% 2%;
    width: 50%;
    /*background-color:#fff;*/
   
}

.image p{
    text-align: justify;
     margin-bottom:0;
}
.image img{
    max-width : 100%;
    aspect-ratio:16/9;
}


/**********************************************************/
/*mobile*/
/**********************************************************/

@media screen and (max-width:500px) {
    .image{
    /*background-color: rgba(255,255,255,0.5);*/
    /*width : 100%;*/
    /*display:flex;*/
    flex-direction:column;
    /*flex-wrap:nowrap;*/
    justify-content:space-between;
    align-items: center;
}
.image div{
    margin :  4% ;
    width: 90%;
}


}