@charset "utf-8";

body{
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
    font-size: 12px;
}

p{
    padding: 0px;
    margin: 0px;
    color: #000;
}

.pt{ font-size:10px; }

a:link, a:active, a:visited{
    text-decoration: none;
    color: #000;
}

a:hover{
    text-decoration: underline;
    color: #000;
}
.border{
    border:1px solid #525252;
}
.border_tb{
    border-top:1px solid #525252;
    border-bottom:1px solid #525252;
}
.border_b{
    border-bottom:1px solid #525252;
}
.border_r{
    border-right:1px solid #525252;
}
.padding12{
    padding: 12px;
}
.text-center{
    text-align: center !important;
    display: inherit;
}
.spacer{
    clear:both;
}
/*Knacss +*/
.mxs {
    margin: 0.5rem;
}
.ms {
    margin: 1rem;
}
.mm {
    margin: 2rem;
}
.ml {
    margin: 4rem;
}
.ps {
    padding: 1rem;
}
.pm {
    padding: 2rem;
}
.pl {
    padding: 4rem;
}

/* Header */
#logo { display: inline-block; max-width: 307px; }
#logo img { width: 100%; height: auto; }
#encart_header {
    margin:-10px auto 0;
    max-width: 310px;
    min-width: 200px;
    z-index: 1000;
}
#encart_header img { width: 100%; height: auto; }
#logo.small { width: 290px; }
#encart_header.small { width: 225px }

#header_panier div div{
    float:left;
    min-width:140px;
    width:100%;
}
/* Langues */
#lang {     
    display: inline-block;
    width: 100px;
    float: right;
    text-align: center;
    border: 1px solid #525252;
    border-radius: 5px;
    margin-right: 2px;
    margin-bottom:10px;
    background:#fff;
}
i.lang { 
    display: block;
    float: inherit;
    margin: auto;
    width: 32px;
    height: 32px;
    background: url('/charte/lang/switch.png') 0 0 no-repeat;
}
i.lang.fr { background-position: 0 -32px }
i.lang.de { background-position: -32px -32px }
i.lang:hover, i.lang.active { background-position-y: 0 }

#btn_more_info{
    font-weight: bold;
    text-decoration: underline;
    color: #1E0FBE;
}
#btn_more_info:hover{
    color: #f90;
}

a.btn_suivi_cmd{
    display:inline-block;
    font-size:12px;
    font-weight: bold;
    margin:10px 10px 0 0;
    text-decoration:none;
    text-align: center;
    padding: 5px;
    width: 165px;
    height:28px;
    line-height: 18px;
    /*border:1px solid black;*/
    background: url(/charte/espace-perso/btn_fond.gif) top left no-repeat;
}
a.btn_suivi_cmd:hover{
    background: url(/charte/espace-perso/btn_fond.gif) bottom left no-repeat;
    color:white;
}

h1{
    color:#000;
    font-size:28px;
    font-weight:normal;
    margin:0px;
    padding:0px;
}
h1.h1_liste{
    color:#000;
    font-size:13px;
    font-weight:bold;
    margin:0px;
    padding:0px;
}

h2{
    color:#525252;
    font-size:22px;
    font-weight:bold;
    padding:0px;
    margin:0px;
}
h2.h2_enteteFR{
    color:#525252;
    font-size:16px;
    font-weight:bold;
    padding:0px;
    margin:0px;
}


/*Texte*/

.txt_panier{
    padding-bottom:7px;
    color:#525252;
    font-size:11px;
}
.txt_panier input, #header_panier input{
    float:right;
    border:1px solid #525252;

}#header_panier input{
    height:20px;
}


.txt_blc_gras{
    color:#FFF;
    font-weight:bold;
}
.t_remise{
    background:#f90;
    font-weight:bold;
    color:#FFF;
}
.txt_remise{
    font-size:11px;
    color:#f90;
    font-weight:bold;
}

.txt_orange_gras{
    font-size:30px;
    font-weight:bold;
    color:#f90;
}
.txt_orange { color: #f90 }
.txt_gris{
    color:#525252;
    font-size:12px;
}

.txt_pt_gris{
    color:#525252;
    font-size:10px;
}

.txt_pt_noir{
    color:#000;
    font-size:11px;
}

.txt_gd{
    font-size:15px;
}

.txt_cat_detail{
    background-color:#c4cbd6;
    width:150px;
    font-weight:bold;
}

.txt_cat_list{
    font-size: 11px;
    line-height: 11px;
    color: #525252;
    padding: 0 2px;
}
#account_reseller{
    background: -moz-linear-gradient(top, #ebedf1 0%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ebedf1 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ebedf1 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebedf1', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    height:75px;
    padding-left: 25px;
    padding-top: 35px;
    color: #797A75;
    font-size: 1.3em;
    font-weight: 700;
}
#account_reseller span{
    display:block;
    position:absolute;
    width:55px;
    height:41px;
    background-image:url(/charte/home/fd-reseller-home.png);
    background-repeat:no-repeat;
    margin:-10px 0 0 0;
}
#account_reseller a { margin-left: 10px }
/*Fonds*/

.fd_panier{
    background-image:url(/charte/header_panier/fd_panier.gif);
    background-repeat:no-repeat;
    background-position:bottom center;
    vertical-align:top;
    display:block;
}

.fd_entete{	
    background: -moz-linear-gradient(top, #ebedf1 0%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ebedf1 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ebedf1 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebedf1', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    margin-top:10px;
}

.entete_home{
    text-align: center;
    padding:20px 20px 0;
    margin-bottom:0;
    font-size: 1.4em;
    line-height: 1.2em;
}
.entete_home h1{
    font-size: 1.25em;
    margin: 0 0 10px 0;
}
.entete_home strong{
    color: #f90;
}
.entete_home div{
    text-align: center;
    margin-bottom: 10px;
}
.entete_home span, .entete_home h2{
    display: block;
    font-size: 0.65em;
    line-height: 1.2em;
    margin-top: 5px;
    font-weight: bold;
    color: #000;
}

.fd_degrade{
    padding:5px;
    margin:10px;
    background: #ebedf1; /* Old browsers */
    background: -moz-linear-gradient(top, #ebedf1 0%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ebedf1 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ebedf1 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebedf1', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

.payment-means span::after {
    padding-left: 1px;
    content: '•';
}
.payment-means span:last-child::after { content: '' }
#img_cat {
    border: 1px solid black;
    border-radius: 5px;
}
a.btn_categories:link, a.btn_categories:active, a.btn_categories:visited, a.btn_categories_noroll {
    display: block;
    height:30px;
    background: #fff;
    color: #000;
    padding-left:0;
    text-align: center;
    /*padding-left:20px;*/
    padding-top: 5px;
    margin-top:10px;
    font-weight: bold;
    text-decoration: none;
    border: 1px solid #000;
    border-radius: 4px
}

a.btn_categories:hover{
    color: #fff;
    background: #c4cbd6; /* Old browsers */
    background: -moz-linear-gradient(top, #c4cbd6 0%, #828c95 15%, #7c7c7c 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #c4cbd6 0%,#828c95 15%,#7c7c7c 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #c4cbd6 0%,#828c95 15%,#7c7c7c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c4cbd6', endColorstr='#7c7c7c',GradientType=0 ); /* IE6-9 */
}

.fd_cat ul{	
    background: #ebedf1; /* Old browsers */
    background: -moz-linear-gradient(top, #ebedf1 0%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ebedf1 0%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ebedf1 0%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ebedf1', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
    margin-bottom:10px;
}

/*Form*/
input{
    color:#000;
    width:55px;
    background-color:#c4cbd6;
    border:solid 1px #787878;
    font-size:11px;
    text-align:right;
}

input.liste{
    background-color: #fff;
    border: solid 1px #787878;
    height: 24px;
    font-size: 1.1em;
    padding: 0;
}

input[type=number]:focus.liste {
    box-shadow: 0 0 5px rgba(255, 153, 0, 1);
    border: 1px solid rgba(255, 153, 0, 1);
}

/*Listes*/
ul{
    list-style:square outside;
    padding-left: 20px;
    margin:0px;
    padding-top:0px;
    padding-bottom:0px;
    color:#000;
}

/*Bordures*/

.bd_droitN{
    background-image:url(/charte/footer_droit/bd_droit.gif);
    background-position:right;
    background-repeat:repeat-y;
}

.bd_orange{
    border:solid 1px #f90;
}

.bd_bas_gris{
    border-bottom:solid 1px #525252;
    color: #525252;
}

.bd_droite_gris{
    border-right:solid 1px #525252;
    color: #525252;
}

.bd_gauche_gris{
    border-left:solid 1px #525252;
    color: #525252;
}

.bd_DG_gris{
    border-left:solid 1px #525252;
    border-right:solid 1px #525252;
    color: #525252;
}


/* Affichage de la Carte */
.div_map {
    background-color:#787878;
    position:fixed;
    margin:auto;
    height: 100%;
    width: 100%;
    filter:alpha(opacity=90);
    -moz-opacity:0.9;
    opacity: 0.9;
    left: 0px;
    top: 0px;
    z-index:2000;
    overflow:visible;
    cursor: pointer;
}

.div_map2 {
    position:absolute;
    display:none;
    height: 100%;
    width: 100%;
    z-index:2500;
    visibility:hidden;
    overflow: visible;
    top:0px;
    left:0px;
}
.div_map2 section{
    display: block;
    position: relative;
    max-width:1000px;
    margin:40px auto;
}
#mapdiv{
    display:block;
    z-index:10000;
    margin:auto;
    max-width: 1000px;
    min-height: 450px;
}
.map-world{
    position: relative;
    z-index: 10000;
    width: 100%;
    border: 3px solid;
    overflow: hidden;
    text-align: center;
    background: #fff;    
}
.map-world p{
    font-size: 20px;
    padding: 20px 0;
}
.map-world select{
    border: 3px solid #000000;
}
.div_map3 {
    position: relative;
    max-width: 1000px;
    width:100%;
    margin: 10% auto;
    z-index: 2600;
    overflow: visible;
    background: #fff;
    border: 1px solid #f90;
    text-align: center
}
#div_panier3 {
    background: transparent;
    border: 1px solid transparent;
}
i.arrow-right {
    display: inline-block;
    border-style: solid;
    border-width: 15px 0 15px 15px;
    border-color: transparent transparent transparent #f90;
    margin-bottom: -12px;
}
#datePrevueLivraison { 
    display: inline-block; 
    background: #e4e7ec; 
    padding: .5rem 1rem; 
    min-width: 75px; 
    height: 30px;
    text-align: center; 
}

div.fiche_detail{
    position:absolute;
    overflow:visible;
    width:100%;
    margin:auto;
    z-index:2600;
    top:75px;
}

.new {
    text-align:center;
    font-weight:bold;
    font-family:Arial;
    color:#FFF;
    background-image:url(/charte/header_gauche/fd_new.gif);
    background-repeat:no-repeat;
    background-position:left;
    height:20px;
}

.button {
    border: 1px solid #525252;
    border-radius: 5px;
    color: #525252;
    padding: 5px;
    height: auto;
    width: auto;
    text-decoration: none;
    position: relative;
    white-space: nowrap;
}
.button.pdf { background-image: url(/back/charte/pdf.gif); background-position: 1px 3px; background-repeat: no-repeat; padding-left: 20px }
.button:hover { text-decoration: none; color: #fff }
/* pour le "footer" droit */
.button.droite { display: inline-block; width: 150px; font-size: 1.1em; text-align: center; height: 15px }
.button.large { font-size: 1.2em }
.button.bold { font-weight: 700 }

.button-sprite {
    text-align: left;
    padding-left: 38px;
    width:100%;
    background-color: #e4e7ec;
    background-image: url(/charte/buttons.png);
    background-repeat: no-repeat;
}

a#button-print { background-position: 0 -200px; }
a#button-print.FR, a#button-print.DE { font-size: 1em; }
a#button-print:hover { background-position: 0 -225px; background-color: #f90; }
a#button-account { background-position: 0 0; }
a#button-account:hover { background-position: 0 -25px; }
a#button-contact { background-position: 0 -50px; }
a#button-contact:hover { background-position: 0 -75px; }
a#button-faq { background-position: 0 -100px; }
a#button-faq:hover { background-position: 0 -125px; }
a#button-reseller { background-position: 0 -150px; }
a#button-reseller:hover { background-position: 0 -175px; }
a#button-logout { background-position: 0 -250px; }
a#button-logout:hover { background-position: 0 -275px; }

.button-primary {
    width:100%;
    background: #ffac04;
    background: -moz-linear-gradient(top, #fff 18%, #ffac04 100%);
    background: -webkit-linear-gradient(top, #fff 18%, #ffac04 100%);
    background: linear-gradient(to bottom, #fff 18%, #ffac04 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#ffac04', GradientType=0);
    white-space:normal;	
    font-weight:bold;
}
#compte .button-primary {
    width:80%;
}
.button-primary:hover { background-color: #ffac04; }
.button-secondary { background-color: #e4e7ec; width:100%; }
.button-secondary:hover { background-color: #969aa1 }
.button-tertiary { background: #fff; }
.button-tertiary:hover {
    background: #525252; 
    background: -moz-linear-gradient(top, #fff 0%, #b5bdc8 38%, #525252 100%); 
    background: -webkit-linear-gradient(top, #fff 0%,#b5bdc8 38%,#525252 100%); 
    background: linear-gradient(to bottom, #fff 0%,#b5bdc8 38%,#525252 100%); 
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#525252',GradientType=0 ); 
}
/* page liste produit */
th { font-weight: normal; text-align: center }
.button-add { padding: 2px 5px; font-size: 1.1em }
span.picto {
    display: inline-block; 
    border-radius: 16px; 
    width: 16px; 
    height: 16px; 
}
.picto.info { background: #0be100; }
.picto.info::after { 
    display: inline-block;
    color: white;
    content: 'i';
    font-style: italic;
    padding-top: 2px;
}
/* Indisponibilité du produit */
.picto.unavailable { background: red; }
.unavailable { font-size: 0.8em; color: #ff9a00 }

.ml10 { margin-left: 10px }

.infobulle{
    position: absolute;
    border:2px solid white;
    box-shadow: 2px 2px 4px gray;
    border-radius: 10px;
}

#b-menu{
    display:none;
}
#b-menu a, #b-panier a { 
    background: url(/charte/header/sprite_mobile.png) 0 -30px no-repeat;
    padding-left: 32px;
    padding-top: 5px;
    height: 30px;
    display: inline-block;
}
#b-panier a {
    background-position: 0 0;
}
.b-nos-produits a{
    background: url(/charte/header/sprite_mobile.png) 98% -58px no-repeat #000;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    color:#fff;
    margin:5px 20px;
    padding:5px;
    text-align:center;
    font-weight:bold;
    font-size:16px;
    text-decoration:none;
    clear:both;
    display:none;
}

.add_panier, .Layer_espace_perso, .Layer_inscri_espace_perso{
    position:relative;
    width:100%;
    max-width:480px;
    margin:auto;
    padding:10px;
    background: #e6e7ea; /* Old browsers */
    background: -moz-linear-gradient(top, #e6e7ea 0%, #e6e7ea 25%, #fff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #e6e7ea 0%,#e6e7ea 25%,#fff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #e6e7ea 0%,#e6e7ea 25%,#fff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6e7ea', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.Layer_inscri_espace_perso{
    max-width:900px;
}
#infos_produit{
    display:none;
    font-size:10px;
}
.t_orange{
    background:#ff9a00;
    padding:5px;
    font-weight:bold;
    color:#fff;
    margin-bottom:5px;
}
.zone_panier{	
    display:none;
    width:100%;
    position:fixed;
    z-index:5000;
    background:#000;
    color:#fff;
    font-size:14px;
}
.zone_panier div{
    float:left;
    min-width:140px;
    width:90%;
    padding:2% 5%;
}
.zone_panier a{	
    color:#fff;
    font-weight:bold;
    cursor:pointer;
}
.zone_panier a:hover{
    text-decoration:underline;
}
.no-tiny{
    display:none;
}

.b-detail-remise{
    clear:both;
    font-size:11px;
    font-style:italic;
    display:none;
}
/* Bouton "Fermer" des Pop-Ups */
span.close {
    position: relative;
    display: inline-block;
    float: right;
    width: 16px;
    height: 16px;
    font-size: 12px;
    cursor: pointer
}
span.close::before {
    position: absolute;
    content: '\2297';
    font-size: larger;
}
span.close::after {
    position: absolute;
    content: 'CLOSE';
    right: 8px;
    top: 2px;
    font-size: smaller;
}
span.close:hover { color: #f90 }
/*DIV HOME*/
#div_home1{
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100;
    width:240px;
    margin-top:12px;
}
#div_home2{
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100;
    width:240px;
    margin-top:12px;
    margin-left:-65px;
}
#div_home3{
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100;
    width:240px;
    margin-top:127px;
}
#div_home4{
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100; width:240px;
    margin-top:127px;
    margin-left:-65px;
}
#div_home5{
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100;
    width:240px;
    margin-top:206px;
}
#div_home6{ 
    display:none;
    position:absolute;
    visibility:hidden;
    z-index:100;
    width:240px;
    margin-top:206px;
    margin-left:-65px;
}
/* FOOTER */
footer { margin-top: 5px }
footer > section { background: #e4e7ec; padding: 5px; border-bottom: 1px solid #787878 }
footer > section#referencement { background: #787878; color: #fff; text-align: left }
footer > section#referencement ul { list-style: none; padding: 0 }


/*KIT DEMO*/
.kit-demo{
    max-width:346px;
    min-height:384px;
    background:url(/charte/fd-kit-demo.png) top center no-repeat;
    text-align:center;
    font-size:1em;
    line-height:30px;
    padding:15px 0 0 0;
    margin:auto;
}

.kit-demo strong{
    display:block;
    color:#e4291e;
    font-size:33px;
}
.kit-demo .btn{
    margin-top:0px;
}

.encart_flag{
    z-index: 10000;
    cursor: pointer;
    display: block;
    padding: 3px 7px;
    margin: 1px;
}
.info-country{
    width: 135px;
    font-weight: bold;
    font-size: 10px;
    float: left;
    border: 1px solid;
    background: #ebedf2;
}
.info-country img{
    width: 30px;
    float: left;
    padding: 2px;
}
.info-country p {
    height: 2em;
    line-height: 2.2em;
    white-space: nowrap;
}
.change-country{
    font-family: Arial;
    font-weight: bold;
    font-size: 10px;
    float: left;
    height: 27px;
}
.change-country img{
    width: 20px;
    float: left;
    padding-top: 1px;
    margin-left: 10px;
}
.change-country p{
    width: 130px;
    padding-top: 3px;
}

@media (min-width: 577px) {
    #header {
        height: 80px;
        overflow-hidden: visible;
    }
    .mobile { display: none }
}
@media (max-width: 768px) {
    #header_panier{
        margin-top: 25px;
    }
}
@media (max-width: 576px) { /* 479px */
    .mobile { display: block }
    #b-menu{
        display:block;
    }
    #menu-site{
        display:none;
    }
    #header_panier div div, .zone_panier div{
        width:50%;
    }	
    #encart_header {
        margin-top:0;
    }
    section{
        padding:5px;
    }
    .zone_panier{
        display:block;
    }
    .b-detail-remise, .b-nos-produits a{
        display:block;
    }

    #div_home1, #div_home2, #div_home3, #div_home4, #div_home5, #div_home6{
        position:fixed;
        width:100%;	
        margin:0;
        padding:5%;
        top:20%;	
    }
    /* Carte */
    .div_map3 {
        position: fixed;
        width: 100%;
        margin: 20% auto;
    }
    .div_map3 img { width: 100%; height: auto }
    /* FOOTER */
    footer div a { display:inline-block; padding: 5px }
    .pt { font-size: 1em }
}


@media only screen and (max-width: 960px) {
    .select-to-top {
        display: flex;
        flex-direction: column-reverse;
    }
    .select-to-top .p-map-mobile{
        font-size: 1em;
    }
}
.eJQBBL {
    flex: none !important;
}