@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;
}
.orange{
    color:#eb3300;
}
.block{
    display:block;
}
/* ## Elements récurents ################################################ */
.ftlHTML .btn {
    display:inline-block;
    width:11em;
    background-color:#ed1c27;
    border-bottom: 2px solid;
    border-color: #ca1821;  
    color:#FFF;    
    font-family: 'Open Sans', Arial, sans-serif;
    font-size:0.85em;/*17px*/
    font-weight: 700;
    font-style:normal;
    line-height: 1;
    white-space: nowrap;
    border-radius: 3px;
    padding: 1em 1.5em 0.9em 1.5em;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
}
.ftlHTML .btn:hover{
    background-color: #ca1821; 
}

/* ## HEADER ############################################################# */
.sectionHeader{
	background:url(../images/deco/bg-header-desktop.jpg) no-repeat center top;
	padding:0.8em 0 1.5em 1.5em;
}
.sectionHeader-title{
	max-width:400px;
	font-family:'CalvertMTStd-Bold', Georgia, Times, serif;    
	font-size:1em;
	font-weight:normal;
	line-height:1;
	padding:0;
	margin:0;
}
	.sectionHeader-title-label{
		display:block;
        font-size:2.1em;/*42px*/
		line-height:1.15;
        color:#FFFFFF;
        text-shadow: 0 0 2px rgba(0, 0, 0, 0.6);
    }

.sectionHeader-main{
	width:44%;
	/*background-color:#FFF;
	padding:2px;*/
	margin-top:1.15em;
}
	.sectionHeader-main-content{
        /*border:8px solid #003b72;*/
        background-color:#FFF;
		font-size:1em;
		line-height:1.3;
		padding:1.2em 1.5em; 
		margin:0;
	}
		.sectionHeader-intro{
            font-size:0.9em;
			margin:0;
		}
        .sectionHeader-buybox{
            display:flex;
            justify-content: space-between;
            align-items:center;
            margin-top:1.25em;
            margin-bottom:0;
            
        }
            .sectionHeader-logo{
                display:block;

            }
            .sectionHeader-pricer{
                font-family:'CalvertMTStd-Bold', Georgia, Times, serif;    
                font-weight: normal;
                margin-right:0.5em
            }
                    .sectionHeader-pricer em{
                        display:block;
                        font-size:0.8em;
                        font-style: normal;        
                    }
                    .sectionHeader-pricer strong{
                        display:block;
                        font-weight: normal;
                        font-size:2em;
                        line-height:0.9;
                    }
                        .sectionHeader-pricer strong i{
                            font-size:1.5em;
                            font-style: normal;    
                        }

/* ## Slider ############################################################# */
.wrapper-slider{
    padding-bottom:0;
    position:relative;
    overflow:hidden;
}
.slick-dots{
    bottom:-1.5em;
}
.slick-dots li button{ /* = pager du slider */
    background-color:#ededed;
}
.slick-dots li.slick-active button{ /* = pager du slider */
    background-color: #bfc1c2;
}
.slick-prev:before,
.slick-next:before{
    border-color: #003b72;
}

/* ## MAIN ############################################################### */

.sectionTitle{
    font-family:'CalvertMTStd-Bold', Georgia, Times, serif;    
	font-size:1.75em;/*35px*/
	font-weight:normal;
    line-height:1.1;
    padding:0;
    margin:1.25em 0 0.5em 0;
}
.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;
}

.sectionBanner{
    margin:1.25em 0;
}


/* ##### blocs specifiques  */
    /* machines à café*/
.productRow{
    display:flex;
    justify-content: space-around;
    align-items: center;
}
.productRow.reverse{
    flex-direction: row-reverse;
}
    .productRow-desc{
        flex-basis: 49%;
        padding:1em 1.5em;
    }
        .productRow-desc p{
            font-size:0.9em;
            line-height: 1.4;
            max-width:420px;
            margin:0;
        }
        .productRow-desc-cta{
            display:block;
            text-decoration: none;
            text-align: right;
            margin:1.25em 0 0 auto;
        }
            .productRow-desc-cta:hover .btn{
                background-color: #ca1821; 
            }
    .productRow-visuel{
        flex-basis: 49%;
    }
        .productRow-visuel img{
            display:block;
            max-width:100%;
            margin:0 auto;
        }

    /* Caracteristiques*/
.sectionCaracter{
    display:flex;
    justify-content: space-between;
    list-style-type:none;
    padding:0;
    margin:0 0 1em 0;
}
.sectionCaracter--par2.wrap{
    flex-wrap:wrap;
}
.blkCaracter{
    border:8px solid #bfc1c2;
	padding:0.8em 1em 1em 1em ;
}
.sectionCaracter--par4 .blkCaracter{
    flex-basis: calc((100% - 3em) / 4);
}
.sectionCaracter--par3 .blkCaracter{
    flex-basis: calc((100% - 2em) / 3);
}
.sectionCaracter--par2 .blkCaracter{
    flex-basis: calc((100% - 1em) / 2);
}

.sectionCaracter--par2.wrap .blkCaracter:nth-child(n+3){
    margin-top:1em;
}
    .blkCaracter-title{
        font-family:'CalvertMTStd-Bold', Georgia, Times, serif;      
        font-weight:normal;
        font-size:1.2em;
        line-height:1.1;
        text-align:center;
        margin:0 auto 0.5em auto;
    }
    .blkCaracter-title--2lignes,
    .blkCaracter-title--3lignes{
        display:flex;
        justify-content: center;
        align-items: flex-start;
    }
    .blkCaracter-title--2lignes{
        height:2.2em;
    }
    .blkCaracter-title--3lignes{
        height:3.3em;
    }
    .blkCaracter-visuel{
        margin:3px 0 1em 0;
        text-align:center;
    }
        .blkCaracter-visuel img{
            max-width:100%;
            margin:0 auto;
        }
    .blkCaracter-desc{
        font-size:0.8em;
        line-height:1.5;
        margin: 0;
    }
    .blkCaracter .btn{
        display:block;
        margin:1.25em auto 0 auto;
    }
    .blkCaracter-video{
        text-align: center;
    }

        
.globalLink{
    margin:2em 0;
    text-align:center;
}  

    /* liste simple */
.dotList{
    list-style-type: none;
    padding:0;
    margin:0;
}
    .dotList-item{
        line-height:1.4;
        padding-left:18px;
        position:relative;
    }
    .sectionCaracter .dotList-item{
        font-size:0.7em;
    }
    .sectionTesting .dotList-item{
        font-size:1em;
    }
    .dotList-item:not(:first-child){
        margin-top:0.5em;
    }
    .dotList-item:before {
        position:absolute;
        top:0;
        left:0;
        display: inline-block;
        content: "\2022";
        font-size:20px;
        color:#000;
    }
    .sectionCaracter .dotList-item:before{
        line-height:0.9;
    }   
        .dotList-item-link{
            color:#000;
            text-decoration: none;
        }
        .dotList-item-link:hover{
            text-decoration: underline;
        }

 
.largeVideo-link{
    display:block;
    margin:2em auto;
}

/* ##### 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;
    margin:0;
}
.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:calc(100vw - 20px);
    }
    .withGuttersOnMobile{
        width:90.625vw;
        max-width:580px;
        margin-left:auto;
        margin-right:auto;
    }    
    #dcom_main_container > table{
        background-color:#FFF !important;
    }
    .ftlHTML img{
        max-width:100%;
    }

    /* ## HEADER */
    .sectionHeader{
        min-height:unset;
        padding:0 ;
        background:#FFF url(../images/deco/bg-header-mobile.jpg) no-repeat top center;
        background-size:100%;
        position:relative;
    }
        .sectionHeader-title{
            position:absolute;
            margin:0 auto;
            top:3.625%;
            left:3.625%;
            width:50%;
            max-width:290px;
        }
            .sectionHeader-title-label{
                font-size:2em;
            }
        .sectionHeader-main{
            width:auto;
            padding:51.875% 0 0 0;
            margin:0 auto; 
        }
            .sectionHeader-main-content{
                border:8px solid #bfc1c2;
            }

    /**/
    .productRow{
        display:block;
        padding:45% 8px 8px 8px ;
        background-repeat:no-repeat;
        background-position: 0 0;
    }
    .productRow--machine1{
        background-image:url(../images/deco/bg-machines-auto-mobile.jpg);
        
        background-size: 100%;
    }
    .productRow--machine2{
        background-image:url(../images/deco/bg-machines-auto-pro-mobile.jpg);
        
        background-size: 100%;
    }
        .productRow-visuel{
            display:none;
        }
        .productRow-desc{
            background-color:#FFF;
            padding:1em 2em 1em 0.8em;
            position:relative;
        }
        .productRow-desc p{
            max-width:unset;
        }
        .productRow-desc-cta{
            margin:0;
        }
        .productRow-desc-cta:after{
            position:absolute;
            bottom:1em;
            right:1em;
            display:inline-block;
            width: 18px;
            height:18px;
            content:"";
            border-color:#ed1c27;
            border-style:solid;
            border-width:4px 4px 0 0;
            transform: rotate(45deg);
            margin:0;
        } 
            .productRow-desc-cta .btn{
                display:none;
            }
    .slick-dotted.slick-slider{
        margin-bottom:3em;
    }
    .sectionCaracter {
        display:block;
    }   
        .sectionCaracter:not(.slider) .blkCaracter:not(:first-child){
            margin-top:1em;
        }      
}


@media (max-width: 640px){

    .sectionHeader-title{
        font-size:0.9em;
    }

    .blkCaracter .ftlShowDesk{
        display:none !important;
    }
    .blkCaracter .ftlShowMob{
        display:block !important;
    }

    .mentions-legales {
        padding: 1em 2em;
        font-size: 0.8em;
    }    
}
@media (max-width: 480px){
    .ftlHTML{
        padding:0 0 1.5em 0;
       
    }
    .ftlHTML .btn{
        font-size:0.7em
    }
    /**/
    .sectionHeader-title{
        font-size:0.6em;
    }
    .sectionHeader-main-content{
        padding:1em;
        border:6px solid #bfc1c2;
    } 
    .sectionHeader-intro{
        font-size:0.9em;
        margin:0;
    }
    .ftlHTML .sectionHeader-logo{
        max-width:5.5em;
    }   
    /**/
    .sectionTitle {
        font-size: 1.2em;
    }
    .productRow{
        padding:45% 6px 6px 6px;
    }
        .productRow-desc{
            padding:0.7em 2em 0.7em 0.8em;
        }
            .productRow-desc p{
                font-size:0.6em;
            }
    .sectionCaracter .dotList-item{
        font-size:0.8em;
    }
    .blkCaracter{
        border-width:6px;
    }
        .blkCaracter-title,
        .blkCaracter-title--2lignes,
        .blkCaracter-title--3lignes{
            font-size:1.1em;
            display:block;
            text-align: center;
            height:auto;
        }

    /**/

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

}