body {
}

#contenu {
    max-width: 995px;
    min-height: 600px;
}

.titreParagraphe {
    color: #004c74;
    font-size: 18px;
    font-weight: bold;
    position: relative;
    top: 30px;
}

.caracteristique {
    color: #6c6c6e;
    font-size: 14px;
    padding: 10px 3px;
}

    .caracteristique ul {
        padding: 0 0 0 20px;
        margin: 0 0 0 20px;
        list-style-image: url(../images/check.png);
    }

    .caracteristique li {
        margin-bottom: 10px;
    }

.titreCaracteristiques {
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize;
    text-shadow: 0 3px 0 rgba(0,0,0,.1);
    background-color: #6c6c6e;
    color: white;
    text-align: left;
    margin-bottom: 10px;
    padding: 3px 15px;
}

.accroche {
    color: #004c74;
    font-size: 20px;
    font-weight: bold;
}

    .accroche ul {
        padding: 0 0 0 20px;
        margin: 0;
        list-style-type: none;
    }

    .accroche li {
        margin-bottom: 10px;
    }

.presentation {
    font-size: 16px;
    color: #004c74;
    padding: 10px 20px;
}

.garantieMarque {
    padding: 0 10px;
}

.entete_serie {
    background-color: #177fc3;
    color: white;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    padding: 8px 0;
}

.numRenvoi {
    background-color: yellow;
    padding: 2px 2px;
    color: #004c74;
}

td.entete_article, th.entete_article {
    background-color: #28bbee;
    color: white;
    text-align: center;
    font-size: 16px;
    font-weight: normal;
    /*line-height: 17px;*/
    padding: 5px 5px;
    vertical-align: middle;
}

.entete_article a {
    color: white;
    text-decoration: none;
    font-size: 16px;
}

    .entete_article a:hover {
        text-decoration: underline;
    }

.table_article tr:nth-child(2n) {
    background-color: #ebedf0;
}

.reference_article, .value_article, .libelle_article, .prix_article {
    padding: 5px;
}

.value_article, .libelle_article {
    text-align: center;
}

.prix_article {
    text-align: right;
}

div.optionnelle, div.complementaire {
    margin-top: -30px;
}

    div.optionnelle .uneGamme, div.complementaire .uneGamme {
        padding-top: 30px;
    }

h2.optionnelle, h2.complementaire {
    font-size: 20px;
    font-weight: bold;
    border: 1px solid #efefef;
    padding: 10px 10px 10px 199px;
    position: relative;
    box-shadow: 10px 10px 0px rgba(0,0,0,.1);
    background-position: right center;
    background-repeat: no-repeat;
    cursor: pointer;
    margin-bottom: 30px;
}
    /*div.optionnelle, div.complementaire{
    display:none;
}*/
    h2.optionnelle.ouvert {
        color: #ff7f37;
        background-image: url(../images/optionnelleOuvert.png);
    }

    h2.optionnelle.ferme {
        color: #ff7f37;
        background-image: url(../images/optionnelleFerme.png);
    }

    h2.optionnelle span, h2.complementaire span {
        display: block;
        position: absolute;
        top: -5px;
        left: -41px;
        height: 76px;
        width: 234px;
        color: white;
        font-size: 22px;
        padding: 3px 3px 3px 52px;
        box-sizing: border-box;
        line-height: 22px;
    }

    h2.optionnelle span {
        background-image: url(../images/cartoucheJaune.png);
    }

div.optionnelle td.entete_article {
    background-color: #ff7f37;
}


h2.complementaire span {
    background-image: url(../images/cartoucheRose.png);
}

h2.complementaire.ouvert {
    color: #21bbef;
    background-image: url(../images/complementaireOuvert.png);
}

h2.complementaire.ferme {
    color: #21bbef;
    background-image: url(../images/complementaireFerme.png);
}

div.complementaire td.entete_article {
    background-color: #21bbef;
}

.zoom {
    background-color: none;
}

.uneGamme {
    background-color: #fff;
    border: 1px solid #eee;
    padding: 3px;
    box-shadow: 10px 10px 0px rgba(0,0,0,.1);
}

a.reference_article, .reference_article a, .libelle_article a {
    color: #004c74;
}

    a.reference_article:hover, .reference_article a:hover, .libelle_article a:hover {
        color: #ff7f37;
    }

    .articlePlusPlus{
        display:none;
    }
    .article_plus{
        display:none;
    }

    .imageGamme { 
        max-width: 985px;
    }
    .imageGamme.imageGammeVignette {
        max-width: 250px;
    }

@media screen and (min-width: 1px) and (max-width: 767px) {
    .libelle_article, .prix_article {
        padding: 1px;
    }

    td.entete_article, th.entete_article {
        background-color: #28bbee;
        color: white;
        text-align: center;
        font-size: 16px;
        font-weight: normal;
        line-height: 17px;
        padding: 1px 1px;
        vertical-align: middle;
    }

    .reference_article, .value_article, .libelle_article, .prix_article {
        padding: 5px 0;
    }

    .imageGamme {
        max-width: 100%;
    }

    .articlePlusPlus{
        display:table-cell;
    }
    .article_plus{
        display:table-cell;
    }
    .nonPlus{
        display:none;
    }
    .articlePlusPlus span{
        display:none;
    }
    .articlePlusPlus.fa{
        text-align:center!important;
    }
}