/* custom mobile styles */

body {
    background-color:white;
    padding: 0;
}

.logoZone, .headerRow {
    background-color: #fff;
}
    .headerRow .col20, .headerRow .col80 {
        height: 65px;
    }
.logoZone img {
    padding-top:4px;
    max-width: 200px;
}

h1 {margin-bottom: 0.5em;margin-top: 0.7em;}
.content h1 {width: 100%;line-height: 25px;}

.page .col25 img {width:100%;}

/* ********* Menu ************ */
.headerRow {
    width: 70%;
    float: left;
}
    .headerRow + .row {
        width: 30%;
        float: left;
    }
.navigation {
    line-height: 38px;
}
.navigZone {
   background-color: transparent;
   padding: 0 0.5em;
   margin-top: 1.1em;
}
#menu-icon {
    color: #000;
    width: 35px;
    height: 27px;
    background: #fff url(../images/mobileMenuBg_big.png) no-repeat;
    padding: 8px 10px 0 26px;
    cursor: pointer;
    border: none;
    display: block;
    float: right;
    background-size: 100%;
}
#nav {
    clear: both; 
    position: absolute;
    width: 200px;
    z-index: 100000;
    padding: 5px;
    background: #4F3931;
    right: 2px;
    top:3.3em;
    /*border: 1px solid #999;*/
    display: none;/* visibility will be toggled with jquery */
}
.navigation li {
    width: 100%;
}
/* ********************************** */

.navigButton {
    display: inline-block;
    text-align:center;
    width: 32.6%;
    padding: 8px 0;
    font-size: 0.8em;
    margin: 0;
}
.basketFull {background-position: 95%;background-size: 16%;}

/* ******* to display the 2 columns correctly ****************/

.navigLeft {
    float: none;
    width: 100%;
    position: static;
    max-width:599px;
}

.colright {
    position: static;
    float: none;
    width: 200%;
    padding-bottom: 0;
}
.col1wrap {
    right: 0;
}
.col1 {
    margin: 0 15px;
}
/* ******************************************************** */

.thumbnailProducts, .thumbnailRealisations {
    width:29%;
    min-width:20px;
    min-height:60px;
}
    .thumbnailProducts img, .thumbnailRealisations img {
        width:100%;
        height:auto;
    }
.supplierBox {
    display:table;
    width:49%;
    min-height: 75px;
    /*box-sizing: border-box;*/
}
.supplierLogo {
    width: 100%;
    text-align:center;
}
.supplierBox img {
    margin: 10px auto;
}

@media screen and (min-width: 0px) and (max-width: 429px) {
    .supplierBox {
        min-height:70px;
    }
        .supplierBox img {
            width: 80%;
        }
}

.footer {
font-size: 0.7em;
/*text-align:left;*/
padding-right: 10px;
}
.home_newsImage {
   max-width:100%;
}

.whiteBlock .col33, .whiteBlock .col66, .whiteBlock  .col50 {
    width: 100%;
}
.adresse .col40, .adresse .col60 {
    width: 100%;
}
.TitleLabel {
    width: 33%;
    margin-bottom: 10px;
}
.catalogue div.inlineBlock {
    width: 65%;
    margin-bottom: 20px;
}
.catalogue input[type="checkbox"] {vertical-align: top;}
.catalogue label.inlineBlock {width: 92%; padding-left: 10px;}
.productDetail a.link{
    display: inline-block;
    margin-top: 10px;
}
.supplier {
    width: 90px;
}
h3 + .supplier {margin-top: 12px;}
.productDetail .col40.pad1em, .productDetail .col60.pad1em {
    width: 100%;
    padding: 0.2em;
}
h2 {margin-top: 0;margin-bottom: 0.2em;}

.variantesTitle h3 {margin-top: 20px;}
.variantesTitle .col60, .variantesTitle .col40{
    width: 100%;
}
.variantes .col50 {
    width: 100%;
}
    .subProduct .col25 {
        width: 100%;
    }
        .subProduct img{
        margin-top: 0;
    }
.articleInfosDetail label, .hotDeals_text_detail label {width: 30%;min-width: 90px;}
    .articleInfosDetail label + div {max-width: 70%;}
    .hotDeals_text_detail label + div {max-width: 68%;}

.HotDeals_text {padding-left: 5px;}
.hotDealsList span + span {
    display: block;
    margin-top: 10px;
}
/* basket */

/*.basket .article .col10:first-child {width: 20%;}
.basketArticleInfos {width: 90%; padding-top: 0;}
.basket .article .col20, .basket .totalCell {width: 33%;border-top: 1px dotted #CCC;padding-top: 5px;}
.basket .headerTable .col20.bold{text-align: right;}
.basket .article .totalCell {text-align: right;}
.basket .actionButton + .link {display:block; margin-top: 10px;}
.mobileTxtRight {text-align:right;}

.basket .subTotal .col90, .basket .total .col90 {width: 100%;}
.basket .col10.emptyDiv {display: none;}
.basket .col10.emptyDiv + .col90 div:first-child {margin-left:0;margin-right: 0; }

.basket .subTotal .col60, .basket .total .col60 {width: 100%;}
.basket .subTotal .col20, .basket .total .col20 {width: 70%;text-align:right;}
.basket .subTotal .col20.mobileTxtRight, .basket .total .col20.mobileTxtRight {width: 30%;text-align:right;}

.basket .total .col100.mobile {
    border-top: 1px dotted #CCC;
    margin-top: 10px;
    text-align: center;
}
.basket .total .col60 {
    width: 100%;
    border-bottom: 1px dotted #CCC;
    margin-bottom: 10px;
}
.basket .comments .col33 {width: 100%;}
.basket .comments h3 {margin-bottom: 0;}*/

.basket .article,
.basket .total {
    display: block;
}

/* Entête */
.basket .headerTable .qteArticle,
.basket .headerTable .prixArticle,
.basket .headerTable .rabaisArticle,
.basket .headerTable .w20px {
    display: none;
}

/* Articles */
.basket .article {
    position: relative;
}

.basket .article .imgInfos,
.basket .article .qtePrix,
.basket .total .choixLivraison,
.basket .total .totalLivraison { 
    display: table;
    width: 100%;
}

.basket .article .imgInfos { 
    border-bottom: 1px dashed #dadada;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.basket .article .qteArticle {
    width: 100px;
}
.basket .article .qteArticle:before { content: "Qt\00E9 "; }
.basket .article .qteArticle:after { content: " \00D7 "; }

.basket .article .prixArticle {
    width: calc(100% - 160px);
    text-align: left;
}

.basket .article .prixPiece,
.basket .article .rabaisArticle {
    width: 100%;
}

.basket .article .rabaisArticle:before {
    content: "Rabais/pi\00E8 ce : ";
}
@media screen and (max-width: 390px) {
    .basket .article .rabaisArticle:before {
        content: "Rabais: ";
    }
}

.basket .article .totalArticle {
    width: 60px;
}

.basket .article .w20px {
    position: absolute;
    top: 0;
    right: 0;
}

.total .choixLivraison {
    padding-bottom: 15px;
    border-bottom: 1px dashed #dadada;
}

.total .totalLivraison .subTotalLivraison { margin-top: 5px; }
.total .totalLivraison .fraisLivraison { padding-bottom: 5px; }
.total .totalLivraison .totalTotalLivraison { margin-top: 10px; }


/* adresse */
#adresse .col50 {width: 100%;}
#contact label, #adresse label {width: 100%;margin-bottom: 3px;}
#adresse input[type="text"], #adresse textarea, #adresse select,#contact input[type="text"], #contact textarea {width: 100%;}

/* hot deals */
.hotDealArticle {
    background-color: #FCFCFA;
    border: 1px solid #D3CFC5;
    padding: 1em;
}
    .hotDealArticle .col25 {
        width: 100%;
    }
    .hotDealArticle + .separation {display: none;}

    /* detail */
.HotDeals_box_detail .col50 {
    width: 100%;
    padding: 0.2em;
}
.HotDeals_img_detail img {
    width: 100%;
}

/* realisation detail */
.realisation .col40, .realisation .col60 {width: 100%;}


/* news */

/*.news_box img {
    width: 100%;
}

.mag_adresses .col50 img {
    width: 100%;
    margin-top: 15px;
}

.RadWindow {
    width: 100% !important;
    height: auto !important;
}
    .RadWindow .planAcces {
        width: 100% !important;
        height: auto !important;
    }

.magasinPlanAcces {
    width: 100% !important;
    height: 580px !important;
}
.magasinPlanAcces table:first-child {
    height: 100% !important;
}
    .magasinPlanAcces .planAcces {
        width: 100% !important;
        height: auto !important;
        max-width: 300px !important;
    }*/


.news_text p img{max-width: 100%;}


.magasinPlanAcces{
    min-width: 280px;
    min-height: 380px;
}
.magasinPlanAcces table{
    min-height: 380px;
}
.col50 img {
    max-width: 100%;
}
#panorama {
    height: 320px;
    width: 100% !important;
    min-width: 280px;
}
#panorama embed{
    width: 100% !important;
    min-width: 280px;
}