/*--------------------------------*/
/*--------------1200--------------*/
/*--------------------------------*/

@media screen and (max-width: 1300px){

}

/*--------------------------------*/
/*--------------1190--------------*/
/*--------------------------------*/

@media screen and (max-width: 1190px)
{
    #index{ background: url('https://butterfly-media.s3.gra.io.cloud.ovh.net/legrand/xnet/2026/images/res_index.png') no-repeat center; background-size: 100%; min-height: 1000px;background-position: top;}

    #ct_index {
        position: relative;
        top: auto;
        display: block;
        margin-left: 0;
        width: 100%;
        background-color: var(--yellow);
        padding: 20px;
        top: 115px;
        z-index: 2;
    }    
    .index_res_1, .index_res_3{display: block;position: absolute !important;}
    
    .index_res_1{right: 0;top: 0;width: 270px;z-index: 3;}
    .index_res_2{left: 0;top: 160px;}
    .index_res_3{    left: 0;
    top: 200px;
    width: 80%;
    margin: 0 10%;z-index: 1;}
    .choose_country_txt{left: auto;font-size: 20px;}
}

/*--------------------------------*/
/*--------------980---------------*/
/*--------------------------------*/

@media screen and (max-width: 980px){
    /*GENERAL*/
    .contenu-page{
        padding: 0 10px;
    }
    
    /*HOME*/
    #ceo-blk div{width: 100%}
    #ceo-blk {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
    }    
    #ceo-blk .video-comprendre-ceo {
        margin: 0 auto;
        display: block;
    }    
    #comprendre-blk ul {
        display: flex;
        justify-content: space-between;
        align-items: stretch;
        flex-direction: column;
    }    
    #comprendre-blk li{
        margin-left: 0;
        width: 100%;
        margin: 0 auto;
        display: block;
    }    
    #comprendre-blk li:not(:first-child) {
        width: 400px;
        margin: 0 auto;
    }    
    #comprendre-blk li:not(:first-child) a {
        padding: 20px;
    }
    
    /*OFFRE*/
    #blk2_offre {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column-reverse;
    }    
    
    #blk2_offre div:first-child{
        margin-top: 20px;
    }
    
    #blk2_noter div img{
        display: none;
    }
    
    
    .blk2_souscrire_en_ligne_container img{
        display: none;
    }
    
    
    
}

/*--------------------------------*/
/*--------------550---------------*/
/*--------------------------------*/

@media screen and (max-width: 768px){
 
    /*GENERAL*/
    #logo_inner_site_res{
        display: block;
        position: absolute;
        top: 20px;
        right: 10px;    
    }
    
    #header_offre {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-direction: column;
    }    
    #header_offre h1{font-size: 34px;line-height: 30px;}
    #header_offre strong{font-size: 30px;line-height: 26px;}
    #header_offre div:first-child{margin-bottom: 20px;}
    
    .menu-burger{display: block;}
    header > nav > ul > li {
        display: block;
        font-size: 20px;
        margin-left: 0;
        position: relative;
        width: auto;
        height: auto;
        margin: 20px;
    }    
    
    header > nav {
        max-width: unset;
        width: 250px;
        top: 0;
        z-index: 100;
    }    
    
    header ul {
        display: none;
        justify-content: space-between;
        align-items: center;
        background-color: #F0F0EF;
        padding: 10px 30px;
        flex-direction: column;
        position: absolute;
        top: 80px;
        left: 0px;
        width: 400px;
    }    
    
    #ct_country{display: none;}
    header > nav > ul > li:last-child{display: none;}
    
    /*INDEX*/
    .res_only{display: block;}
    .index_res_1{display: none;}
    
    /*HOME*/
    #ceo-blk .video-comprendre-ceo {width: inherit;margin-bottom: 20px;}
    #ceo-blk div:not(:first-child) img {display: none;}
    #calendrier-blk {
        overflow: auto;
    }    
    .calendrier_blk_container{width: 900px;}
    
    /*SOUSCRIRE*/
    #blk2_avantage ul {
        display: flex;
        align-items: center;
        flex-direction: column;
    }    
    #blk2_avantage ul, #blk2_avantage ul li{margin: 20px 0 0 0;}
    
}

