@import url("//hello.myfonts.net/count/38dbaf"); /*IMPORTANT ! = page view counter */
/* ## TYPOGRAPHY ############################################################# */

@font-face {
    font-family: 'CalvertMTStd-Light';
    src: url('../font/38DBAF_0_0.eot');
    src: url('../font/38DBAF_0_0.eot?#iefix') format('embedded-opentype'),
    url('../font/38DBAF_0_0.woff2') format('woff2'),
    url('../font/38DBAF_0_0.woff') format('woff'),
    url('../font/38DBAF_0_0.ttf') format('truetype');
}
@font-face {
    font-family: 'CalvertMTStd';
    src: url('../font/38DBAF_1_0.eot');
    src: url('../font/38DBAF_1_0.eot?#iefix') format('embedded-opentype'),
        url('../font/38DBAF_1_0.woff2') format('woff2'),
        url('../font/38DBAF_1_0.woff') format('woff'),
        url('../font/38DBAF_1_0.ttf') format('truetype');
}
@font-face {
    font-family: 'CalvertMTStd-Bold';
    src: url('../font/38DBAF_2_0.eot');
    src: url('../font/38DBAF_2_0.eot?#iefix') format('embedded-opentype'),
        url('../font/38DBAF_2_0.woff2') format('woff2'),
        url('../font/38DBAF_2_0.woff') format('woff'),
        url('../font/38DBAF_2_0.ttf') format('truetype');
}


/* ## structure ########################################################## */
.ftlHTML{
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    font-size:20px;
    color:#000;
    padding:0 0 20px 0;
}
/**/.zoneLink:hover{
    opacity:0.8;
}
.hasTouch.isSmallScreen .zoneLink:hover{
    opacity:1;
}
/* ## helpers ########################################################## */
.rouge{
    color:#ed1c27 !important;
}
.vert{
    color:#009444 !important;
}
.bleu{
    color:#0095f6;
}
.block{
    display:block;
}
/* ## Elements récurents ################################################ */
.ftlHTML .btn {
    display:inline-block;
    background-color:#ed1c27;
    border-bottom: 3px solid;
    border-color: #ca1821;  
    color:#FFF;    
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 16px;
    font-weight: 700;
    font-style:normal;
    line-height: 1;
    white-space: nowrap;
    border-radius: 3px;
    padding: 16px 1.5em 13px 1.5em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}
.ftlHTML .btn:hover{
    background-color: #ca1821; 
}

/* ## HEADER ############################################################# */
.ftlHTML{
    position:relative;
}

.sectionHeader{
    background: url(../images/deco/bg-header-b-desktop.jpg) no-repeat right 0;
    /*background-size:auto 100%;*/
    min-height:460px;
    padding-top:1em;
    position:relative;
}
    .sectionHeader-title{
        max-width:500px;
        font-family:'CalvertMTStd-Bold', Georgia, Times, serif;    
        font-size:1em;
        font-weight:normal;
        line-height:1.1;
        padding:0;
        margin:0;
        position:relative;
    }
        .sectionHeader-title-bigLabel{
            display:block;
            font-size:2.60em;
			color:#005ead;
        }

        .sectionHeader-title-label{
            display:block;
            font-size:2.60em;
			color:#000000;
        }
        .sectionHeader-title-subtitle{
            display:block;    
            font-size:1.40em;
			color:#000000;
        }
    .sectionHeader-main{
        width:572px;
        margin-top:1.25em;
    }


/* ## Block Produit & Slider ############################################################# */
.wrapper-slider{
    padding-bottom:0;
    position:relative;
    overflow:hidden;
}
.slick-dots li.slick-active button{ /* = pager du slider */
    background-color: #005ead;
}
.blkProduct{
    max-width:100%;
    display:block;
    background-color:#005ead;
    border:8px solid #005ead;
}
.blkProduct.zoneLink:hover{
    opacity:0.8;
}
.blkProduct--labelAside,
.slick-initialized .blkProduct--labelAside.slick-slide{
    display:flex;
}
.blkProduct-visuel{
    padding:0;
}
.blkProduct--labelAside .blkProduct-visuel{
    flex-basis: 50%;
    align-self: center;
    padding:0;
}
.blkProduct-visuel img{
    display:block;
    max-width:100%;
    margin:0 auto;
}
.blkProduct-label{
    background-color: #FFF;
    padding:1em;
}
.blkProduct--labelAside .blkProduct-label{
    flex-basis: 50%;
}
.blkProduct-label-desc{
    font-family:'CalvertMTStd', Georgia, Times, serif;
    padding:0;
    margin:0;
}
.blkProduct-label-desc-title{
    font-size:0.9em;
    line-height:1.1;
    padding:0;
    margin: 0 0 0.5em 0
}
.blkProduct-label-desc-title a,
.blkProduct-label-desc-title a:hover{
    text-decoration: none;
    color:#000;
}
.blkProduct-label-desc-title-cat{
    display:block;
}
.blkProduct-label-desc-title-name{
    font-family:'CalvertMTStd-Bold', Georgia, Times, serif;
    display:block;  
}
.blkProduct-label-desc-pricer{
    font-family:'CalvertMTStd', Georgia, Times, serif;
    padding:0;
    margin:0;
}
.blkProduct-label-desc-pricer strong{
    display:inline-block;
    margin-right:10px;
    font-size:1.5em; /* 2.4em */
}
.blkProduct-label-desc-pricer .cent{
    font-size:0.65em;
}
.blkProduct-label-desc-pricer del{
    display:inline-block;
    text-decoration-line: none;
    text-decoration: none;
    position:relative;
    font-size:1em; /* 1.5em */
    font-weight:600;
    line-height:0.9;
}
.blkProduct-label-desc-pricer del:after{
    display:inline-block;
    position:absolute;
    background-color:#ed1c27;
    right:0;
    bottom:0;
    left:0;
    content:"";
    height:2px;
    font-size:1px;
    transform: rotate(-13deg);
    transform-origin: bottom left;
}
.blkProduct-label-links{
    position:absolute;
    right:1.5em;
    bottom:1.5em;
    text-align:right;
    margin:0;
}
    /* Contextualisation des éléments du bloc Produit*/
        /* sectionHeader*/
    .sectionHeader .blkProduct{
        border:2px solid #FFF;
        padding:8px;


    }    
    .sectionHeader .blkProduct-label-desc-title-name{
        height:2.21em;
    }
    .sectionHeader .blkProduct-label-desc-pricer{
        line-height:30px;
        height:30px;
    }
    .sectionHeader .blkProduct-label-desc-pricer del{
        display:inline-block;
    }    
    .sectionHeader .blkProduct-label-links{
        display:none;
    }


/* ## MAIN ############################################################### */
hr {
    display:block;
    width:auto;
    height:0;
    padding:0;
    border-color: #F1F1F1;    
    border-style:solid;
    border-width: 0 0 2px 0;
    margin:0;
}
.sectionTitle{
    font-family:'CalvertMTStd', Georgia, Times, serif;    
    font-size:1.8em;
    line-height:1.1;
    padding:0;
    margin:0.85em 0 0.3em 0;
}
.sectionTitleSmall{
    font-family: 'Open Sans', Arial, sans-serif;
    font-size:1em;
    font-weight:700;
    line-height:1.1;
    padding:0;
    margin:1em 0 0.75em 0;
}
.sectionTitleSmall-sub{
    font-weight:400;
}
.sectionSubtitle{
    font-family: 'Open Sans', Arial, sans-serif;
    font-size:0.9em;  
    font-weight: 400;
    color:#353535;
    padding:0;
    margin:0 0 0.5em 0;
}
/* ##### Bandeau promo  */
.sectionBanner{
    margin:2em auto;
}
.sectionHeader + .sectionBanner,
.sectionSubtitle + .sectionBanner{
    margin-top:1em;
}
.sectionBanner--withBorders{
    /*border-bottom:1px solid #f2f2f2;
    border-width:2px 0 ;*/
}
.sectionBanner a{
    display:block;
}
.sectionBanner a:hover{
    opacity:0.8;
}
.sectionBanner img{
    display:block;
    margin:0 auto;
    max-width:100%;
}
.sectionBanner--two{
    display:flex;
    justify-content: space-between;
}
.sectionBanner--two a{
    flex-basis: calc(( 100% - 1em ) / 2 );
}

/* ##### Strate EDITO (partie supérieure)  */
.strateEdito{
    display: flex;
    justify-content: flex-start;
    align-items: stretch;
    height:300px;
    padding:8px;
}
.strateEdito--reverse{
    flex-direction: row-reverse;
}
.strateEdito--thema1{
    background:#000 url(../images/deco/bg-thema-1a-desktop.jpg) no-repeat 0 0;
}
.strateEdito--thema2{
    background:#000 url(../images/deco/bg-thema-2-desktop.jpg) no-repeat 0 0;
}
.strateEdito--thema3{
    background:#000 url(../images/deco/bg-thema-3a-desktop.jpg) no-repeat 0 0;
}
.strateEdito--thema4{
    background:#000 url(../images/deco/bg-thema-4-desktop.jpg) no-repeat 0 0;
}
    .strateEdito-main{
        display:flex;
        justify-content: space-between;
        align-items: center;
        padding:1.25em 1.5em;
        width:50%;
        height:284px;
        background-color:#FFF;
    }
        .strateEdito-main-part1{
            width:180px;
        }
        .strateEdito-main-part2{
            width:240px;
        }
            .strateEdito-picto{
                display:block;
                margin-bottom:0.5em;
            }
            .strateEdito-title{
                font-family:'CalvertMTStd', Georgia, Times, serif;    

                font-weight:700;
                margin:0;
            }
                .strateEdito-title a,
                .strateEdito-title a:hover{
                    text-decoration:none;
                    color:#000;
                }
            .strateEdito-readTime{
                display:block;
                font-size:0.7em;
                color:#929292;    
                margin:1em 0 0 0;
            }
            .strateEdito-text{
                font-size:0.8em;
                line-height:1.4em;
                color:#5c5c5c;
                margin:0 0 1.6em 0;
            }
            .strateEdito-fakeLink{
                display:block;
                font-size:0.8em;
                color:#005ead;
                text-align:right;
                text-decoration:underline;
            }
            .strateEdito-main.zoneLink:hover{
                opacity:1;
                cursor: pointer;
            }
            .strateEdito-main.zoneLink:hover .strateEdito-title a {
                color:#005ead;
            }            
            .strateEdito-main.zoneLink:hover .strateEdito-text,
            .strateEdito-main.zoneLink:hover .strateEdito-fakeLink {
                color:#000;
            }

    .strateEdito-videoLink{
        display:flex;
        align-items: center;
        justify-content: center;
        width:50%;
    }
    .strateEdito-videoLink:hover{
        opacity:0.8;
        cursor: pointer;
    }
        .strateEdito-videoLink img{
            display:block;
            margin: 0 auto;
            max-width:33%;
        }

/* ##### Structure des Thematiques (partie Secondaire)  */
.sectionMore{
    margin:1em auto;
}
.sectionMore--split{
    display:flex;
    justify-content: space-between;
}
.sectionMore--split .sectionMore-main{
    flex-basis:74.5%;
}
.sectionMore--split .sectionMore-aside{
    flex-basis:23.5%;
}
.sectionMore-title{
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    font-size:1.2em;
    font-weight:700;
    margin-bottom:0.5em;
}
.sectionMore-selection,
.sectionRSlist{
    display:flex;
    justify-content: space-between;
    list-style-type: none;
    padding:0;
}
.sectionMore-selection + .sectionMore-selection{
    margin-top:1em;
}
.sectionBanner + .sectionRS{
    margin-top:-1em;
    margin-bottom:2em;
}

/* ##### Divers styles de Blocs  */
/* ??## Bloc Categorie */
.blkCategory{
    width: calc( ( 100% - 3em ) / 4 ) ;
    display:block;
    padding:1em;
    background-color:#F2F2F2;
    border:none;
    align-items: unset;
}
.sectionRSlist .blkCategory{
    width: calc( ( 100% - 3em ) / 4 ) ;
    display:block;
    padding:0;
    background-color:#FFF;
    border:none;
    align-items: unset;
}
.blkCategory.zoneLink:hover{
    background-color:#005ead; 
}
.sectionRSlist .blkCategory.zoneLink:hover{
    background-color:#FFF; 
}
.sectionMore-selection--par4 .blkCategory{
    width: calc( ( 100% - 3em ) / 4 ) ;
}
.sectionMore-selection--par3 .blkCategory{
    width: calc( ( 100% - 2em ) / 3 ) ;
}
.sectionMore-selection--par2 .blkCategory{
    width: calc( ( 100% - 1em ) / 2 ) ;
}
.blkCategory-visuel{
    padding:0;
}
.blkCategory-visuel img{
    display:block;
    margin:0 auto;
    max-width:100%;
}
.blkCategory-label{
    display:block;
    text-align:center;
    text-decoration: none;
    font-family: 'Open Sans', Arial, Helvetica, sans-serif;
    font-size:0.9em;
    font-weight:700;
    /*color:#000;*/
    background-color:none;
    padding:0.5em 0 0 0;
}
.sectionRSlist .blkCategory-label{
    font-size:1em;
    font-weight:400;
}
.blkCategory-label-name{
    display:block;
    color:#000;
}
.blkCategory-label-pricer{
    display:block;
    color:#ed1c27;
    margin-top:5px;
}
.blkCategory.zoneLink:hover .blkCategory-label-name,
.blkCategory.zoneLink:hover .blkCategory-label-pricer{
    color:#FFF; 
}
.sectionRSlist .blkCategory.zoneLink:hover .blkCategory-label-name,
.sectionRSlist .blkCategory.zoneLink:hover .blkCategory-label-pricer{
    color:#000; 
}

/* ##### Section conseils (+ blocks Conseils et Edito) */
.sectionConseils {
    margin-top:1em;
    display:flex;
    justify-content: space-between;
}
.blkConseil{
    flex-basis: 49%;
}
    .blkConseil a:hover img{
        opacity:0.8;
    }

/* ##### Mentions légales */
.mentions-legales {
    padding:20px 40px;
    font-size: 0.6em;
    color: #414141;
    background-color: #F2F2F2;
    margin:2.5em 0;
}

.js-publiAccordionLight-toggle {
    cursor: pointer;
}
.js-publiAccordionLight-content {
    display: none;
    padding-top:1em;
}

/* ============================================================================================*/
/* ==== RESPONSIVE behaviour ==================================================================*/
/* ============================================================================================*/

@media (max-width: 767px){
    .ftlHTML{
        font-size:18px;
        max-width:640px;
        margin-left:auto;
        margin-right:auto;
    }
    #dcom_main_container .site .ftlHTML{ /* template Darty menu Mobile */
        width: 100vw;
    }
    #dcom_main_container > table .ftlHTML{ /* template Darty header XXL */
        width:93.75vw;
    }
    #dcom_main_container > table{
        background-color:#FFF !important;
    }
    .ftlHTML img{
        max-width:100%;
    }

    /* ## HEADER */

    .sectionHeader{
        min-height:unset;
        padding-top:0;
        background: none;
    }
    .sectionHeader-main{
        width:auto;
        padding-top:40%;
        background:url(../images/deco/bg-header-b-mobile.jpg) no-repeat top center;
        background-size:100%;
        margin-top:1em;        
    }
    .sectionHeader-title{
        max-width:unset;
    }


    /* ## bloc produit  */
    .sectionHeader .blkProduct-label{
        padding:1em 0.5em;
    }

    /* ## MAIN */
    .sectionHeader + .sectionBanner{
        margin-top:1em;
    }
    .sectionBanner--withBorders{
        border:6px solid #f2f2f2;
    }
    .strateEdito{
        flex-direction: column-reverse !important;
        height:auto;
        padding:46.875% 3.125vw 3.125vw 3.125vw;
    }
    .strateEdito--widthVideo{
        padding-top:0;
    }
    .strateEdito--thema1{
        background:#000 url(../images/deco/bg-thema-1a-mobile.jpg) no-repeat 0 0;
        background-size:100%;
    }
    .strateEdito--thema2{
        background:#000 url(../images/deco/bg-thema-2-mobile.jpg) no-repeat 0 0;
        background-size:100%;
    }
	.strateEdito--thema3{
        background:#000 url(../images/deco/bg-thema-3a-mobile.jpg) no-repeat 0 0;
        background-size:100%;
    }
	.strateEdito--thema4{
        background:#000 url(../images/deco/bg-thema-4-mobile.jpg) no-repeat 0 0;
        background-size:100%;
    }
        .strateEdito-main{
            display:block;
            padding:1.25em 1.5em;
            width:auto;
            height:auto;
        }
            .strateEdito-main-part1,
            .strateEdito-main-part2{
                width:auto;
            }  
            .strateEdito-main-part1:before,
            .strateEdito-main-part2:before,
            .strateEdito-main-part1:after,
            .strateEdito-main-part2:after{
                content:"";
                display:table;
                clear:both;
            }
            .strateEdito-picto{
                display:block;
                width:18%;
                float:left;
                margin-right:1em;
            }
        .strateEdito-videoLink{
            width:auto;
            height:auto;
            padding:12% 0;
        }              
            .strateEdito-videoLink img{
                max-width:25%;
            }  
    .sectionMore{
        display:block;
    } 
    .sectionMore-selection,
    .sectionRSlist{
        flex-wrap: wrap;
        margin-top:0;
    }    
    .sectionMore-selection:not(.sectionMore-selection--par3) .blkCategory,
    .sectionRSlist .blkCategory{
        width: calc( ( 100% - 1em) / 2 ) ;
    }
    .sectionMore-selection:not(.sectionMore-selection--par3) .blkCategory:nth-child(n+3),
    .sectionRSlist .blkCategory:nth-child(n+3){
        margin-top:1em;
    }

    .sectionConseils {
        display:block;
    }
    .blkConseil:not(:first-child){
        margin-top:1em;
    }       
    .mentions-legales {
        padding: 1em 2em;
        font-size: 0.8em;
    }
}

@media (max-width: 480px){
    .ftlHTML{
        padding:0 0 1.5em 0;
        font-size:16px;
    }
    .withGuttersOnMobile{
        width:93.75vw;
        margin-left:auto;
        margin-right:auto;
    }   
    hr {
        border-width: 0 0 4px 0;
    }

    .sectionHeader-title{
        padding:1em 0;
    }    
    .sectionHeader-title-bigLabel {
        font-size: 2.2em;
    }
    .sectionHeader-title-subtitle {
        font-size: 1.2em;
    }
    .sectionHeader-main{
        padding-top:43%;
        margin-top:0;
    }

    .sectionBanner--two{
        display:block;
    }
    .sectionBanner--two a:not(:first-child) {
        margin-top:1em;
    }
    .sectionTitle {
        font-size: 1.4em;
        margin-top:1.25em;
    }
    .sectionTitle-subtitle{
        display:block;
    }
  
    .ftlHTML .blkProduct-label,
    .ftlHTML .blkProduct--labelAside .blkProduct-label{
        height:8.25em;
        padding:1em;
    }
    .ftlHTML .blkProduct-label-desc{
        display:flex;
        flex-direction:row;
        flex-wrap: wrap;
        justify-content: flex-start;
        align-content:space-between;
        height:100%;
    }
    .ftlHTML .blkProduct-label-desc-title{
        flex-basis:100%;
        height:auto;
    }
    .ftlHTML .blkProduct-label-desc-title-name{
        height:auto;
    }
    .ftlHTML .blkProduct-label-desc-pricer{
        flex-basis:100%;
        line-height:1;
        height:auto;
        font-size:1.1em;
        padding-right:20px;    
    }
    .ftlHTML .blkProduct-label-desc-pricer strong{
        display:inline-block;
        margin-right:10px;
    }  
    .ftlHTML .blkProduct-label-desc-pricer del{
        display:inline-block;
    }
    .ftlHTML .blkProduct-label-links{
        display:block;
        width:10%;
    }
    .ftlHTML .blkProduct-label-links{
        right: 1.2em;
        bottom: 1em;
    }    
    .blkProduct-label-links .btn{
        display:none
    }
    .blkProduct-label-links:after{
        display:inline-block;
        width: 18px;
        height:18px;
        content:"";
        border-color:#ed1c27;
        border-style:solid;
        border-width:4px 4px 0 0;
        transform: rotate(45deg);
    } 

    .sectionMore{
        margin-bottom:1em;
    }
    .sectionMore-selection--par3 .blkCategory{
        width: calc( ( 100% - 1em) / 2 ) ;
    }     
    .sectionMore-selection--par3 .blkCategory:last-child{
        width: 100% ;
        margin-top:1em;
    } 
    /**/

}
@media (max-width: 360px){
    .ftlHTML{
        font-size:14px;
    } 

}