.page_footer--links--mentions_legales {
    display: none;
}

/* INDEX
    - HTML
    - Classes communes
    - Texte
    - BackgroundColors
    - Texte Colors
    - Liens
    - Buttons
    - List
    - Labels
    - Table
    - Menu
    - Customisation des blocs
    - Small pages
    - Classification
*/
/* =HTML */
@font-face {
    font-family: 'Awesome-solid';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../font/fa-solid-900.eot");
    src: url("../font/fa-solid-900.eot") format("embedded-opentype"), url("../font/fa-solid-900.woff2") format("woff2"), url("../font/fa-solid-900.woff") format("woff"), url("../font/fa-solid-900.ttf") format("truetype"), url("../font/fa-solid-900.svg") format("svg");
}

@font-face {
    font-family: 'Awesome-regular';
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("../font/fa-regular-400.eot");
    src: url("../font/fa-regular-400.eot") format("embedded-opentype"), url("../font/fa-regular-400.woff2") format("woff2"), url("../font/fa-regular-400.woff") format("woff"), url("../font/fa-regular-400.ttf") format("truetype"), url("../font/fa-regular-400.svg") format("svg");
}






/* ======= ======= */


/* Pour écraser le css Bootstrap "box-sizing: border-box;" qui pose soucis */
*, ::after, ::before {
    box-sizing: content-box;
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    display: none;
}


#jquery-overlay {
    z-index: 10000 !important;
}

#jquery-lightbox {
    z-index: 11000 !important;
}

body {
    font-size: 13px;
}


label {
    font-weight: normal;
}


a {
    color: #F22CB3;
    text-decoration: none;
}

h1 {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 0.5em;
}

h2 {
    font-weight: bold;
    margin-bottom: 5px;
}

h3 {
    font-weight: bold;
    margin: 10px 0;
}

    h3 a {
    }

p {
    margin-bottom: 1em;
}

em {
    font-size: 0.8em;
}

th a {
    color: inherit;
}

input[type=text], input[type=password] {
    min-height: 22px;
    text-indent: 3px;
}

select {
    min-height: 26px;
    padding-left: 3px;
}

input[type='checkbox'] {
    vertical-align: top;
}

input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px white inset;
}

textarea:focus, input:focus {
    outline: 0;
}

/* =BackgroundColors */
.whiteBackground {
    background-color: #fff;
}

.lighterBackground {
    background-color: #F7F7F7;
}

.lightBackground {
    background-color: #C4C4C4;
}

.darkBackground {
    background-color: #B3B3B3;
}

.darkerBackground {
    background-color: #777;
}

.couleur1Background {
    background-color: #C1D82F;
}

/* =Texte Colors */
.lighterText {
    color: #fff;
}

.lightText {
    color: #B3B3B3;
}

.darkText {
    color: #777;
}

.darkerText {
    color: #000;
}

.couleur1Text {
    color: #C1D82F;
}

.couleur2Text {
    color: #F22CB3;
}

/* =Classes communes */
.pointer {
    cursor: pointer;
}

.rightContent {
    text-align: right;
}

.centerContent {
    text-align: center;
}

.leftContent {
    text-align: left;
}


.topContent {
    vertical-align: top;
}

.middleContent {
    vertical-align: middle;
}

.floatRight {
    float: right;
}

.floatLeft {
    float: left;
}

.floatNone {
    float: none;
}

.clearFix {
    clear: both;
}

.displayNone {
    display: none;
}

.displayBlock {
    display: block;
}

.displayInline {
    display: inline;
}

.displayInlineBlock {
    display: inline-block;
}

.displayTable {
    display: table;
}

.displayTableRow {
    display: table-row;
}

.displayTableCell {
    display: table-cell;
}

.whiteSpaceNoWrap {
    white-space: nowrap;
}

.borderSpacing8 {
    border-spacing: 8px;
}

.spacedContentBloc {
    margin: 10px 0 10px 0;
}

.spacedSideContentBloc {
    margin-left: 2px;
}

.overMe:hover {
    text-decoration: underline;
}

.padding2 {
    padding: 2px;
}

.padding5 {
    padding: 5px;
}

.padding10 {
    padding: 10px;
}

.paddingTop5 {
    padding-top: 5px;
}

.paddingRight5 {
    padding-right: 5px;
}

.paddingRight10 {
    padding-right: 10px;
}

.paddingBottom5 {
    padding-bottom: 5px;
}

.paddingLeft3 {
    padding-left: 3px;
}

.paddingLeft5 {
    padding-left: 5px;
}

.paddingLeft10 {
    padding-left: 10px;
}

.marginAuto {
    margin: auto;
}

.margin2 {
    margin: 2px;
}

.margin5 {
    margin: 5px;
}

.margin10 {
    margin: 10px;
}

.marginBottom5 {
    margin-bottom: 5px;
}

.marginBottom10 {
    margin-bottom: 10px;
}

.marginLeft5 {
    margin-left: 5px;
}

.marginLeft10 {
    margin-left: 10px;
}

.marginRight5 {
    margin-right: 5px;
}

.marginRight10 {
    margin-right: 10px;
}

.marginRight20 {
    margin-right: 20px;
}

.marginTop5 {
    margin-top: 5px;
}

.marginTop10 {
    margin-top: 10px;
}

/* =Texte */
.smallerText {
    font-size: 8px;
}

.smallText {
    font-size: 11px;
}

.largerText {
    font-size: larger;
}

.boldText {
    font-weight: bold;
}

.spaceMe {
    padding-left: 5px;
}

/* =Border */
.border {
    border-style: solid;
    border-width: 1px;
}

.borderTop {
    border-top-style: solid;
    border-top-width: 1px;
}

.borderLeft {
    border-left-style: solid;
    border-left-width: 1px;
}

.borderBottom {
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.whiteBorder {
    border-color: #fff;
}

.lighterBorder {
    border-color: #F7F7F7;
}

.lightBorder {
    border-color: #C4C4C4;
}

.darkBorder {
    border-color: #B3B3B3;
}

.darkerBorder {
    border-color: #000;
}

.couleur1Border {
    border-color: #C1D82F;
    border-width: 2px;
}

.borderRadius3 {
    border-radius: 3px;
}

.borderRadius5 {
    border-radius: 5px;
}


.lienContenu {
    text-decoration: underline;
}


/* =Image */
.limitedImg {
    max-height: 120px;
    max-width: 120px;
}

/* =Labels */
.formLabel {
    display: inline-block;
}

.label120 {
    width: 120px;
}

.labelFullWidth {
    width: 88%
}

.largeLabelForm {
    display: inline-block;
    width: 180px;
}

.formLine {
    margin-bottom: 10px;
}


.inputDatepicker {
    width: 100px;
}

search.smallBox {
    min-width: 30px;
    width: 30px;
    height: 20px;
}

.mediumBox {
    min-width: 45px;
    width: 45px;
    height: 20px;
}

.largeTextArea {
    width: 420px
}

.labelCheckBox {
    margin-left: 5px;
    display: inline-block;
    vertical-align: top;
}

.labelInput {
    margin-right: 4px;
}

.radioButton {
}

    .radioButton label {
        margin-left: 5px;
    }

    .radioButton input[type="radio"], .radioButton input[type="checkbox"] {
        vertical-align: middle;
        position: relative;
        *overflow: hidden;
        margin-top: -3px;
    }

.radioButtonDisplayNone input[type="radio"], .radioButtonDisplayNone input[type="checkbox"] {
    display: none;
}

.checkBox label {
    margin-left: 5px;
}

.checkBox input[type="checkbox"] {
    vertical-align: middle;
    position: relative;
    *overflow: hidden;
    margin-top: -3px;
}

.select_filtre, .select_tri {
    border-radius: 3px;
    height: 28px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.text_filtre {
    height: 24px;
    margin-top: 2px;
    margin-bottom: 2px;
    min-width: 200px;
    border: solid 1px #b3b3b3;
}


/* =Table */
.gridView {
    margin-top: 21px;
    width: 100%;
}

    .gridView td {
        padding: 2px 4px 2px 4px;
    }


/* =Messages */
.message {
    border-top: 2px solid #f00;
    border-bottom: 2px solid #f00;
    color: #f00;
    margin: 10px 5px 0 0;
    display: block;
    padding: 5px;
}


/* =Customisation des blocs */

/* SD - 18/09/2018 
.main {
    padding: 4px 1em 0 1em;
}
    */

/* SD - 20/07/2018
.leftCol {
    border-right-width: 1px;
    border-right-style: solid;
    padding: 1em;
}
*/

.popup {
    width: 40%;
    padding: 25px;
    margin: auto;
    border: 1px solid #aaa;
}

.buttonsHolder {
    margin: -5px 0 20px 20px;
}

    .buttonsHolder input {
        margin-right: 10px;
    }

#paniers {
    width: 350px;
    float: right;
}

/* =Small pages */
.container {
    margin: 25px;
    padding: 5px 15px 15px 15px;
}

/* =ArticleCatalogue */

/* SD - 19/09/2018 - reporté dans scj._ArticleMaster.css
#VignettesClassification {
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    text-align: center;
}

#VignettesClassification .line {
    display: inline-block;
    margin: 10px;
}
*/

.topDottedBorder {
    border-top-width: 1px;
    border-top-style: dotted;
}

.spacedInsideContent {
    padding: 10px;
}

.spacedInsideContentLight {
    padding: 4px;
}

.spacedInsideContent li {
    margin-bottom: 5px;
}

.articlePicture {
    min-height: 120px;
}

#dialog_confirmation, #dialog_information, #dialog_duplication {
    display: none;
}

#div_overlay {
    display: none;
    z-index: 9000;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#div_chargement {
    display: none;
    z-index: 9500;
    top: calc(50% - 100px);
    left: calc(50% - 100px);
    position: fixed;
    width: 200px;
    height: 200px;
    background: transparent url(../image/loading_circle_blanc.gif) no-repeat center center;
}


#div_chargement_progress {
    box-sizing: border-box;
    display: none;
    z-index: 9500;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: transparent url(../image/loading_circle.gif) no-repeat center 80px;
    background-color: white;
    border-radius: 10px;
    max-width: 90%;
    width: 360px;
    height: 230px;
    background-size: 30%;
    webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
}

#progressbar .ui-progressbar-value {
    background: #44A99E;
}

.progress-text {
    text-align: center;
    position: absolute;
    left: 50%;
    top: 40px;
    transform: translateX(-50%);
    width: 90%;
    font-size: 20px;
    font-weight: bold;
}

.progress-label {
    position: absolute;
    left: 50%;
    top: calc(50% + 18px);
    transform: translate(-50%, -50%);
    font-weight: bold;
    text-align: center;
    font-size: 18px;
}

.smallDiv {
    width: 20px;
}

/* =ArticleDetail */
#div_image {
    margin-left: -10px;
    margin-right: 10px;
}

#ContenuPlaceHolder_MainContenuPlaceHolder_div_photo img {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    max-height: 100%;
    max-width: 100%;
    width: 100%
}



.ui-dialog {
    z-index: 11000 !important;
    position: fixed !important;
}

/* Customisation jQuery UI tabs pour ArticleDetail */
.ui-tabs {
    border: none;
}

.ui-tabs-nav {
    background: none;
    border: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #C4C4C4;
}

    .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br, .ui-tabs-nav li {
        border-radius: 0;
    }

/* !important for customisation */
.ui-widget-content a {
    color: #F22CB3;
}

/* =ArticleFiche */
#ContenuPlaceHolder_div_photo img {
    width: 100%;
}

.tableContenu {
    margin: 10px 0 0 15px;
    border-spacing: 10px;
}

    .tableContenu tbody tr {
        margin-bottom: 10px;
    }

        .tableContenu tbody tr td {
            padding: 0 3px 10px 10px;
        }

            .tableContenu tbody tr td:first-child {
                border-right: 1px dotted #C4C4C4;
                border-bottom: 5px solid #FFF;
            }

                .tableContenu tbody tr td:first-child img {
                    width: 90%;
                }

            .tableContenu tbody tr td div {
                margin-bottom: 5px;
            }

/* =PanierListe */

.tbLibelle {
    width: 100%;
    font-size: larger;
}

tr[id*='tr_livraison_'] td {
    padding-top: 0px;
}


.tablePanierListe input[type=checkbox] {
    transform: scale(1.6);
}


/* =CdeConfirmation */
.tableCdeConfirmation #td_vignette, .tablePanierDetail td[id*="td_vignette"] {
    width: 60px;
    height: 60px;
}

.tableCdeConfirmation tbody tr:nth-child(even) td:first-child {
    border-top-width: 1px;
    border-top-style: solid;
    border-top-color: #C4C4C4;
}

.tableCdeConfirmation #td_vignette img {
    max-width: 100%;
    max-height: 100%;
}

.tableCdeConfirmation tfoot tr td {
    padding: 5px;
}


#ContenuPlaceHolder_rbl_filtre_commande td input,
#ContenuPlaceHolder_radio_button_affichage td input,
#ContenuPlaceHolder_check_list_type_connexion td input,
#ContenuPlaceHolder_check_list_type_action td input {
    margin: 0 5px 5px 20px;
}

#ContenuPlaceHolder_rbl_filtre_commande td label:hover,
#ContenuPlaceHolder_radio_button_affichage td label:hover,
#ContenuPlaceHolder_check_list_type_connexion td label:hover,
#ContenuPlaceHolder_check_list_type_action td label:hover {
    cursor: pointer;
    text-decoration: underline;
}

/* Vignette Classification*/
.vignette {
    min-height: 140px;
    max-height: 140px;
    max-width: 210px;
}


/* Affichage Vignette article */
.height210 {
    height: 210px;
}


.fullHeight {
    height: 100%
}

.fullWidth {
    width: 100%;
}

.overPhoto {
    z-index: 2;
    background: rgb(255,255,255);
    background: transparent\9;
    background: rgba(255,255,255,0.8);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ccFFFFFF,endColorstr=#ccFFFFFF);
    zoom: 1;
}

.vignetteGrid {
    height: 120px;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.bottom {
    left: 2px;
    bottom: 2px;
}

#btnUp {
    position: fixed;
    bottom: 15px;
    right: 25px;
    cursor: pointer;
    display: none;
}

/* Sortable tables */
.sortable {
    text-decoration: underline;
    font-weight: bold;
    cursor: pointer;
}

/* SD - 23/07/2015 - idem displayNone !!!! */
.display {
    display: none;
}

.loadAjax {
    position: fixed;
    background-color: #777;
    z-index: 2147483647 !important;
    opacity: 0.8;
    overflow: hidden;
    text-align: center;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    padding-top: 20%;
}


.borderBottom {
    border-bottom: 1px solid #B3B3B3;
}

/*----------------------*/
/* Generateur Catalogue */
/*----------------------*/
#PopupCatalogue {
    position: absolute;
    top: 25%;
    left: 45%;
    z-index: 10000;
}




#div_datapager {
    display: block;
    text-align: center;
    margin-bottom: 10px;
}

.dp_page_select, .dp_page_unselect, .dp_precedent, .dp_suivant {
    padding-top: 3px;
    padding-bottom: 3px;
    padding-left: 6px;
    padding-right: 6px;
    border-style: solid;
    border-width: 1px;
}

.dp_precedent {
    float: left;
    margin-left: 10px;
    margin-top: -3px;
}

.dp_suivant {
    float: right;
    margin-right: 10px;
    margin-top: -3px;
}

.aspNetDisabled {
    color: #B3B3B3;
}

#div_bouton_action {
    padding-left: 10px;
}

/* fin Recherche d'adresse */
/*------------------------*/

/*----------------*/
/* Animation SMS */
/*----------------*/

/* Sets up our marquee, and inner content */
.page_body--message {
    overflow: hidden;
    position: relative;
    padding-left: 100%;
    /* Some browsers may require -webkit-animation */
    animation: reduce 20s linear infinite;
}

.page_body--message--texte {
    white-space: nowrap;
    display: inline-block;
    /* Some browsers may require -webkit-animation */
    animation: scroll 20s linear infinite;
    /*position: relative;*/
    /*left: -50%;*/
}

/* Creates two white-to-transparent gradients at the ends of the marquee */
.page_body--message::before, .page_body--message::after {
    z-index: 1;
    top: 0;
    left: 0;
    position: absolute;
    width: 50px;
    height: 100%;
    content: "";
    display: block;
    background: linear-gradient( to right, white, transparent );
}

.page_body--message::after {
    left: auto;
    right: 0;
    transform: rotate(180deg);
}

/* Pauses the animations when we hover the marquee */
.page_body--message:hover, .page_body--message:hover .page_body--message--texte {
    /* Some browsers may require -webkit-animation-play-state */
    animation-play-state: paused;
}

/* Some browsers may require @-webkit-keyframes */
@keyframes reduce {
    to {
        padding-left: 0;
    }
}

@keyframes scroll {
    to {
        transform: translateX( -100% );
    }
}




/* Fin Animation SMS */
/*-------------------*/



/*---------------------------------------*/
/* Mise en avant des articles référencés */
/*---------------------------------------*/



/* Fin Mise en avant des articles référencés */
/*-------------------------------------------*/


/*------------*/
/* Evènements */
/*------------*/

.div_evenement img {
    max-height: 80px;
    max-width: 80px;
}


/* Fin Evènements */
/*----------------*/



/* Reliquat */
/*----------*/

#div_total_reliquat {
    position: relative;
    display: inline-block;
    width: 100%;
    margin-top: 10px;
    padding: 8px;
}

#div_content_reliquat .th_montant_reliquat, #div_content_reliquat .td_montant_reliquat {
    display: none;
}

#div_content_reliquat .img_vignette {
    width: 60px;
    height: 60px;
}


/* Fin Reliquat */
/*--------------*/


/* Informations entête Cde (Confirmation + histo cde/fac)  */
/*---------------------------------------------------------*/

.table_entete_commande tr td {
    padding: 3px 15px;
}

/* Fin Informations entête Cde */
/*-----------------------------*/

.exposant {
    display: inline-block;
    margin-top: -5px;
    font-size: .6em;
    line-height: 0em;
    vertical-align: super;
    text-decoration: none;
}


/* === PAGE ADMIN === */

.page_body {
    color: #333;
    font-size: 12px;
}

    .page_body a {
        color: #333;
    }

        .page_body a:hover {
            color: #333;
        }


.page_footer {
    font-size: 11px; /* admin */
}

.page_body .liste--header, .page_body .liste--footer {
    background-color: #2eaadd; /* admin */
    color: #ffffff; /* admin */
}

    .page_body .liste--header a, .page_body .liste--header a:hover, .page_body .liste--footer a, .page_body .liste--footer a:hover {
        color: #ffffff; /* admin */
    }

/*
.page_body--titre1 {
    color: #ffffff;
    background-color: #2eaadd;
}

.page_body--titre1::after {
    border-top: 20px solid #2eaadd;
}
*/
h2,
.page_body--titre2 {
    color: #ffffff;
    background-color: #2eaadd; /* admin */
}

    h2::after,
    .page_body--titre2::after {
        border-top: 8px solid #2eaadd; /* admin */
    }

h3,
.page_body--titre3 {
    margin-bottom: 15px;
    font-weight: bold;
    font-size: 17px;
}


/* === PAGE === */

.page {
    font-family: Arial, Verdana, sans-serif; /* admin */
    padding-top: 199px;
}


/* === BOUTONS === */

.actionBouton {
    -webkit-appearance: none;
    border: none;
    line-height: 20px;
    min-width: 90px;
    min-height: 20px;
    margin-top: 8px;
    padding: 4px 8px;
    text-align: center;
    display: inline-block;
    border-radius: 3px;
    transition: all 0.5s ease;
    padding: 5px 10px;
    font-weight: normal;
    color: #ffffff;
    background-color: #cccccc; /* admin */
}

.page a.actionBouton {
    color: #ffffff;
    text-decoration: none;
    font-weight: normal;
}

.page span.actionBouton {
    display: inline-block;
}

.actionBouton:hover {
    border: none;
    cursor: pointer;
    text-decoration: none;
    /*background-color: #2eaadd;*/ /* admin */
    opacity: 0.75;
}

.page a.actionBouton:hover {
    color: #ffffff;
    text-decoration: none;
    font-weight: normal;
}

.actionBouton.actionBouton--modifier-quantite {
    line-height: 26px;
    min-width: 25px;
    height: 25px;
    background-color: transparent;
    border: 0.5px solid #949494;
    padding: 0;
    margin-top: 0px;
    margin-left: 2px;
    margin-right: 2px;
    background-color: #fff;
    font-size: 16px;
    vertical-align: bottom;
    color: #333333;
}

    .actionBouton.actionBouton--modifier-quantite:hover {
        font-weight: bold;
    }

.actionBouton--afficher_plus_liste {
    padding-right: 100px;
    padding-left: 100px;
}


/* === PAGE NAVIGATION === */

.page_navigation {
    float: left;
    font-size: 16px;
    font-weight: bold;
    width: 200px;
    border-right: 1px solid #cccccc;
    padding-right: 30px;
    margin-right: 30px;
}

    .page_navigation > ul {
        display: flex;
        flex-direction: column;
    }

        .page_navigation > ul > li {
            /*background-image: url("../_client/images/icon-client-puce_navigation.png");*/
            /*background-repeat: no-repeat;*/
            /*background-position: 52px center;*/
            line-height: 23px;
        }

    .page_navigation ul li a:hover {
        text-decoration: none;
    }

.page_navigation--label {
    display: inline-block;
    margin: 10px 0;
}


/* === PAGE HEADER === */

.page_header {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 5900;
    webkit-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
    box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.3);
    border: none;
    height: 213px;
    background-color: #ffffff; /* admin */
    color: #333; /* admin */
}

    .page_header a {
        color: #333; /* admin */
    }

        .page_header a:hover {
            color: #333; /* admin */
        }

.page_header--logo {
    float: left;
    margin-top: 20px;
    margin-left: 20px;
    min-height: 100px;
}

    .page_header--logo img {
        max-height: 100px;
    }


/* === CARTOUCHE CLIENT === */

.page_header--cartouche_client {
    z-index: 9200;
    position: fixed;
    right: 30px;
    top: 5px;
    border-bottom: solid 1px #cccccc;
    text-align: left;
    width: 560px;
}

.cartouche_anonyme {
    text-align: right;
    font-size: 1.5em;
    padding: 5px 0;
}

.cartouche_anonyme {
    text-align: right;
    font-size: 1.5em;
    padding: 5px 0;
}

.cartouche_anonyme a:hover {
    text-decoration: none;
}

.cartouche_anonyme--utilisateur > a::before {
    display: inline-block;
    height: 25px;
    margin-right: 8px;
    font-family: Awesome-solid;
    font-size: 20px;
    content: "\f007";
}

.cartouche_client--utilisateur {
    width: 295px;
    float: left;
}

.cartouche_client--panier {
    width: 265px;
    float: left;
}


/* - Titres - */
.cartouche_client--titre {
    width: 100%;
    padding: 4px 4px 2px 4px;
    text-transform: uppercase;
    font-weight: bold;
}

.cartouche_client--titre, 
.cartouche_client--titre a {
    font-size: 13px;
}

.cartouche_client--titre {
    position: relative;
    display: inline-block;
    line-height: 24px;
}

.cartouche_client--utilisateur--titre > a {
    display: inline-block;
    padding-top: 4px;
}

.cartouche_client--panier--titre {
    cursor: pointer;
}

.cartouche_client--panier--titre > span {
    display: inline-block;
    padding-top: 4px;
    width: 208px;
}

.cartouche_client--utilisateur--titre .icon {
    float: left;
    display: inline-block;
    height: 24px;
    width: 36px;
    /*background-image: url('data: image/svg+xml, <svg fill="333" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path d="M166.51,95.05h-5a34.28,34.28,0,1,1-10-24.24,34.15,34.15,0,0,1,10,24.24h10a44.27,44.27,0,1,0-13,31.31,44.16,44.16,0,0,0,13-31.31Z"/><path d="M47.24,189.3h-5v24.78H213.76V189.3a50.71,50.71,0,0,0-13.5-34.74,46.59,46.59,0,0,0-14.77-10.63A44.22,44.22,0,0,0,167.28,140h-1.94L150.7,148.3a46.17,46.17,0,0,1-45.52.16L90,140h-1.3a44.22,44.22,0,0,0-18.21,3.92C53.76,151.51,42.25,169,42.24,189.3h10A40.65,40.65,0,0,1,63,161.4a36.41,36.41,0,0,1,11.59-8.35,34,34,0,0,1,14.09-3v-5l-2.44,4.37,14,7.81a56.16,56.16,0,0,0,55.32-.19l13.49-7.64L166.66,145v5h.62a34,34,0,0,1,14.09,3c13,5.86,22.4,19.81,22.39,36.25v14.78H52.24V189.3Z"/></svg>');*/
    background-image: url('data: image/svg+xml, <svg fill="333" id="svg-utilisateurr" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 175.4 167.27"><path d="M126.21,46.62h-5a34.28,34.28,0,1,1-10-24.24,34.13,34.13,0,0,1,10,24.24h10a44.28,44.28,0,1,0-13,31.3,44.13,44.13,0,0,0,13-31.3Z"/><path d="M6.94,140.86h-5v24.79H173.46V140.86A50.7,50.7,0,0,0,160,106.13,46.43,46.43,0,0,0,145.19,95.5,44.23,44.23,0,0,0,127,91.57H125l-14.63,8.29a46.12,46.12,0,0,1-45.53.16L49.72,91.57h-1.3A44.23,44.23,0,0,0,30.21,95.5C13.46,103.08,2,120.61,1.94,140.86h10A40.74,40.74,0,0,1,22.74,113a36.57,36.57,0,0,1,11.59-8.35,34.2,34.2,0,0,1,14.09-3v-5L46,100.94l14,7.82a56.12,56.12,0,0,0,55.32-.2l13.49-7.63-2.46-4.36v5H127a34.2,34.2,0,0,1,14.09,3c13,5.87,22.4,19.82,22.39,36.25v14.79H11.94V140.86Z"/></svg>');
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center center;
}

.cartouche_client--panier--titre .icon {
    float: left;
    display: inline-block;
    height: 24px;
    width: 36px;
    /*background-image: url('data: image/svg+xml, <svg fill="333" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256"><path d="M23.62,52.05H47.67a1.29,1.29,0,0,1,.82.31,1.61,1.61,0,0,1,.55.92h0l27,121.6A9.28,9.28,0,0,0,79.13,180a8.94,8.94,0,0,0,5.67,2H194.21a4.5,4.5,0,0,0,0-9H84.8v.13l0-.12h0v.13l0-.12,0,0,0,0h0l0,0,0,0-.06-.12-27-121.6h0a10.64,10.64,0,0,0-3.61-5.91,10.27,10.27,0,0,0-6.55-2.37h-24a4.5,4.5,0,0,0,0,9Z"/><path d="M195.23,150.86v-4.5H79.66l-15-65.63H209.12a1.75,1.75,0,0,1,1.23.46,1.1,1.1,0,0,1,.38.79l0,.21-12.62,62.09h0a2.44,2.44,0,0,1-.91,1.43,3.22,3.22,0,0,1-2,.65v9a12.17,12.17,0,0,0,7.48-2.56,11.38,11.38,0,0,0,4.2-6.72L219.53,84h0a10.33,10.33,0,0,0,.2-2,10.08,10.08,0,0,0-3.16-7.29,10.7,10.7,0,0,0-7.45-3H53.31l19.18,83.63H195.23Z"/><path d="M193.55,195h-4.5a8,8,0,0,1-2.34,5.63,8,8,0,0,1-11.26-11.26,8,8,0,0,1,13.6,5.63h9a17,17,0,1,0-5,12,17,17,0,0,0,5-12Z"/><path d="M104.58,195h-4.5a8,8,0,1,1-2.34-5.63,7.94,7.94,0,0,1,2.34,5.63h9a17,17,0,1,0-5,12,16.93,16.93,0,0,0,5-12Z"/></svg>');*/
    background-image: url('data: image/svg+xml, <svg fill="333" id="svg-panier" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 206.9 175.31"><path d="M7.31,13H31.36a1.24,1.24,0,0,1,.82.3,1.66,1.66,0,0,1,.55.93h0l27,121.59a9.13,9.13,0,0,0,3.12,5.11A9,9,0,0,0,68.49,143H177.9a4.5,4.5,0,0,0,0-9H68.49v.13l0-.13h0v.13l0-.13v0l0,0h0v0l0,0-.06-.11-27-121.6h0a10.69,10.69,0,0,0-3.61-5.92A10.31,10.31,0,0,0,31.36,4h-24a4.5,4.5,0,0,0,0,9Z"/><path d="M178.91,111.81v-4.5H63.34l-15-65.63H192.8a1.76,1.76,0,0,1,1.24.46,1.14,1.14,0,0,1,.37.8l0,.2-12.61,62.1h0a2.42,2.42,0,0,1-.92,1.42,3.17,3.17,0,0,1-2,.65v9a12.17,12.17,0,0,0,7.49-2.55,11.43,11.43,0,0,0,4.2-6.73l12.61-62.1h0a9.6,9.6,0,0,0,.2-2,10.09,10.09,0,0,0-3.15-7.3,10.77,10.77,0,0,0-7.46-3H37l19.17,83.63H178.91Z"/><path d="M177.23,155.9h-4.5a8,8,0,1,1-2.33-5.63,7.89,7.89,0,0,1,2.33,5.63h9a17,17,0,1,0-5,12,16.89,16.89,0,0,0,5-12Z"/><path d="M88.26,155.92h-4.5a8,8,0,1,1-2.33-5.63,7.91,7.91,0,0,1,2.33,5.63h9a17,17,0,1,0-5,12,16.89,16.89,0,0,0,5-12Z"/></svg>');
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: center center;
}

.cartouche_client--panier--titre .icon-ouvrir {
    display: inline-block;
}

.cartouche_client--panier--titre .icon-ouvrir::before {
    display: inline-block;
    font-family: Awesome-solid;
    font-size: 20px;
    text-align: center;
    content: "\f0d7";
    line-height: 26px;
}

.cartouche_client--content {
    overflow: hidden;
    white-space: nowrap;
}

.cartouche_client--utilisateur .cartouche_client--content {
    padding-left: 44px;
}

.cartouche_client--panier .cartouche_client--content {
    padding-left: 15px;
    margin-top: 3px;
}

.cartouche_client--content, 
.cartouche_client--content a {
    font-size: 12.5px;
}

.cartouche_client--content--deconnexion {
    padding-left: 20px;
}



/* - Filtre client - */

.cartouche_client--client .cartouche--filtre_client {
    /*
    position: fixed;
    right: 290px;
    width: 260px;
    top: 15px;
        */
    display: inline-block;
    float: left;
    width: calc(100% - 36px);

}

    .cartouche_client--client .cartouche--filtre_client > span > input {
        font-weight: bold !important;
    }

    .cartouche_client--client .cartouche--filtre_client .rcbInner {
        border: none;
        padding: 4px 0px 0px 0px;
        line-height: 24px;
    }

        .cartouche_client--client .cartouche--filtre_client .rcbInner .rcbActionButton {
            padding-top: 2px;
        }

        .cartouche_client--client .cartouche--filtre_client .rcbInput {
            cursor: pointer;
            font-size: 13px;
            font-family: Arial, Verdana, sans-serif !important;
            width: 100%;
        }


    .cartouche_client--client .cartouche--filtre_client .rcbInner .rcbActionButton .p-icon:before {
        cursor: pointer;
        display: inline-block;
        font-family: Awesome-solid;
        font-size: 20px;
        text-align: center;
        content: "\f0d7";
        /*margin-top: -8px;*/
        line-height: 24px;
    }

.cartouche_client--client .cartouche--filtre_client .rcbDisabled {
    background-color: transparent;
    opacity: 1;
}

.cartouche_client--client .cartouche--filtre_client .rcbDisabled .rcbActionButton {
    display: none;
}

.cartouche--fitre_client--drop_down {
    z-index: 10000 !important;
    position: fixed !important;
    top: 35px !important;
}

.cartouche--fitre_client--drop_down .rcbItem {
    cursor: pointer;
}

.cartouche--fitre_client--drop_down .rcbItem:hover {
    background-color: #efefef;
}

.cartouche--fitre_client--drop_down .rcbItem > span:not(:first-child) {
    font-weight: normal;
    font-size: 11px;
    color: #777;
}

.cartouche--fitre_client--drop_down .select_filtre--item_panier > span {
    margin-left: 15px;
    opacity: 1;
    color: #F22CB3;
}

.cartouche_client--panier--titre #span_nb_paniers_encours {
    display: inline-block;
    width: calc(100% - 60px);
    font-weight: bold;
}


/* - Popup - */
.cartouche_client--panier--popup {
    z-index: 9200;
    position: absolute;
    top: 30px;
    width: 284px;
    padding: 0;
    margin-top: 5px;
    text-align: left;
    display: none;
    border: 1px solid #949494;
    max-height: calc(100vh - 80px);
    overflow: auto;
    background-color: #ffffff;
    color: #3e3135;
}


.cartouche_client--panier--popup--liste_paniers li {
    padding: 5px;
}

.cartouche_client--panier--popup--liste_paniers li:nth-child(odd) {
    background-color: #ebebeb;
}

.cartouche_client--panier--popup--liste_paniers li:nth-child(even) {
    background-color: #ffffff;
}

.cartouche_client--panier--popup--liste_paniers li input {
    margin-top: 8px;
    margin-left: 5px;
    margin-right: 5px;
}


.cartouche_client--panier--popup ul li label {
    max-width: 228px;
    white-space: nowrap;
    overflow: hidden;
}

.cartouche_client--panier--popup ul li label:first-child {
    font-size: 12px;
}

.cartouche_client--panier--popup ul li label:nth-child(2n+2) {
    font-size: 11px;
}

.cartouche_client--panier--popup--button {
    padding: 10px;
    background-color: #ffffff;
}

.cartouche_client--panier--popup--button .actionBouton {
    display: block;
    width: 100%;
    padding: 0;
    border-radius: 0px;
    height: 25px;
    line-height: 25px;
}

.cartouche_client--panier--popup--button, 
.cartouche_client--panier--popup--button a {
    color: #ffffff;
}


.cartouche_client--panier--popup--button--panier {
    background-color: #19a992;
    margin-top: 0px;
}

.cartouche_client--panier--popup--button--liste.actionBouton {
    background-color: #2c9acb;
    font-size: 13px;
}


/* === RECHERCHE === */

.page_header--search {
    z-index: 9100;
    position: absolute;
    right: 30px;
    top: 75px;
    width: 435px;
}

.control_search {
    text-align: left;
    background-color: #ffffff;
    border: 0.5px solid #949494;
    height: 28px;
}

.control_search--input {
    vertical-align: top;
    border: none;
    margin-top: 1px;
    margin-left: 3px;
    height: 26px;
    font-style: italic;
    opacity: 0.6;
}

.control_search--button {
    cursor: pointer;
    float: right;
    line-height: 28px;
    background-color: #2eaadd;
    color: #ffffff;
}

    .control_search--button::before {
        width: 28px;
        height: 28px;
        display: inline-block;
        font-family: Awesome-solid;
        font-size: 16px;
        text-align: center;
        content: "\f002";
    }



.page_header--search .control_search {
    width: 434px;
}

.page_header--search .control_search--input {
    width: 395px;
}


/* === MENU === */

.page_header--menu #li_menu_reliquat,
.page_header--menu #li_menu_client_reliquat {
    display: none;
}

.page_header--menu {
    position: fixed;
    right: 10px;
    top: 119px;
    text-align: center;
    text-decoration: none;
}

    .page_header--menu a {
        text-decoration: none;
    }

/*
    .page_header--menu #li_menu_information {
        display: none;
    }
*/

.page_header--menu--item {
    display: inline-block;
    padding-bottom: 5px;
    margin: 0 5px 0 5px;
    border: 5px solid transparent;
    border-bottom-color: #ebebeb;
    border-bottom-width: 5px;
    border-bottom-style: solid;
}

    .page_header--menu--item_actif, .page_header--menu--item:hover {
        border-bottom-color: #2eaadd; /* admin */
        border-bottom-width: 5px;
        border-bottom-style: solid;
    }


/* === MENU FAMILLE === */

.page_header--navigation_famille .li_menu_web {
    /*display: none;*/
}

.page_header--navigation_famille {
    position: absolute;
    top: 150px;
    left: 50%;
    transform: translateX(-50%);
    /*background-color: transparent;*/
    text-align: center;
    width: 100%;
}


/* === FIL ARIANE === */

.fil_ariane {
    padding-top: 2px;
    height: 26px;
    vertical-align: middle;
    background-color: #ffffff;
    display: block;
    overflow: hidden;
}

.fil_ariane--item a {
    text-decoration: none;
}

    .fil_ariane--item a:hover {
        text-decoration: none;
    }

.fil_ariane--item {
    display: inline-block;
    padding-left: 10px;
    line-height: 25px;
    text-align: left;
    float: left;
}

.fil_ariane--item_accueil a {
    color: #000000;
}

    .fil_ariane--item_accueil a::before {
        display: inline-block;
        width: 48px;
        font-family: Awesome-solid;
        font-size: 18px;
        text-align: center;
        content: "\f015";
    }



/* === TITRE 1 === */

h1,
.page_body--titre1 {
    font-size: 32px;
    text-align: center;
    line-height: 86px;
    height: 86px;
    vertical-align: middle;
    margin-bottom: 40px;
    position: relative;
}

/*
.page_body--titre1::before {
    content: '';
    position: absolute;
    top: 50%;
    width: 100px;
    height: 2px;
    margin-top: 1px;
    margin-left: -115px;
    background-color: #2eaadd;
}


.page_body--titre1::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 100px;
    height: 2px;
    margin-top: 0px;
    margin-left: 15px;
    background-color: #2eaadd;
}*/


/*
.page_body--titre1 {
    color: #ffffff;
    font-size: 32px;
    text-align: center;
    line-height: 86px;
    height: 86px;
    vertical-align: middle;
    margin-bottom: 40px;
    position: relative;
    background-color: #2eaadd;
}

.page_body--titre1 span {
    display: inline-block;
}

.page_body--titre1::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%);
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-top: 20px solid transparent;
    clear: both;
    border-top: 20px solid #2eaadd; 
}
*/

/* === TITRE 2 === */

h2,
.page_body--titre2 {
    color: #ffffff; /* admin */
    font-size: 14px; /* admin */
    text-align: center;
    line-height: 30px;
    margin-bottom: 20px;
    position: relative;
    background-color: #2eaadd; /* admin */
    /* text-transform: uppercase; */
}

/*
.page_body--titre2::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 8px solid #2eaadd;
}
*/


/* === PAGE NAVIGATION === */

.page_navigation {
    float: left;
}


/* === PAGE BODY === */

.page_body {
    position: relative;
    min-width: 420px;
    min-height: calc(100vh - 414px);
    color: #333; /* admin */
    font-size: 12px; /* admin */
    padding-bottom: 50px;
}

    .page_body a {
        color: #333; /* admin */
    }

        .page_body a:hover {
            color: #333; /* admin */
        }

.page_body--content {
    overflow: hidden;
    max-width: 1540px;
    margin: auto;
}

.page_body--content_adm {
    max-width: 90% !important;
}

/* - Options - */
.page_body--content--options {
    overflow: hidden;
    width: 260px;
    float: left;
    padding-right: 10px;
    margin-right: 20px;
    margin-top: 50px;
}

.page_body--content--options--item {
    display: block;
    margin-bottom: 15px;
}

/* - Affichage - */
.page_body--content--affichage {
    overflow: hidden;
    display: inline-block;
    text-align: right;
    padding: 8px;
    float: right;
}

    .page_body--content--affichage > div {
        display: inline-table;
    }

.page_body--content--affichage--libelle {
    display: table-cell;
    vertical-align: middle;
    padding-left: 30px;
    padding-right: 5px;
}

.page_body--content--affichage--icon {
    display: inline-flex;
    vertical-align: middle;
}

    .page_body--content--affichage--icon img,
    .page_body--content--affichage--icon input,
    .page_body--content--affichage .rtsImg {
        margin: 0 5px;
    }


/* - Actions - */
.page_body--content--actions {
    overflow: hidden;
    display: block;
    text-align: right;
}

.page_body--content--actions--libelle {
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
}

.page_body--content--detail {
    overflow: hidden;
    /*width: 100%;*/
    text-align: center;
}


/* === PAGE FOOTER === */

.page_footer {
    width: 100%;
    height: 154px;
    padding: 20px 0 0 0;
    text-align: center;
    font-size: 11px; /* admin */
    background-color: #2eaadd; /* admin */
    color: #ffffff; /* admin */
}

.page_footer--content {
    display: inline-block;
}

.page_footer--content--item {
    float: left;
    width: 240px;
    text-align: left;
    margin-right: 20px;
    margin-left: 20px;
    border-right: 0.5px solid #ffffff; /* admin */
}

    .page_footer--content--item:last-child {
        border-right: none;
    }

.page_footer--titre1,
.page_footer .infos_societe--nom {
    font-size: 14px; /* admin */
    font-weight: bold;
    margin-bottom: 5px;
}

.page_footer a {
    color: #fff; /* admin */
    text-decoration: none;
}

    .page_footer a:hover {
        color: #fff; /* admin */
    }


.page_footer--links {
    display: inline-block;
    width: 100%;
    text-align: center;
}

.page_footer--links--mentions_legales {
    display: none;
}

.page_footer--assistant {
    display: none;
    z-index: 9000;
}


/*- Réseaux sociaux -*/
.page_footer--a_icon span {
    font-family: Awesome-solid;
    font-size: 20px;
    display: inline-block;
    font-family: Awesome-solid;
    font-size: 36px;
    text-align: center;
}



.page_footer--a_icon .facebook-icon::before {
    content: "\f39e";
    background: transparent url(../image/media-facebook.png) no-repeat center center;
}

.social-links .twitter-icon::before {
    content: "\f099";
    background: transparent url(../image/media-twitter.png) no-repeat center center;
}

.social-links .pinterest-icon::before {
    content: "\f0d2";
    background: transparent url(../image/media-pinterest.png) no-repeat center center;
}

.social-links .googleplus-icon::before {
    content: "\f2b3";
    background: transparent url(../image/media-googleplus.png) no-repeat center center;
}

.social-links .instagram-icon::before {
    content: "\f16d";
    background: transparent url(../image/media-instagram.png) no-repeat center center;
}

.social-links .youtube-icon::before {
    content: "\f167";
    background: transparent url(../image/media-youtube.png) no-repeat center center;
}





/* === TUILES CLASSIFICATION === */

.vignettes_classification {
    width: 100%;
    text-align: center;
    margin: 0 auto;
    flex-wrap: wrap;
    justify-content: space-between;
}

.vignettes_classification--item {
    display: inline-block;
    overflow: hidden;
    max-width: 580px;
    margin: 15px 20px;
}

.vignettes_classification--item--tuile {
    border: solid 1px #ebebeb;
}

    .vignettes_classification--item--tuile:hover {
        border: solid 1px #cccccc;
        opacity: 0.75;
    }

    .vignettes_classification--item--tuile img {
        width: 100%;
    }

.vignettes_classification--item--libelle {
    padding: 3px 0px;
    font-weight: bold;
}


/* === SAISIE QUANTITE ===  */

.span_saisie_quantite,
.span_saisie_quantite_readonly {
    display: inline-block;
    white-space: nowrap;
}

    .span_saisie_quantite input[type=text],
    .span_saisie_quantite_readonly input[type=text] {
        font-size: 1.1em;
        font-weight: bold;
        text-align: center;
        text-indent: 0px;
        width: 36px;
    }


/* === ALERTE STOCK ===  */

.span_alerte_stock {
    display: inline-block;
    white-space: nowrap;
}


/* === INDICATEURS === */

.indicateurs_article--item {
    overflow: hidden;
    text-align: center;
    border: solid 0.5px transparent;
    color: #ffffff;
    cursor: pointer;
}

.indicateurs_article--item--deja_commande {
    background-color: #4285f4;
}

.indicateurs_article--item--referencement {
    background-color: #fdb813;
}

.indicateurs_article--item--reliquat {
    background-color: #e24395;
}

.indicateurs_article--item--panier {
    background-color: #f36557;
}

.catalogue_vignette .indicateurs_article {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0px;
    z-index: 10;
}

.catalogue_vignette .indicateurs_article--item {
    padding: 0;
    margin: 0;
    margin-bottom: 5px;
    height: 24px;
    line-height: 24px;
    width: 24px;
    border-radius: 12px;
}

.catalogue_vignette .indicateurs_article--item--referencement {
    font-size: 20px;
    line-height: 22px;
}

.catalogue_vignette .indicateurs_article--item--reliquat {
    font-size: 13px;
}

.catalogue_vignette .indicateurs_article--item--panier {
    font-size: 13px;
}


/* === CATALOGUE LISTE === */

.liste_article .indicateurs_article {
    position: absolute;
    top: 3px;
    right: 10px;
    z-index: 10;
}

.liste_article .indicateurs_article--item {
    padding: 0;
    margin: 0;
    margin-top: 4px;
    height: 20px;
    line-height: 20px;
    width: 20px;
    border-radius: 10px;
}

table.liste_article .indicateurs_article--item--referencement {
    font-size: 17px;
    line-height: 18px;
}

table.liste_article .indicateurs_article--item--reliquat {
    font-size: 11px;
}

table.liste_article .indicateurs_article--item--panier {
    font-size: 11px;
}


/* === CATALOGUE VIGNETTE === */

.catalogue_vignette {
    box-sizing: content-box;
    position: relative;
    display: inline-block;
    vertical-align: top;
    text-align: left;
    margin: 10px 10px;
    padding: 10px 10px;
    width: 268px;
    height: 295px;
    border: solid 0.5px transparent;
    border-bottom: solid 0.5px #cccccc;
    font-size: 11px;
}

    .catalogue_vignette:hover {
        border: solid 0.5px #cccccc;
        cursor: pointer;
    }

.catalogue_vignette--vignette {
    position: relative;
    height: 200px;
    width: 100%;
    left: 0;
    top: 15px;
    text-align: center;
}

    .catalogue_vignette--vignette > a {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .catalogue_vignette--vignette img {
        max-height: 200px;
        max-width: 220px;
    }

.catalogue_vignette--evenement {
    position: absolute;
    top: 8px;
    left: 8px;
    max-width: 64px;
    z-index: 15;
}

    .catalogue_vignette--evenement img {
        max-width: 64px;
        margin-bottom: 10px;
    }

.catalogue_vignette--informations {
    z-index: 1;
    position: relative;
    padding-top: 8px;
    overflow: hidden;
    transition: .5s ease;
    height: 40px;
}

.catalogue_vignette:hover .catalogue_vignette--informations {
    margin-top: -40px;
    height: auto;
}

.catalogue_vignette .catalogue_vignette--informations .li_gencod,
.catalogue_vignette .catalogue_vignette--informations .li_pcb {
    opacity: 0;
}

.catalogue_vignette:hover .catalogue_vignette--informations .li_gencod,
.catalogue_vignette:hover .catalogue_vignette--informations .li_pcb {
    opacity: 1;
}

.catalogue_vignette--informations label {
    margin: 0;
}

.catalogue_vignette--informations li {
    margin: 0;
}


.catalogue_vignette--informations ul {
    display: flex;
    flex-direction: column;
    background-color: hsla(0,0%,100%,.75);
}

.catalogue_vignette--informations li {
    margin: 0px;
    line-height: 20px;
}

.catalogue_vignette--informations .li_code {
    font-weight: bold;
}

.catalogue_vignette--informations .li_libelle {
    white-space: nowrap;
}

.catalogue_vignette--informations span {
    /*float: right;*/
}

/* - Coloris - */
.catalogue_vignette--coloris {
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 14px;
    font-weight: bold;
}

/* - Stock - */
.catalogue_vignette--stock {
    z-index: 2;
    position: absolute;
    bottom: 5px;
    left: 10px;
    /*background-color: hsla(0,0%,100%,.75);*/
    font-size: 13px;
    font-weight: bold;
}

/* - Prix - */
.catalogue_vignette--prix {
    z-index: 2;
    position: absolute;
    bottom: 30px;
    left: 10px;
    width: 100%;
    font-size: 18px;
}

    .catalogue_vignette--prix ul li {
        display: block;
        float: left;
        line-height: 26px;
    }

.catalogue_vignette--prix--prix_negocie {
    /*font-weight: bold;*/
}

.catalogue_vignette--prix--prix_brut {
    margin-left: 15px;
    text-decoration: line-through;
    font-size: 0.8em;
    display: none;
}

.catalogue_vignette--prix--remise {
    position: absolute;
    top: -250px;
    right: 30px;
    font-size: 13px;
    background-color: #f36557;
    color: #ffffff;
    width: 50px;
    height: 50px;
    text-align: center;
    vertical-align: middle;
    padding: 0;
    line-height: 50px !important;
    border-radius: 50px;
    display: none;
}

.catalogue_vignette--palier {
    z-index: 10;
    position: absolute;
    top: 10px;
    right: 80px;
}

    .catalogue_vignette--palier li {
        font-size: 13px;
        background-color: #e68938;
        color: #ffffff;
        width: 50px;
        height: 50px;
        text-align: center;
        vertical-align: middle;
        padding: 0;
        line-height: 50px !important;
        border-radius: 50px;
        cursor: pointer;
    }

.catalogue_vignette--prix .exposant {
    display: inline-block;
    text-decoration: none;
}

.catalogue_vignette--action {
    z-index: 2;
    position: absolute;
    bottom: 5px;
    right: 5px;
}

.catalogue_vignette--prix img[id*="ajoutPanier_"] {
    display: inline-block;
    margin-left: 15px;
    margin-top: -5px;
}

.catalogue_vignette--montant_ligne {
    z-index: 2;
    position: absolute;
    bottom: -21px;
    right: 10px;
    font-size: 0.8em;
}

    .catalogue_vignette--montant_ligne label {
        float: left;
        padding-right: 3px;
    }

    .catalogue_vignette--montant_ligne span {
        float: right;
    }

.catalogue_vignette--code {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: auto;
    margin-right: auto;
}


.catalogue_vignette .li_derniere_facture,
.catalogue_vignette .li_quantite_totale_facture,
.catalogue_vignette .li_montant_total_facture {
    display: none;
}

.catalogue_vignette .li_marque {
    font-weight: bold;
    display: none;
}

.catalogue_vignette .li_stock_referencement {
    display: none;
}

.infos_article--description #li_stock_referencement {
    display: none;
}

.catalogue_vignette .catalogue_vignette--coloris {
    display: none;
}



/* - Flip vignette - */
.catalogue_vignette--vignette {
    position: relative;
    z-index: 1;
}

.vignette--carte {
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: all 0.5s linear;
}

.catalogue_vignette--vignette:hover .vignette--carte {
    transform: rotateY(180deg);
}

.vignette--carte--front {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
}

.vignette--carte--back {
    display: block;
    transform: rotateY(180deg);
    backface-visibility: hidden;
}


/* === LISTE CATALOGUE === */

.liste {
    border-collapse: collapse;
    border-spacing: 0;
    font-size: 11px;
    margin: 15px auto 10px auto;
    width: 100%;
}

.liste--empty_data {
    clear: both;
    display: block;
    width: 100%;
    text-align: center;
    margin: 25px 0;
}

    .liste--empty_data label {
        font-size: 20px;
        font-weight: bold;
    }

.liste--header th, .liste--footer td {
    padding: 8px 6px;
    text-align: center;
    font-weight: bold;
}


.liste--group span,
.liste--group td {
    text-align: left;
    padding-right: 0;
    height: 36px;
    /*line-height: 36px;*/
    font-size: 12px;
    font-weight: bold;
}

.liste_article--group {
    border-top: solid 3px #000000;
}


.liste--body--item {
    min-height: 34px;
}

.liste--body--item--alternate {
    background-color: #f7f7f7;
}

.liste--body--item--deleted {
    opacity: 0.4;
}

.liste--body--item td {
    padding: 8px 5px;
    text-align: center;
}

.liste--body td > input {
    vertical-align: middle;
}

.liste--body > .actionBouton {
    margin-top: 0;
}

.liste_article .td_evenement {
    width: 48px;
}

    .liste_article .td_evenement img {
        max-width: 48px;
        max-height: 48px;
    }

.liste_article .td_vignette {
    position: relative;
    width: 75px;
    height: 75px;
    padding-right: 30px;
}

    .liste_article .td_vignette img {
        max-height: 75px;
        max-width: 75px;
    }

.liste_article .td_coloris {
    font-size: 14px;
    font-weight: bold;
}

.liste_article .td_informations {
    text-align: left;
}

.liste_article .td_informations--code {
    font-weight: bold;
}

.liste_article .td_informations--taxes li {
    float: left;
    margin-top: 5px;
    font-size: 0.8em;
}

.liste_article .td_pcb {
    font-weight: bold;
}

/* - Prix - */
.liste_article .td_prix {
    font-size: 12px;
    font-weight: bold;
}

    .liste_article .td_prix ul li {
        margin: 1px auto;
    }

.liste_article .td_prix--prix_negocie {
    display: block;
    font-weight: bold;
}

.liste_article .td_prix--prix_brut {
    text-decoration: line-through;
    font-size: 0.8em;
    /*display: none;*/
}

.liste_article .td_prix--remise {
    font-size: 0.8em;
    max-width: 45px;
    background-color: #f36557;
    color: #ffffff;
    padding: 2px 4px;
    /*display: none;*/
}

.liste_article .td_palier li {
    max-width: 45px;
    background-color: #e68938;
    color: #ffffff;
    padding: 2px 4px;
    cursor: pointer;
}

.liste_article .td_prix .td_prix--taxes {
    font-weight: normal;
    font-size: 0.8em;
    margin-top: 3px;
    display: none;
}

.liste_article .td_quantite {
    max-width: 200px;
    margin: 0 auto;
}

.liste_article .td_taxe {
    max-width: 200px;
    margin: 0 auto;
}

.liste_article .td_taxe {
    max-width: 200px;
    margin: 0 auto;
}


.liste_article .th_taxe,
.liste_article .td_taxe,
.liste_article .tf_taxe,
.liste_article .th_montant_total_ligne,
.liste_article .td_montant_total_ligne,
.liste_article .tf_montant_total_ligne,
.liste_article .th_montant_total_livrable,
.liste_article .td_montant_total_livrable,
.liste_article .tf_montant_total_livrable {
    display: none;
}

.liste_article .th_derniere_facture,
.liste_article .th_quantite_totale_facture,
.liste_article .th_montant_total_facture,
.liste_article .td_derniere_facture,
.liste_article .td_quantite_totale_facture,
.liste_article .td_montant_total_facture,
.liste_article .tf_derniere_facture,
.liste_article .tf_quantite_totale_facture,
.liste_article .tf_montant_total_facture {
    display: none;
}

.th_stock_referencement, .td_stock_referencement, .tf_stock_referencement,
.th_coloris, .td_coloris, .tf_coloris,
.th_palier, .td_palier, .tf_palier {
    display: none;
}

.liste_article .td_commentaire_ligne--input {
    width: calc(100% - 160px);
    margin-left: 10px;
}

.liste--group .liste--group--regroupement--quantite,
.liste--group .liste--group2--regroupement--quantite,
.liste--group .liste--group--regroupement--montant,
.liste--group .liste--group2--regroupement--montant,
.liste--group .liste--group--regroupement--montant_total,
.liste--group .liste--group2--regroupement--montant_total {
    text-align: center;
}

/* === CARNET COMMANDE GRID */

.grid--header {
    text-align: center !important;
}

.grid--line_string {
    text-align: left !important;
}

.grid--line_num {
    text-align: center !important;
}

.grid--footer_bold {
    text-align: center;
    font-weight: bold;
}

/* === PAGER LISTE === */

.page_body--content--pager_liste {
    display: inline-block;
    width: 100%;
    overflow: hidden;
}

    .page_body--content--pager_liste span {
        display: inline-block;
    }

.page_body--content--pager_liste--haut {
    margin: 20px 0;
    display: none;
}

.page_body--content--pager_liste--bas {
    margin: 20px 0 10px 0;
}

.page_body--content--pager_liste--infos {
    margin: 0 0 10px 0;
}

.page_body--content--pager_liste a, .pager_liste--current, .pager_liste--last {
    text-decoration: none;
    font-weight: bold;
    float: left;
    line-height: 36px;
    text-transform: uppercase;
    text-decoration: none;
    border-top: 0.5px solid #ccc;
    border-right: 0.5px solid #ccc;
    border-bottom: 0.5px solid #ccc;
    width: 36px;
}

    .page_body--content--pager_liste a:hover {
        background-color: #ddd;
    }

.pager_liste--current {
    font-size: 1.25em;
    text-decoration: underline;
}

a.pager_liste--previous {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    width: auto;
    padding: 0 16px;
    border-left: 0.5px solid #ccc;
}

a.pager_liste--next {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
    width: auto;
    padding: 0 16px;
}

.pager_liste--infos span {
    font-weight: bold;
}


/* === ETAPES COMMANDES === */

.panier_etapes--items--item,
.panier_etapes--items--item span,
.panier_etapes--items--item a {
    margin: 0;
    padding: 0;
    border: none;
    display: inline-block;
}

.panier_etapes--items {
    /*width: 1050px;*/
    padding-right: 18px;
    margin: 30px auto 35px;
    text-align: center;
}

.panier_etapes--items--item span,
.panier_etapes--items--item a {
    position: relative;
    box-sizing: border-box;
    width: 258px;
    font-size: 16px;
    height: 42px;
    padding: 10px 25px 0 40px;
    margin-right: -3px;
}

    .panier_etapes--items--item span:after,
    .panier_etapes--items--item a:after {
        content: "";
        border-top: 21px solid transparent;
        border-bottom: 21px solid transparent;
        position: absolute;
        right: -18px;
        top: 0;
        z-index: 2;
    }

    .panier_etapes--items--item span:before,
    .panier_etapes--items--item a:before {
        content: "";
        border-top: 21px solid transparent;
        border-bottom: 21px solid transparent;
        border-left: 18px solid #ffffff;
        position: absolute;
        left: 0;
        top: 0;
    }

.panier_etapes--items--item:first-child span:before,
.panier_etapes--items--item:first-child a:before {
    display: none;
}

.panier_etapes--items--item_actif span,
.panier_etapes--items--item_actif a,
.panier_etapes--items--item_actif a:hover {
    color: #ffffff;
}

.panier_etapes--items--item_avant span,
.panier_etapes--items--item_avant a {
    background: #f7f7f7;
}

    .panier_etapes--items--item_avant span:after,
    .panier_etapes--items--item_avant a:after {
        border-left: 18px solid #f7f7f7;
    }

.panier_etapes--items--item_actif span,
.panier_etapes--items--item_actif a {
    background: #2eaadd;
    color: #ffffff;
}

    .panier_etapes--items--item_actif span:after,
    .panier_etapes--items--item_actif a:after {
        border-left: 18px solid #2eaadd;
    }

.panier_etapes--items--item_apres span,
.panier_etapes--items--item_apres a {
    background: #f7f7f7;
}

    .panier_etapes--items--item_apres span:after,
    .panier_etapes--items--item_apres a:after {
        border-left: 18px solid #f7f7f7;
    }


/* === RECAP PANIER ===*/

.page_body--content--recap_panier {
    float: right;
}

    .page_body--content--recap_panier > table {
        font-size: 14px;
        width: 260px;
        float: right;
        clear: both;
        text-align: left;
    }

        .page_body--content--recap_panier > table tr td {
            padding: 9px;
        }

            .page_body--content--recap_panier > table tr td:last-child {
                text-align: right;
                background-color: #F7F7F7;
                width: 80px;
            }

    .page_body--content--recap_panier .table_totaux--recap tr:last-child,
    .page_body--content--recap_panier .table_totaux_htt--recap tr:last-child {
        background-color: #F7F7F7;
        font-size: 1.15em;
        font-weight: bold;
    }


/* === FORMULAIRES === */

.page_body--content--form {
    display: inline-block;
    padding: 20px;
    background-color: #f7f7f7;
    min-width: 280px;
}

.form--description {
    text-align: justify;
}

.form--item {
    margin-bottom: 10px;
}

.form--libelle {
    text-align: left;
}

.form--actions {
    text-align: left;
}


/* === CAROUSEL === */

.article--carousel--raccourci {
    display: none;
}

.article--carousel {
    position: relative;
    margin-bottom: 20px;
    margin-top: 50px;
    /*max-width: 1200px;*/
    max-width: 1540px;
    margin-right: auto;
    margin-left: auto;
}


.article--carousel--raccourci {
    position: absolute;
    top: 8px;
    right: 25px;
}

.article--carousel > ul {
}

.article--carousel--raccourci a {
    font-size: 14px;
    text-decoration: underline;
}



/* === CAROUSEL === */

.carousel_article {
    display: block;
    overflow: hidden;
    width: 100%;
    max-height: 100%;
}

/* - Voir tous les produits - */
.article--carousel--raccourci_catalogue {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0px;
    text-decoration: underline;
    font-size: 16px;
    z-index: 10;
}

/* - Boutons précédent/suivant - */

.article--carousel--button_prev, .article--carousel--button_next {
    position: absolute;
    top: 90px;
    height: calc(100% - 90px);
    width: 55px;
    opacity: 0.2;
}

    .article--carousel--button_prev:hover, .article--carousel--button_next:hover {
        opacity: 0.8;
    }

.article--carousel--button_prev {
    left: 0px;
    background: url(../image/icon-nav_precedent.png) no-repeat center;
}

.article--carousel--button_next {
    right: 0px;
    background: url(../image/icon-nav_suivant.png) no-repeat center;
}


/* - Vignettes - */

.article--carousel--vignettes {
    display: flex;
    justify-content: space-around;
    overflow: hidden;
    position: relative;
    max-width: calc(100% - 100px);
    margin-left: 50px;
}

.carousel_vignette {
    position: relative;
    float: left;
    text-align: center;
    display: inline-block;
    width: 24.7%;
    height: 365px;
    border: solid 0.5px transparent;
    margin: 10px 0;
    min-width: 240px;
}

    .carousel_vignette:hover {
        border: solid 0.5px #cccccc;
        cursor: pointer;
    }

.carousel_vignette--vignette {
    position: absolute;
    top: 128px;
    transform: translateY(-50%);
    left: 0px;
    right: 0px;
}

    .carousel_vignette--vignette img {
        max-height: 200px;
        max-width: 200px;
    }

.carousel_vignette--informations {
    position: absolute;
    /*top: 235px;*/
    bottom: 45px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
    text-align: left;
}

.carousel_vignette--informations--marque {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: bold;
    line-height: 20px;
}

.carousel_vignette--informations--libelle {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 17px;
    height: 34px;
    font-size: 11px;
}

    .carousel_vignette--informations--libelle a {
        overflow: hidden;
        white-space: normal;
    }

.carousel_vignette--informations--code {
    line-height: 32px;
    font-size: 13px;
}

.carousel_vignette--coloris {
    z-index: 10;
    position: absolute;
    top: 10px;
    left: 10px;
    font-size: 14px;
    font-weight: bold;
}

/* - Stock - */
.carousel_vignette--stock {
    background-color: transparent !important;
    position: absolute;
    bottom: 45px;
    right: calc(50% - 100px);
    left: auto;
    line-height: 32px;
}

/* - Prix - */

.carousel_vignette--prix {
    position: absolute;
    bottom: 12px;
    left: calc(50% - 100px);
    font-size: 16px;
}

    .carousel_vignette--prix ul {
        display: flex;
        flex-direction: column
    }

        .carousel_vignette--prix ul li {
            display: block;
            text-align: left;
            line-height: 20px;
        }

.carousel_vignette--prix--prix_unitaire,
.carousel_vignette--prix--prix_negocie {
    font-weight: bold;
}

.carousel_vignette--prix--prix_brut {
    text-decoration: line-through;
    font-size: 0.8em;
    font-weight: normal;
    display: none;
}

.carousel_vignette--prix--remise {
    position: absolute;
    left: 170px;
    top: -300px;
    padding: 0;
    font-size: 11px;
    background-color: #f36557;
    color: #ffffff;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    text-align: center !important;
    line-height: 40px !important;
    border-radius: 40px;
    display: none;
}

/* - Paliers - */

.carousel_vignette--palier {
    position: absolute;
    /*left: calc(50% - 110px);*/
    left: 170px;
    top: 12px;
}

    .carousel_vignette--palier li {
        padding: 0;
        font-size: 11px;
        background-color: #e68938;
        color: #ffffff;
        width: 40px;
        height: 40px;
        vertical-align: middle;
        text-align: center !important;
        line-height: 40px !important;
        border-radius: 40px;
        cursor: pointer;
    }

.carousel_vignette--action {
    max-width: 110px;
    position: absolute;
    right: 38px;
    bottom: 9px;
    right: calc(50% - 100px);
    left: auto;
}

.carousel_vignette--coloris {
    display: none;
}



/* === BOITE DE DIALOGUE === */

div.ui-dialog {
    border-radius: 8px;
    min-width: 400px !important;
    max-width: 480px !important;
    font-family: Calibri;
    font-size: 15px;
}

    div.ui-dialog .ui-dialog-titlebar {
        background: none;
        text-transform: uppercase;
        border: none;
        padding: 5px 40px 5px 20px;
        padding-top: 5px;
        font-size: 20px;
    }

    div.ui-dialog .ui-dialog-titlebar-close {
        border: none;
        background: none;
        background-image: url("../image/dialog-close.png");
        background-size: 14px;
        background-position: 50%;
        background-repeat: no-repeat;
        height: 30px;
        width: 30px;
        top: 50%;
        right: 5px;
        transform: translateY(-50%) !important;
        margin: 0;
    }

    div.ui-dialog .ui-dialog-content {
        padding: 25px 50px 20px 50px;
        height: auto !important;
    }

        div.ui-dialog .ui-dialog-content span {
            display: inline-block;
            width: 100%;
        }

        div.ui-dialog .ui-dialog-content .ui-icon-info {
            display: none;
        }

    div.ui-dialog .ui-dialog-buttonpane {
        border: none;
        padding: 5px 10px 10px 10px;
    }

        div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
            width: 100%;
            text-align: center;
            margin: 0 0 15px 0;
            margin: 0;
        }

            div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button {
                border: none;
                padding: 10px 40px;
                margin: 0 10px;
                background-color: #cccccc;
                color: #222;
                font-size: 13px;
                text-transform: uppercase;
            }

                div.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset button:hover {
                    opacity: 0.75;
                }


/* === POPUP === */

.popup {
    z-index: 9910;
    max-height: 90%;
    overflow: auto;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: #fff;
    box-sizing: border-box;
    padding: 45px;
    width: 670px;
    border-radius: 3px;
}

.popup--background {
    z-index: 9900;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(93,101,111,0.8);
}

.popup--content {
    border: 1px solid #9a9fa5;
    border-radius: 10px;
    background-color: #fff;
}

.popup--titre1 {
    color: #ffffff;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    line-height: 82px;
    height: 82px;
    vertical-align: middle;
    margin-bottom: 40px;
    position: relative;
    text-transform: uppercase;
    background-color: #343f4b;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    margin-bottom: 20px;
}

    .popup--titre1::after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        transform: translate(-50%);
        width: 0;
        height: 0;
        border-left: 12px solid transparent;
        border-right: 12px solid transparent;
        border-top: 12px solid transparent;
        clear: both;
        border-top: 15px solid #343f4b;
    }

.popup--titre2 {
    color: #19a992;
    font-size: 26px;
    font-weight: bold;
    text-align: center;
    line-height: 51px;
    vertical-align: middle;
    text-transform: uppercase;
    background-color: #343f4b;
}

.popup--content--form {
    padding-top: 5px;
    font-size: 16px;
}

    .popup--content--form > ul > li {
        line-height: 41px;
        border-bottom: 1px solid #9a9fa5;
        margin: 0;
        padding-left: 70px;
    }

    .popup--content--form .popup--content--form--valeur {
        display: inline-block;
        width: calc(100% - 170px);
    }

    .popup--content--form .popup--content--form--libelle {
        margin: 0;
        font-weight: bold;
        width: 140px;
    }

    .popup--content--form input[type="text"],
    .popup--content--form input[type="password"],
    .popup--content--form select {
        border: 1px solid #e1e1e1;
        color: #777;
        height: 26px;
        width: 100%;
    }

    .popup--content--form div.select_popup span.rddlInner {
        border: 1px solid #e1e1e1;
        color: #777;
        width: 296px;
        height: 18px;
    }

    .popup--content--form input[type="text"]:hover, .popup--content--form input[type="password"]:hover, .popup--content--form select:hover {
        border-color: #343f4b;
    }

    .popup--content--form input[type="text"],
    .popup--content--form input[type="password"] {
        padding-left: 2px;
    }

        .popup--content--form input[type="text"].saisie_quantite--text {
            width: 40px;
            height: auto;
        }

        .popup--content--form input[type="text"][disabled].saisie_quantite--text {
            background-color: #ffffff;
        }

.popup--content--actions {
    text-align: center;
    margin-top: 25px;
    margin-bottom: 15px;
}

    .popup--content--actions .actionBouton {
        font-size: 20px;
        font-weight: bold;
        line-height: 35px;
        width: 130px;
        margin: 0 15px;
    }



/* === LISTVIEW ADRESSE === */

.adresses--content {
    line-height: 22px;
}

.adresses--content .adresse--enseigne,
.adresses--content .adresse--raison_sociale {
    font-weight: bold;
}

.adresses--content .adresse--cp,
.adresses--content .adresse--ville {
    display: inline-block;
}


/* === POPUP ADRESSE === */

.popup_adresse {
    padding: 10px;
    width: 680px;
}


.popup_adresse--recherche {
    margin-bottom: 20px;
}

.popup_adresse .recherche--input {
    margin-left: 10px;
    margin-right: 10px;
    width: 300px;
}

.popup_adresse--adresses {
    height: 240px;
    margin-bottom: 12px;
}

.popup_adresse .adresse--items {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    height: 240px;
    overflow-y: auto;
}

.popup_adresse .adresse--item {
    position: relative;
    display: block;
    margin: 5px;
    padding-bottom: 24px;
    width: 185px;
    height: 73px;
    border: solid 1px #cccccc;
    text-align: center;
    padding: 8px 8px 25px 8px;
}


.popup_adresse .adresse--item_selected {
    background-color: #eeeeee;
    border: solid 1px #2eaadd;
}

.popup_adresse .adresse--detail .td_detail_adresse--raison_sociale,
.popup_adresse .adresse--detail .td_detail_adresse--adresse {
    display: block;
    font-size: 0.96em;
}

.popup_adresse .adresse--detail .td_detail_adresse--raison_sociale {
    font-weight: bold;
    cursor: pointer;
}

.popup_adresse .adresse--actions {
    position: absolute;
    bottom: 4px;
    width: 100%;
    text-align: center;
}

    .popup_adresse .adresse--actions a {
        text-decoration: underline;
    }

.popup_adresse--libelle_adresse {
    margin-bottom: 10px;
}

    .popup_adresse--libelle_adresse > span {
        /*padding-left: 0 10px;*/
    }

    .popup_adresse--libelle_adresse > input {
        width: 300px;
        margin-left: 10px;
    }

.popup_adresse .span_checkbox {
    width: 24px;
    height: 24px;
    border-style: solid;
    border-width: 1px;
    display: inline-flex;
    line-height: 24px;
    border-radius: 2px;
    vertical-align: middle;
    margin-right: 10px;
}

.popup_adresse .span_checkbox_ckecked::before {
    font-family: Awesome-solid;
    font-size: 18px;
    content: "\f00c";
    margin-left: 3px;
    color: #000000;
}

.popup_adresse .RadButton .rbIcon::before {
    font-size: 22px;
    color: #1976d2;
}

.popup_adresse .p-i-checkbox-checked:before,
.popup_adresse .rfdCheckboxChecked:before {
    font-family: Awesome-solid !important;
    content: "\f058";
}

.popup_adresse .p-i-checkbox:before,
.popup_adresse .rfdCheckboxUnchecked:before {
    font-family: Awesome-regular !important;
    content: "\f111";
}



/* === PIC INFORLMATION ===  */

.pic_information {
    background: transparent url(../image/img_information_24.png) no-repeat bottom center;
    height: 24px;
    width: 24px;
    padding-top: 1px;
    position: relative;
    display: inline-block;
}

    .pic_information > div {
        z-index: 9000;
        position: absolute;
        background-color: #ffffff;
        border: solid 1px #3e3135;
        border-radius: 3px;
        font-size: 11px;
        font-weight: normal;
        text-align: left;
        margin-left: 32px;
        padding: 2px 6px 2px 6px;
        display: none;
    }

    .pic_information:hover > div {
        display: block;
    }


/* === PASSWORD EYE ===  */

.password--input::-ms-reveal,
.password--input::-ms-clear {
    display: none;
}

.password {
    position: relative;
}

.password--eye {
    display: flex;
    align-items: center;
    position: absolute;
    top: calc(50% + 1px);
    right: 20px;
    transform: translateY(-50%);
    width: 12px;
    transition: all 0.2s;
}

    .password--eye span {
        cursor: pointer;
    }

        .password--eye span::before {
            padding: 5px;
            font-size: 15px;
            color: #848484;
            opacity: 0.7;
        }

        .password--eye span:hover::before {
            opacity: 1;
            transition-duration: 0.5s;
        }

.password--eye--on::before {
    font-family: Awesome-regular;
    content: "\f06e";
}

.password--eye--off::before {
    font-family: Awesome-regular;
    content: "\f070";
}


/* === STATUTS DE STOCK === */

.stock--statut_couleur {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 3px;
    border-radius: 50%;
}



/* ==================================== */
/* =============== MEDIA ============== */

@media (max-width : 1560px) {

    .page_body--content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .article--carousel {
        margin-right: 20px;
        margin-left: 20px;
    }
}

@media (max-width : 1200px) {

    .page {
        padding-top: 230px;
    }

    .page_header {
        height: 230px;
    }

    .page_header--logo {
        margin-top: 10px;
        margin-left: 90px;
    }

        .page_header--logo img {
            max-width: 300px;
        }

    .page_header--menu {
        display: block;
        top: 20px;
        width: 150px;
    }

    .page_header--menu--item {
        display: block;
        padding: 6px 0;
        margin-bottom: 5px;
        text-align: center;
        border-bottom: solid 1px #cccccc;
        font-size: 0.9em;
    }

    .page_body--content {
        padding-left: 20px;
        padding-right: 20px;
    }


    /* === CARTOUCHE CLIENT === */

    .page_header--cartouche_client {
        top: 100px;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        /*font-size: 0.9em;*/
/*        width: 370px;*/
    }
/*
    .cartouche_client--utilisateur {
        width: 140px;
    }

    .cartouche_client--panier {
        width: 230px
    }

    .cartouche_client--titre, .cartouche_client--titre a {
        font-size: 11px;
    }

    .cartouche_client--panier--titre #span_nb_paniers_encours {
        width: 170px;
    }

    .cartouche_client--content, .cartouche_client--content a {
        font-size: 0.95em;
        font-weight: normal;
    }
*/


    /* === RECHERCHE === */

    .page_header--search {
        width: 360px;
        top: 170px;
        right: auto;
        left: 50%;
        transform: translateX(-50%);
    }

        .page_header--search .control_search {
            width: 359px;
        }

        .page_header--search .control_search--input {
            width: 325px;
        }


    /* === FIL ARIANE === */

    .fil_ariane {
        display: none;
    }


    /* === ETAPES PANIER === */

    .panier_etapes--items--item span,
    .panier_etapes--items--item a {
        width: 180px;
        font-size: 14px;
        height: 32px;
        padding-top: 8px;
    }

        .panier_etapes--items--item span:after,
        .panier_etapes--items--item a:after {
            border-top: 16px solid transparent;
            border-bottom: 16px solid transparent;
        }

        .panier_etapes--items--item span:before,
        .panier_etapes--items--item a:before {
            border-top: 16px solid transparent;
            border-bottom: 16px solid transparent;
        }
}

@media (max-width : 800px) {

    .page_header--logo img {
        max-height: 80px;
    }


    #li_menu_catalogue, #li_menu_contact, #li_menu_telechargement {
        display: none;
    }

    .page_body--content--options {
        float: none;
        width: 100%;
        margin-right: 0;
        padding-right: 0;
    }

    .panier_etapes--items--item {
        display: none;
    }


    /* === LISTE CATALOGUE === */

    .liste_article .td_informations--argumentaire {
        display: none;
    }


    /* === POPUP === */

    .popup {
        width: 90%;
    }

    .popup--content {
        border-radius: 10px;
    }

    .popup--titre1 {
        font-size: 20px;
        line-height: 62px;
        height: 62px;
    }

    .popup--titre2 {
        font-size: 20px;
        line-height: 41px;
    }

    .popup--content--form {
        font-size: 14px;
    }

        .popup--content--form > ul > li {
            padding-left: 30px;
        }

        .popup--content--form .popup--content--form--libelle {
            width: 120px;
        }

        .popup--content--form .popup--content--form--valeur {
            width: calc(100% - 140px);
        }

        .popup--content--form div.RadDropDownList {
            width: 100%;
        }

        .popup--content--form div.select_popup span.rddlInner {
            width: calc(100% - 40px);
        }

    .popup--content--actions {
        margin-top: 20px;
        margin-bottom: 10px;
    }

        .popup--content--actions .actionBouton {
            font-size: 16px;
            line-height: 25px;
        }


    /* === POPUP ADRESSE === */

    #PopupAdresseRecherche {
        width: 90%;
    }
}


@media (max-width : 640px) {

    /* - Pour ne pas zoomer sur l'input (mobile Safari + Chrome) - */
    input[type=text],
    input[type=password] {
        font-size: 16px;
    }

    .page_header--logo img {
        max-height: 70px;
    }

    /* === CARTOUCHE CLIENT === */

    .page_header--cartouche_client {
        top: 75px;
        width: 100%;
        padding-left: 30px;
    }

    .cartouche--fitre_client--drop_down {
        top: 105px !important;
    }

    .cartouche_client--utilisateur,
    .cartouche_client--panier {
        float: none;
        width: calc(100% - 240px);
    }

    .cartouche_client--client .cartouche--filtre_client {
        left: 60px !important;
    }

    .cartouche_client--utilisateur--titre a {
        left: 60px;
    }

    .cartouche_client--utilisateur--deconnexion {
        left: 160px;
    }

    .cartouche_client--panier {
        margin-top: 5px;
    }

    /* === RECHERCHE === */

    .page_header--search {
        width: 96%;
        top: 195px;
        left: 50%;
        transform: translateX(-50%);
    }

        .page_header--search .control_search {
            width: 100%;
        }

        .page_header--search .control_search--input {
            width: calc(100% - 32px);
        }

    /* === LISTE CATALOGUE === */

    .liste_article,
    .liste_article tbody,
    .liste_article .liste_article--header {
        display: block;
    }

        .liste_article .liste_article--footer {
            display: none;
        }

        .liste_article .liste_article--header--item {
            clear: both;
            display: block;
            /*padding-bottom: 10px;*/
        }

    .liste--group td {
        font-size: 11px;
    }

    .liste_article .liste_article--body--item {
        clear: both;
        position: relative;
        display: block;
        padding-bottom: 10px;
    }

    .liste_article .liste_article--header--item .th_coloris,
    .liste_article .liste_article--header--item .th_palier,
    .liste_article .liste_article--header--item .th_quantite,
    .liste_article .liste_article--header--item .th_quantite_livre,
    .liste_article .liste_article--header--item .th_quantite_annule,
    .liste_article .liste_article--header--item .th_prix,
    .liste_article .liste_article--header--item .th_stock,
    .liste_article .liste_article--header--item .th_montant_ligne,
    .liste_article .liste_article--header--item .th_montant_total_ligne,
    .liste_article .liste_article--header--item .th_montant_livrable,
    .liste_article .liste_article--header--item .th_date_commande,
    .liste_article .liste_article--header--item .th_reliquat,
    .liste_article .liste_article--header--item .th_supprimer,
    .liste_article .liste_article--header--item .th_stop_alerte_stock,
    .liste_article .liste_article--header--item .th_taxe,
    .liste_article .liste_article--header--item .th_taxe_tgap,
    .liste_article .liste_article--header--item .th_taxe_deee {
        display: inline-block;
    }

    .liste_article .liste_article--body--item .td_coloris,
    .liste_article .liste_article--body--item .td_palier,
    .liste_article .liste_article--body--item .td_quantite,
    .liste_article .liste_article--body--item .td_quantite_livre,
    .liste_article .liste_article--body--item .td_quantite_annule,
    .liste_article .liste_article--body--item .td_prix,
    .liste_article .liste_article--body--item .td_stock,
    .liste_article .liste_article--body--item .td_montant_ligne,
    .liste_article .liste_article--body--item .td_montant_total_ligne,
    .liste_article .liste_article--body--item .td_montant_livrable,
    .liste_article .liste_article--body--item .td_date_commande,
    .liste_article .liste_article--body--item .td_reliquat,
    .liste_article .liste_article--body--item .td_supprimer,
    .liste_article .liste_article--body--item .td_stop_alerte_stock,
    .liste_article .liste_article--body--item .td_taxe,
    .liste_article .liste_article--body--item .td_taxe_tgap,
    .liste_article .liste_article--body--item .td_taxe_deee {
        display: inline-block;
        line-height: 26px;
    }

    .liste_article .th_article,
    .liste_article .th_vignette,
    .liste_article .th_pcb, .liste_article .td_pcb, .liste_article .tf_pcb,
    .liste_article .th_evenement, .liste_article .td_evenement, .liste_article .tf_evenement,
    .liste_article .th_stock_referencement, .liste_article .td_stock_referencement, .liste_article .tf_stock_referencement,
    .liste_article .th_montant_total_ligne, .liste_article .td_montant_total_ligne, .liste_article .tf_montant_total_ligne {
        display: none !important;
    }

    .liste_article .td_vignette {
        float: left;
    }


    .liste_article .td_vignette,
    .liste_article .td_informations {
        height: 80px;
    }

    .liste_article .td_informations {
        width: calc(100vw - 120px);
    }

    .liste_article .liste_article--body--commentaire,
    .liste_article .td_informations--conditionnement {
        display: none;
    }

    .liste_article .th_quantite, .liste_article .td_quantite, .liste_article .tf_quantite {
        width: 120px;
    }

    .liste_article .th_prix, .liste_article .td_prix, .liste_article .tf_prix {
        width: 30px;
    }

    .liste_article .th_montant_ligne, .liste_article .td_montant_ligne, .liste_article .tf_montant_ligne {
        width: 50px;
    }

    .liste_article .th_stock, .liste_article .td_stock, .liste_article .tf_stock {
        width: calc(100% - 330px);
    }


    /* === POPUP === */

    .popup--titre1 {
        font-size: 16px;
        line-height: 52px;
        height: 52px;
        box-sizing: content-box;
    }

    .popup--titre2 {
        font-size: 16px;
        line-height: 31px;
        height: 31px;
        box-sizing: content-box;
    }

    .popup--content--form > ul > li {
        padding-left: 15px;
        line-height: 30px;
    }

    .popup--content--form .popup--content--form--valeur {
        display: block;
        width: calc(100% - 20px);
    }

    .popup--content--actions .actionBouton {
        display: block;
        margin: 5px auto;
    }


    /* === ACTIONS === */

    .page_body--content--actions {
        clear: both;
        float: none;
        width: 100%;
        max-width: none;
        text-align: center;
    }

        .page_body--content--actions .actionBouton {
            width: 70%;
            margin: 5px auto;
            font-size: 1.2em;
        }
}

@media (max-width : 480px) {

    .page_body {
        min-width: auto !important;
        font-size: 11px;
    }

    .page_body--content {
        width: 100% !important;
        min-width: auto !important;
        padding-right: 0;
        padding-left: 0;
    }

    h1,
    .page_body--titre1 {
        font-size: 24px;
        height: 60px;
        line-height: 60px;
        margin-bottom: 0px;
    }

    .page_body--content--bas {
        background-size: calc(100vw - 40px) auto;
    }


    /* - Affichage - */
    .page_body--content--affichage {
        text-align: center;
    }

    /* - Options - */
    .page_body--content--options {
        float: none;
        width: 100%;
        padding: 0;
        margin: 0;
    }

    .page_body--content--options--item {
        float: none;
        margin: 0;
        padding: 0;
    }

    /* === CARTOUCHE CLIENT === */

    .page_header--logo {
        margin-top: 20px;
    }

        .page_header--logo img {
            max-height: 40px;
        }

    .page_header--cartouche_client {
        width: 100%;
    }

    .cartouche_client--titre, .cartouche_client--titre a {
        font-size: 12px;
    }

    .cartouche_client--detail--content, .cartouche_client--content a {
        font-size: 11px;
    }

    .cartouche_client--utilisateur {
        width: 145px;
    }

    .cartouche_client--panier {
        width: 230px;
    }

    .cartouche_client--panier--titre #span_nb_paniers_encours {
        width: 168px;
    }


    /* === RECHERCHE === */

    .page_header--search {
        width: 96%;
    }

        .page_header--search .control_search {
            width: 100%;
        }

        .page_header--search .control_search--input {
            width: calc(100% - 32px);
            font-size: 90%;
        }


    /* === MENU === */

    .page_header--menu {
        top: 10px;
    }

    .page_header--menu--item {
        padding: 3px 0;
        margin-bottom: 2px;
        font-size: 0.85em;
    }


    /* === MENU FAMILLE === */

    .page_header--navigation_famille {
        top: 10px;
    }

    .menu_famille_reduit--icon {
        width: 60px !important;
    }


    /* === BOITE DE DIALOGUE === */

    div.ui-dialog {
        min-width: auto !important;
        width: 80% !important;
        font-size: 14px;
    }

        div.ui-dialog .ui-dialog-titlebar {
            font-size: 18px;
        }

        div.ui-dialog .ui-dialog-content {
            padding: 15px 40px 10px 40px;
        }

    /* === LISTE === */

    .liste--group td {
        padding-left: 10px;
    }
}