/* ---------- LES CLASSES UTILES ---------- */
.mt10{
    margin-top: 10px;
}

.mt25{
    margin-top: 25px;
}

.mt50{
    margin-top: 50px;
}

.mt100{
    margin-top: 100px;
}

.mb10{
    margin-bottom: 10px;
}

.mb25{
    margin-bottom: 25px;
}

.mb50{
    margin-bottom: 50px;
}

.mb100{
    margin-bottom: 100px;
}

.pt0{
    padding-top: 0px;
}

.pt10{
    padding-top: 10px;
}

.pt25{
    padding-top: 25px;
}

.pt50{
    padding-top: 50px;
}

.pt100{
    padding-top: 100px;
}

.pb0{
    padding-bottom: 0px;
}

.pb10{
    padding-bottom: 10px;
}

.pb25{
    padding-bottom: 25px;
}

.pb50{
    padding-bottom: 50px;
}

.pb100{
    padding-bottom: 100px;
}


.pt0.decalage-h-10 img{
    transform: translate(0, calc(-10%));
}

.pt0.decalage-h-25 img{
    transform: translate(0, calc(-25%));
}

.pt0.decalage-h-50 img{
    transform: translate(0, calc(-50%));
}

.pt25.decalage-h-10 img{
    transform: translate(0, calc(-10% - 25px));
}

.pt25.decalage-h-25 img{
    transform: translate(0, calc(-25% - 25px));
}

.pt25.decalage-h-50 img{
    transform: translate(0, calc(-50% - 25px));
}

.pt50.decalage-h-10 img{
    transform: translate(0, calc(-10% - 50px));
}

.pt50.decalage-h-25 img{
    transform: translate(0, calc(-25% - 50px));
}

.pt50.decalage-h-50 img{
    transform: translate(0, calc(-50% - 50px));
}

.pt100.decalage-h-10 img{
    transform: translate(0, calc(-10% - 100px));
}

.pt100.decalage-h-25 img{
    transform: translate(0, calc(-25% - 100px));
}

.pt100.decalage-h-50 img{
    transform: translate(0, calc(-50% - 100px));
}

.ratio-4-3{
    aspect-ratio: 4 / 3;
}

.ratio-3-4{
    aspect-ratio: 3 / 4;
}

.ratio-1-1{
    aspect-ratio: 1 / 1;
}



.col-sm-2-4 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
@media (min-width: 576px) {
    .col-sm-2-4 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 768px) {
    .col-md-2-4 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 992px) {
    .col-lg-2-4 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}
@media (min-width: 1200px) {
    .col-xl-2-4 {
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }
}



/* ---------- LES REGLES GENERALES ---------- */
img {
    max-width: 100%;
    width: 100%;
}

.video {
    max-width: 100%;
}

.vertical-center {
    display: flex; /* contexte sur le parent */
    flex-direction: column; /* direction d'affichage verticale */
    justify-content: center;
}

.vertical-center .btn {
    align-self: flex-start;
}

a.no-underline:hover {
    text-decoration: none;
}

.form-control {
    height: initial;
}

.breadcrumb {
    background: var(--blocpage-section-bgcolor-v1);
}

.breadcrumb-item + .breadcrumb-item::before {
    content: ">";
}

.align-items-dynamique {
    align-items: start;
}



/* ---------- LE BODY ---------- */
body {
    background: var(--blocpage-section-bgcolor-v1);
    color: var(--blocpage-texte-color-v1);
    font-family: var(--font-textes);
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-titres);
    font-weight: var(--font-weight-titres);
    overflow-wrap: break-word;
}

body h1{
    color: var(--blocpage-titre-color-v1);
}

body h2{
    color: var(--blocpage-titre-color-v1);
    font-size: var(--blocpage-titre-size);
}

body h2 strong {
    color: var(--blocpage-titrestrong-color-v1);
    font-weight: var(--blocpage-titrestrong-fontweight);
}

body p, body label{
    color: var(--blocpage-texte-color-v1);
    font-size: var(--blocpage-texte-size);
}

body a{
    color: var(--blocpage-lien-color-v1);
}

body a:hover{
    color: var(--blocpage-lien-color-v1);
    text-decoration: underline;
}

body .form-control,
body .form-control:focus {
    font-size: var(--blocpage-texte-size);
    background: var(--blocpage-formcontrol-bgcolor-v1);
    /*border: var(--blocpage-formcontrol-border-v1);*/
    border-top: var(--blocpage-formcontrol-border-top-v1);
    border-bottom: var(--blocpage-formcontrol-border-bottom-v1);
    border-left: var(--blocpage-formcontrol-border-left-v1);
    border-right: var(--blocpage-formcontrol-border-right-v1);
    border-radius: var(--blocpage-formcontrol-radius);
    color: var(--blocpage-formcontrol-color-v1);
    padding: var(--blocpage-formcontrol-padding);
    box-shadow: none;
}
body .form-control:focus {
    outline: auto;
}
body .form-control::placeholder,
body .form-control::placeholder:focus {
    color: var(--blocpage-formcontrol-color-v1);
    opacity: 0.6;
}
body .form-control.input-erreur {
    border-color: #DA3131;
}

.message-erreur {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: calc(var(--blocpage-texte-size) * 0.2);
}
.message-erreur svg {
    width: calc(var(--blocpage-texte-size) * 1.5);
    fill: #DA3131;
}
.message-erreur p {
    margin: 0;
    color: #DA3131;
}


.blocpage .div-boutons,
#illustration .div-boutons {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}



body select option {
    font-family: var(--font-textes);
}



body .btn {
    border-radius: var(--blocpage-bouton-radius);
    font-size: var(--blocpage-bouton-size);
    padding: var(--blocpage-bouton-padding);
    transition: fill .2s ease-in-out;
}

body .btn-primary {
    background: var(--blocpage-bouton-bgcolor-v1);
    color: var(--blocpage-bouton-color-v1);
    fill: var(--blocpage-bouton-color-v1);
    /*border: var(--blocpage-bouton-border-v1);*/
    border-top: var(--blocpage-bouton-border-top-v1);
    border-bottom: var(--blocpage-bouton-border-bottom-v1);
    border-left: var(--blocpage-bouton-border-left-v1);
    border-right: var(--blocpage-bouton-border-right-v1);
}
body .btn-secondary {
    background: var(--blocpage-btnsecondary-bgcolor-v1);
    color: var(--blocpage-btnsecondary-color-v1);
    fill: var(--blocpage-btnsecondary-color-v1);
    /*border: var(--blocpage-btnsecondary-border-v1);*/
    border-top: var(--blocpage-btnsecondary-border-top-v1);
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v1);
    border-left: var(--blocpage-btnsecondary-border-left-v1);
    border-right: var(--blocpage-btnsecondary-border-right-v1);
}

body .btn svg {
    width: 24px;
}


.btn:hover,
.btn:focus,
.btn:active,
.btn:active:focus {
    box-shadow: none!important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary:active:focus,
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active {
    background: var(--blocpage-bouton-color-v1);
    color: var(--blocpage-bouton-bgcolor-v1);
    fill: var(--blocpage-bouton-bgcolor-v1);
    /*border: var(--blocpage-bouton-border-v1) !important;*/
    border-top: var(--blocpage-bouton-border-top-v1);
    border-bottom: var(--blocpage-bouton-border-bottom-v1);
    border-left: var(--blocpage-bouton-border-left-v1);
    border-right: var(--blocpage-bouton-border-right-v1);
}


.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active,
.btn-secondary:active:focus {
    background: var(--blocpage-btnsecondary-color-v1) !important;
    color: var(--blocpage-btnsecondary-bgcolor-v1) !important;
    fill: var(--blocpage-btnsecondary-bgcolor-v1);
    /*border: var(--blocpage-btnsecondary-border-v1) !important;*/
    border-top: var(--blocpage-btnsecondary-border-top-v1) !important;
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v1) !important;
    border-left: var(--blocpage-btnsecondary-border-left-v1) !important;
    border-right: var(--blocpage-btnsecondary-border-right-v1) !important;
}

.btn.disabled,
.btn:disabled,
.btn.disabled:hover,
.btn:disabled:hover {
    border-radius: var(--blocpage-bouton-radius);
    font-size: var(--blocpage-bouton-size);
    padding: var(--blocpage-bouton-padding);
}

.btn-primary.disabled,
.btn-primary:disabled,
.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
    background: var(--blocpage-bouton-bgcolor-v1) !important;
    color: var(--blocpage-bouton-color-v1) !important;
    fill: var(--blocpage-bouton-color-v1);
    /*border: var(--blocpage-bouton-border-v1) !important;*/
    border-top: var(--blocpage-bouton-border-top-v1) !important;
    border-bottom: var(--blocpage-bouton-border-bottom-v1) !important;
    border-left: var(--blocpage-bouton-border-left-v1) !important;
    border-right: var(--blocpage-bouton-border-right-v1) !important;
}
.btn-secondary.disabled,
.btn-secondary:disabled,
.btn-secondary.disabled:hover,
.btn-secondary:disabled:hover {
    background: var(--blocpage-btnsecondary-bgcolor-v1) !important;
    color: var(--blocpage-btnsecondary-color-v1) !important;
    fill: var(--blocpage-btnsecondary-color-v1);
    /*border: var(--blocpage-btnsecondary-border-v1) !important;*/
    border-top: var(--blocpage-btnsecondary-border-top-v1) !important;
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v1) !important;
    border-left: var(--blocpage-btnsecondary-border-left-v1) !important;
    border-right: var(--blocpage-btnsecondary-border-right-v1) !important;
}



/* ---------- LA BARRE ADMIN ---------- */
#topbar {
    position: sticky;
    top: 0;
    background-color: #4FBCBF;
    color: white;
    padding-top: 7px;
    padding-bottom: 7px;
    z-index: 1050;
}

#topbar a{
    color: #ffffff;
}


/* ---------- LES OUTILS D'EDITION ---------- */
.blocpage .gotoedit {
    display: none;
    position: absolute;
    right: 25px;
    padding: 0.75rem;
    border-radius: 0px;
    border: 2px solid #4FBCBF;
    background: #FFFFFF;
    color: #4FBCBF;
    z-index: 999;
}

.blocpage:hover .gotoedit {
    display: block;
}

.blocpage:hover .gotoedit:hover {
    background: #4FBCBF;
    color: #FFFFFF;
    cursor: pointer;
}





/* ---------- LA NAVBAR ---------- */
.navbar-parent {
    position: fixed;
    top: 0;
    z-index: 10;
    width: 100%;
}
.navbar {
    background: var(--navbar-t1-general-bgcolor);
    backdrop-filter: blur(var(--navbar-t1-general-blur));
    padding-top: 20px;
    padding-bottom: 20px;
    transition: background 0.5s ease;
}
.navbar .container,
.navbar .container-fluid {
    gap: 16px;
}
.navbar.navbar-transparent {
    background: transparent;
    backdrop-filter: blur(0px);
}

/*.navbar .navbar-brand {
    display: inline-block;
}*/
.navbar #logonavbar {
    max-width: 250px;
    max-height: 50px;
    /*width: 100%;*/
    transition: all 0.5s ease;

    height: auto;
    width: auto;

    /*box-sizing: border-box;
    display: block;*/
}
.navbar.navbar-grand #logonavbar {
    max-width: calc(250px * 1.5);
    max-height: calc(50px * 1.5);
}

.navbar .navbar-brand-parent {
    flex: 1;
}
.navbar .navbar-brand {
    padding: 0;
    margin: 0;
}
.navbar .navbar-brand span {
    display: block;
    color: var(--navbar-t1-lien-color);
    font-size: calc(var(--navbar-t1-lien-size) * 1.25);
    margin: 0;
    transition: all 0.5s ease;
}
.navbar.navbar-grand .navbar-brand span {
    font-size: calc(var(--navbar-t1-lien-size) * 1.25 * 1.5);
    padding: 0.5em 0;
}

.navbar-brand:hover {
    color: var(--navbar-t1-lien-color);
}

.navbar-toggler {
    padding: 0;
}
.navbar-toggler:focus {
    outline: none;
}

.navbar-toggler {
    --largeur: 30px;
    --hauteur: 25px;
    --epaisseur: 3px;
    --espacement: calc( (var(--hauteur) - 3 * var(--epaisseur)) / 2 );
}
.navbar-toggler .navbar-toggler-icon {
    width: var(--largeur);
    height: var(--hauteur);
    position: relative;
    transition: .5s ease-in-out;
}
.navbar-toggler .navbar-toggler-icon .line {
    display: block;
    position: absolute;
    height: var(--epaisseur);
    width: 100%;
    background: var(--navbar-t1-lien-color);
    border-radius: calc(var(--epaisseur) / 2);
    opacity: 1;
    transition: .2s ease-in-out;
}

.navbar-toggler .navbar-toggler-icon .line:nth-child(1),
.navbar-toggler .navbar-toggler-icon .line:nth-child(4) {
    top: calc( var(--epaisseur) + var(--espacement) );
    width: 0;
    left: 50%;
}
.navbar-toggler .navbar-toggler-icon .line:nth-child(2),
.navbar-toggler .navbar-toggler-icon .line:nth-child(3) {
    top: calc( var(--epaisseur) + var(--espacement) );
}
.navbar-toggler .navbar-toggler-icon .line:nth-child(2) {
    transform: rotate(-45deg);
}
.navbar-toggler .navbar-toggler-icon .line:nth-child(3) {
    transform: rotate(45deg);
}

.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(1),
.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(4) {
    width: 100%;
    left: 0;
}
.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(1) {
     top: 0;
 }
.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(2),
.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(3) {
    transform: rotate(0);
    top: calc( var(--epaisseur) + var(--espacement) );
}
.navbar-toggler.collapsed .navbar-toggler-icon .line:nth-child(4) {
    top: calc( (var(--epaisseur) + var(--espacement)) * 2 );
}







.navbar .nav-panier {
    order: 1;
}
.navbar.navbar-burger .nav-panier {
    order: 0;
}
.navbar .nav-panier .nav-link {
    color: var(--navbar-t1-lien-color);
    padding: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}
.navbar.navbar-grand .nav-panier .nav-link {
    font-size: calc(var(--navbar-t1-lien-size) * 1.25);
}

.navbar.navbar-expand-sm .nav-item,
.navbar.navbar-expand-md .nav-item,
.navbar.navbar-expand-lg .nav-item,
.navbar.navbar-expand-xl .nav-item {
    white-space: nowrap;
}



.navbar.navbar-burger.navbar-ouvert.navbar-transparent {
    background: var(--navbar-t1-general-bgcolor);
}
.navbar .navbar-nav {
    gap: var(--navbar-t1-lien-size);
}
.navbar.navbar-grand .navbar-nav {
    gap: calc(var(--navbar-t1-lien-size) * 1.25);
}
.navbar .navbar-nav .nav-link {
    color: var(--navbar-t1-lien-color);
    font-size: var(--navbar-t1-lien-size);
    font-weight: var(--navbar-t1-lien-fontweight);
    padding: calc(var(--navbar-t1-lien-size) * 0.5) 0;
    transition: font-size 0.5s ease;
    text-align: center;
}
.navbar.navbar-grand .navbar-nav .nav-link {
    font-size: calc(var(--navbar-t1-lien-size) * 1.25);
    padding: calc(var(--navbar-t1-lien-size) * 0.5 * 1.25) 0;
}

.navbar .navbar-nav .nav-link:hover {
    opacity: 0.7;
}

.navbar .navbar-nav .btn {
    font-size: var(--navbar-t1-bouton-size);
    padding: var(--navbar-t1-bouton-padding);
    border-radius: var(--navbar-t1-bouton-radius);
}
.navbar.navbar-grand .navbar-nav .btn-primary{
    font-size: calc(var(--navbar-t1-bouton-size) * 1.25);
    padding: calc(var(--navbar-t1-bouton-padding-x) * 1.25) calc(var(--navbar-t1-bouton-padding-y) * 1.25);
    border-radius: calc(var(--navbar-t1-bouton-radius) * 1.25);
}
.navbar .navbar-nav .btn-primary,
.navbar .navbar-nav .btn-primary:hover,
.navbar .navbar-nav .btn-primary:focus,
.navbar .navbar-nav .btn-primary:active,
.navbar .navbar-nav .btn-primary:not(:disabled):not(.disabled).active,
.navbar .navbar-nav .btn-primary:not(:disabled):not(.disabled):active  {
    background: var(--navbar-t1-bouton-bgcolor);
    color: var(--navbar-t1-bouton-color);
    /*border: var(--navbar-t1-bouton-border);*/
    border-top: var(--navbar-t1-bouton-border-top);
    border-bottom: var(--navbar-t1-bouton-border-bottom);
    border-left: var(--navbar-t1-bouton-border-left);
    border-right: var(--navbar-t1-bouton-border-right);
}


.navbar .navbar-nav .dropdown-submenu {
    position: relative;
}
.navbar .navbar-nav .dropdown-toggle::after {
    vertical-align: middle;
}
.navbar .navbar-nav .dropdown-submenu {
    position: relative;
}
.navbar .navbar-nav .dropdown-submenu > .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: 0px;
    margin-left: 0px;
}
.navbar .navbar-nav .dropdown-item.active,
.navbar .navbar-nav .dropdown-item:active {
    background: var(--navbar-t1-lien-color);
}














/* ---------- LES BLOCPAGES ---------- */
#content {
    background: inherit;
}

.blocpage {
    -webkit-background-size: cover;
    background-size: cover!important;
    background-position: center!important;
}

.fond2.blocpage {
    background: var(--blocpage-section-bgcolor-v2);
}

.fond3.blocpage {
    background: var(--blocpage-section-bgcolor-v3);
}

.blocpage.parallax{
    background-attachment: fixed;
}

.fond2.blocpage h2 {
    color: var(--blocpage-titre-color-v2);
}

.fond2.blocpage h2 strong {
    color: var(--blocpage-titrestrong-color-v2);
    font-weight: var(--blocpage-titrestrong-fontweight);
}

.fond3.blocpage h2 {
    color: var(--blocpage-titre-color-v3);
}

.fond3.blocpage h2 strong {
    color: var(--blocpage-titrestrong-color-v3);
    font-weight: var(--blocpage-titrestrong-fontweight);
}

.fond2.blocpage p,
.fond2.blocpage label {
    color: var(--blocpage-texte-color-v2);
}

.fond3.blocpage p,
.fond3.blocpage label {
    color: var(--blocpage-texte-color-v3);
}

.fond2.blocpage a {
    color: var(--blocpage-lien-color-v2);
}

.fond3.blocpage a {
    color: var(--blocpage-lien-color-v3);
}

.fond2.blocpage .form-control,
.fond2.blocpage .form-control:focus {
    background: var(--blocpage-formcontrol-bgcolor-v2);
    /*border: var(--blocpage-formcontrol-border-v2);*/
    border-top: var(--blocpage-formcontrol-border-top-v2);
    border-bottom: var(--blocpage-formcontrol-border-bottom-v2);
    border-left: var(--blocpage-formcontrol-border-left-v2);
    border-right: var(--blocpage-formcontrol-border-right-v2);
    color: var(--blocpage-formcontrol-color-v2);
    box-shadow: none;
}

.fond2.blocpage .form-control::placeholder,
.fond2.blocpage .form-control::placeholder:focus {
    color: var(--blocpage-formcontrol-color-v2);
    opacity: 0.6;
}

.fond3.blocpage .form-control,
.fond3.blocpage .form-control:focus {
    background: var(--blocpage-formcontrol-bgcolor-v3);
    /*border: var(--blocpage-formcontrol-border-v3);*/
    border-top: var(--blocpage-formcontrol-border-top-v3);
    border-bottom: var(--blocpage-formcontrol-border-bottom-v3);
    border-left: var(--blocpage-formcontrol-border-left-v3);
    border-right: var(--blocpage-formcontrol-border-right-v3);
    color: var(--blocpage-formcontrol-color-v3);
    box-shadow: none;
}

.fond3.blocpage .form-control::placeholder,
.fond3.blocpage .form-control::placeholder:focus {
    color: var(--blocpage-formcontrol-color-v3);
    opacity: 0.6;
}

.fond2.blocpage .btn-primary {
    background: var(--blocpage-bouton-bgcolor-v2);
    color: var(--blocpage-bouton-color-v2);
    /*border: var(--blocpage-bouton-border-v2);*/
    border-top: var(--blocpage-bouton-border-top-v2);
    border-bottom: var(--blocpage-bouton-border-bottom-v2);
    border-left: var(--blocpage-bouton-border-left-v2);
    border-right: var(--blocpage-bouton-border-right-v2);
}
.fond2.blocpage .btn-secondary {
    background: var(--blocpage-btnsecondary-bgcolor-v2);
    color: var(--blocpage-btnsecondary-color-v2);
    /*border: var(--blocpage-btnsecondary-border-v2);*/
    border-top: var(--blocpage-btnsecondary-border-top-v2);
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v2);
    border-left: var(--blocpage-btnsecondary-border-left-v2);
    border-right: var(--blocpage-btnsecondary-border-right-v2);
}

.fond2 .btn:hover,
.fond2 .btn:focus,
.fond2 .btn:active,
.fond2 .btn:active:focus {
    box-shadow: none!important;
}
.fond2 .btn-primary:hover,
.fond2 .btn-primary:focus,
.fond2 .btn-primary:active,
.fond2 .btn-primary:active:focus {
    background: var(--blocpage-bouton-color-v2) !important;
    color: var(--blocpage-bouton-bgcolor-v2) !important;
    /*border: var(--blocpage-bouton-border-v2) !important;*/
    border-top: var(--blocpage-bouton-border-top-v2) !important;
    border-bottom: var(--blocpage-bouton-border-bottom-v2) !important;
    border-left: var(--blocpage-bouton-border-left-v2) !important;
    border-right: var(--blocpage-bouton-border-right-v2) !important;
}
.fond2 .btn-secondary:hover,
.fond2 .btn-secondary:focus,
.fond2 .btn-secondary:active,
.fond2 .btn-secondary:active:focus {
    background: var(--blocpage-btnsecondary-color-v2) !important;
    color: var(--blocpage-btnsecondary-bgcolor-v2) !important;
    /*border: var(--blocpage-btnsecondary-border-v2) !important;*/
    border-top: var(--blocpage-btnsecondary-border-top-v2) !important;
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v2) !important;
    border-left: var(--blocpage-btnsecondary-border-left-v2) !important;
    border-right: var(--blocpage-btnsecondary-border-right-v2) !important;
}

.fond3.blocpage .btn-primary {
    background: var(--blocpage-bouton-bgcolor-v3);
    color: var(--blocpage-bouton-color-v3);
    /*border: var(--blocpage-bouton-border-v3);*/
    border-top: var(--blocpage-bouton-border-top-v3);
    border-bottom: var(--blocpage-bouton-border-bottom-v3);
    border-left: var(--blocpage-bouton-border-left-v3);
    border-right: var(--blocpage-bouton-border-right-v3);
}
.fond3.blocpage .btn-secondary {
    background: var(--blocpage-btnsecondary-bgcolor-v3);
    color: var(--blocpage-btnsecondary-color-v3);
    /*border: var(--blocpage-btnsecondary-border-v3);*/
    border-top: var(--blocpage-btnsecondary-border-top-v3);
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v3);
    border-left: var(--blocpage-btnsecondary-border-left-v3);
    border-right: var(--blocpage-btnsecondary-border-right-v3);
}

.fond3 .btn:hover,
.fond3 .btn:focus,
.fond3 .btn:active,
.fond3 .btn:active:focus {
    box-shadow: none!important;
}
.fond3 .btn-primary:hover,
.fond3 .btn-primary:focus,
.fond3 .btn-primary:active,
.fond3 .btn-primary:active:focus {
    background: var(--blocpage-bouton-color-v3)!important;
    color: var(--blocpage-bouton-bgcolor-v3)!important;
    /*border: var(--blocpage-bouton-border-v3) !important;*/
    border-top: var(--blocpage-bouton-border-top-v3) !important;
    border-bottom: var(--blocpage-bouton-border-bottom-v3) !important;
    border-left: var(--blocpage-bouton-border-left-v3) !important;
    border-right: var(--blocpage-bouton-border-right-v3) !important;
}
.fond3 .btn-secondary:hover,
.fond3 .btn-secondary:focus,
.fond3 .btn-secondary:active,
.fond3 .btn-secondary:active:focus {
    background: var(--blocpage-btnsecondary-color-v3)!important;
    color: var(--blocpage-btnsecondary-bgcolor-v3)!important;
    /*border: var(--blocpage-btnsecondary-border-v3) !important;*/
    border-top: var(--blocpage-btnsecondary-border-top-v3) !important;
    border-bottom: var(--blocpage-btnsecondary-border-bottom-v3) !important;
    border-left: var(--blocpage-btnsecondary-border-left-v3) !important;
    border-right: var(--blocpage-btnsecondary-border-right-v3) !important;
}





/* ---------- TEXT INPUT LIMITE CARACTERES ---------- */
.input-caracteres {
    position: relative;
    display: flex;
}
.input-caracteres input,
.input-caracteres input:focus {
    padding-right: calc(var(--blocpage-texte-size) * 3 + var(--blocpage-formcontrol-padding-y));
}
.input-caracteres span {
    font-size: var(--blocpage-texte-size);
    width: calc(var(--blocpage-texte-size) * 3);
    border-left: var(--blocpage-formcontrol-border-left-v1);
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}





/* ---------- LE BLOC EN COIN ---------- */
.div-bloc-coin {
    position: fixed;
    bottom: 15px;
    right: 15px;
    background-color: #4FBCBF;
    margin-left: 15px;
    border-radius: 0.4em;
    transition: all 0.2s ease-in-out;
    animation: battement 2s infinite cubic-bezier(.66, 0, 0, 1);
}
@keyframes battement {
    from {
        box-shadow: 0 0 0 0 rgba(79, 188, 191, .7);
    }
    to {
        box-shadow: 0 0 0 20px rgba(255, 71, 84, 0);
    }
}

.div-bloc-coin:hover {
    background-color: #399193;
}
.div-bloc-coin:active {
    background-color: #226567;
    box-shadow: 0 0 0 0.2em rgba(34, 101, 103, 0.5);
}
.div-bloc-coin a {
    text-decoration: none !important;
}
.div-bloc-coin .div-contenu {
    font-size: 16px;
    height: 100%;
    padding: 1em 1.2em;
    display: flex;
    align-items: start;
    justify-content: center;
    gap: 0.8em;
    flex-wrap: wrap;
}
.div-bloc-coin .div-contenu svg {
    fill: white;
    width: 1.5em;
    animation: deplacement 1s infinite ease-in-out alternate;
}
@keyframes deplacement {
    from {
        transform: translate(-7px) scale(80%);
    }
    to {
        transform: translate(7px) scale(100%);
    }
}

.div-bloc-coin .div-contenu .zone-de-texte {
    max-width: 350px;
}
.div-bloc-coin .div-contenu .zone-de-texte p {
    font-size: 1em;
    font-family: Jost,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,Arial,sans-serif;
    color: white;
    margin: 0;
}
.div-bloc-coin .div-contenu .zone-de-texte p.titre {
    font-weight: 500;
    text-transform: uppercase;
}

@media (min-width: 768px) {
    .div-bloc-coin .div-contenu {
        font-size: 20px;
    }
}



/* ---------- LES MAPS ---------- */
.blocmap {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.blocpage.blocmap .map_canvas {
    height: 400px;
}

.blocpage.blocmap .map_canvas .gm-style-mtc{
    display: none;
}



/* ---------- LES AVIS CLIENTS ---------- */
.avis{
    -webkit-border-radius: var(--avisclient-t10-avis-radius);
    -moz-border-radius: var(--avisclient-t10-avis-radius);
    border-radius: var(--avisclient-t10-avis-radius);
    padding: 30px;
    border: none;
    padding: var(--avisclient-t10-avis-padding);

    box-shadow: var(--avisclient-t10-avis-shadow-v1);
    -moz-box-shadow: var(--avisclient-t10-avis-shadow-v1);
    -webkit-box-shadow: var(--avisclient-t10-avis-shadow-v1);
    /*border: var(--avisclient-t10-avis-border-v1);*/
    border-top: var(--avisclient-t10-avis-border-top-v1);
    border-bottom: var(--avisclient-t10-avis-border-bottom-v1);
    border-left: var(--avisclient-t10-avis-border-left-v1);
    border-right: var(--avisclient-t10-avis-border-right-v1);
    background: var(--avisclient-t10-avis-bgcolor-v1);
    backdrop-filter: blur(--avisclient-t10-avis-blur-v1);
}

.fond2 .avis {
    box-shadow: var(--avisclient-t10-avis-shadow-v2);
    -moz-box-shadow: var(--avisclient-t10-avis-shadow-v2);
    -webkit-box-shadow: var(--avisclient-t10-avis-shadow-v2);
    /*border: var(--avisclient-t10-avis-border-v2);*/
    border-top: var(--avisclient-t10-avis-border-top-v2);
    border-bottom: var(--avisclient-t10-avis-border-bottom-v2);
    border-left: var(--avisclient-t10-avis-border-left-v2);
    border-right: var(--avisclient-t10-avis-border-right-v2);
    background: var(--avisclient-t10-avis-bgcolor-v2);
    backdrop-filter: blur(--avisclient-t10-avis-blur-v2);
}

.fond3 .avis {
    box-shadow: var(--avisclient-t10-avis-shadow-v3);
    -moz-box-shadow: var(--avisclient-t10-avis-shadow-v3);
    -webkit-box-shadow: var(--avisclient-t10-avis-shadow-v3);
    /*border: var(--avisclient-t10-avis-border-v3);*/
    border-top: var(--avisclient-t10-avis-border-top-v3);
    border-bottom: var(--avisclient-t10-avis-border-bottom-v3);
    border-left: var(--avisclient-t10-avis-border-left-v3);
    border-right: var(--avisclient-t10-avis-border-right-v3);
    background: var(--avisclient-t10-avis-bgcolor-v3);
    backdrop-filter: blur(--avisclient-t10-avis-blur-v3);
}

.avis .texte-avis {
    font-size: var(--avisclient-t10-texte-size);
    color: var(--avisclient-t10-texte-color-v1);
}


.fond2 .avis .texte-avis {
    color: var(--avisclient-t10-texte-color-v2);
}

.fond3 .avis .texte-avis {
    color: var(--avisclient-t10-texte-color-v3);
}

.avis cite{
    display: block;
    margin-top: 1rem;
    font-weight: 600;
    font-style: normal;
    font-size: var(--avisclient-t10-nomclient-size);
    color: var(--avisclient-t10-nomclient-color-v1);
}

.fond2 .avis cite {
    color: var(--avisclient-t10-nomclient-color-v2);
}

.fond3 .avis cite {
    color: var(--avisclient-t10-nomclient-color-v3);
}



/* ---------- LA PAGE QUI LISTE LES PRODUITS ---------- */
#produits{
    padding-top: 50px;
    padding-bottom: 50px;
}



/* ---------- LES APERCUS PRODUITS ---------- */
.apercu-produit {
    margin-bottom: 25px;
    background: white;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: var(--apercuproduit-t11-content-radius);
    overflow: hidden;

    /*border: var(--apercuproduit-t11-content-border-v1);*/
    border-top: var(--apercuproduit-t11-content-border-top-v1);
    border-bottom: var(--apercuproduit-t11-content-border-bottom-v1);
    border-left: var(--apercuproduit-t11-content-border-left-v1);
    border-right: var(--apercuproduit-t11-content-border-right-v1);
    box-shadow: var(--apercuproduit-t11-content-shadow-v1);
}
.fond2 .apercu-produit {
    /*border: var(--apercuproduit-t11-content-border-v2);*/
    border-top: var(--apercuproduit-t11-content-border-top-v2);
    border-bottom: var(--apercuproduit-t11-content-border-bottom-v2);
    border-left: var(--apercuproduit-t11-content-border-left-v2);
    border-right: var(--apercuproduit-t11-content-border-right-v2);
    box-shadow: var(--apercuproduit-t11-content-shadow-v2);
}
.fond3 .apercu-produit {
    /*border: var(--apercuproduit-t11-content-border-v3);*/
    border-top: var(--apercuproduit-t11-content-border-top-v3);
    border-bottom: var(--apercuproduit-t11-content-border-bottom-v3);
    border-left: var(--apercuproduit-t11-content-border-left-v3);
    border-right: var(--apercuproduit-t11-content-border-right-v3);
    box-shadow: var(--apercuproduit-t11-content-shadow-v3);
}

.apercu-produit a{
    color: #212529;
}

.apercu-produit .img-produit {
    object-fit: cover;
    object-position: center;
}

.apercu-produit .content {
    text-align: var(--apercuproduit-t11-content-align);
    padding: var(--apercuproduit-t11-content-padding);

    background: var(--apercuproduit-t11-content-bgcolor-v1);
    backdrop-filter: blur(--apercuproduit-t11-content-blur-v1);
}
.fond2 .apercu-produit .content {
    background: var(--apercuproduit-t11-content-bgcolor-v2);
    backdrop-filter: blur(--apercuproduit-t11-content-blur-v2);
}
.fond3 .apercu-produit .content {
    background: var(--apercuproduit-t11-content-bgcolor-v3);
    backdrop-filter: blur(--apercuproduit-t11-content-blur-v3);
}


.apercu-produit h3{
    font-size: var(--apercuproduit-t11-titre-size);
    color: var(--apercuproduit-t11-titre-color-v1);
}
.fond2 .apercu-produit h3 {
    color: var(--apercuproduit-t11-titre-color-v2);
}
.fond3 .apercu-produit h3 {
    color: var(--apercuproduit-t11-titre-color-v3);
}


.apercu-produit .more {
    font-size: var(--apercuproduit-t11-more-size);
    font-weight: var(--apercuproduit-t11-more-fontweight);

    color: var(--apercuproduit-t11-more-color-v1);
}
.fond2 .apercu-produit .more {
    color: var(--apercuproduit-t11-more-color-v2);
}
.fond3 .apercu-produit .more {
    color: var(--apercuproduit-t11-more-color-v3);
}


.apercu-produit .prixbarre {
    font-size: var(--apercuproduit-t11-prixbarre-size);

    color: var(--apercuproduit-t11-prixbarre-color-v1);
}
.fond2 .apercu-produit .prixbarre {
    color: var(--apercuproduit-t11-prixbarre-color-v2);
}
.fond3 .apercu-produit .prixbarre {
    color: var(--apercuproduit-t11-prixbarre-color-v3);
}


.apercu-produit .prix {
    font-weight: bold;
    font-size: var(--apercuproduit-t11-prix-size);

    color: var(--apercuproduit-t11-prix-color-v1);
}
.fond2 .apercu-produit .prix {
    color: var(--apercuproduit-t11-prix-color-v2);
}
.fond3 .apercu-produit .prix {
    color: var(--apercuproduit-t11-prix-color-v3);
}



.apercu-produit .btn {
    padding: var(--apercuproduit-t11-btn-padding);
    font-size: var(--apercuproduit-t11-btn-size);
    border-radius: var(--apercuproduit-t11-btn-radius);

    background: var(--apercuproduit-t11-btn-bgcolor-v1);
    color: var(--apercuproduit-t11-btn-color-v1);
    /*border: var(--apercuproduit-t11-btn-border-v1) !important;*/
    border-top: var(--apercuproduit-t11-btn-border-top-v1) !important;
    border-bottom: var(--apercuproduit-t11-btn-border-bottom-v1) !important;
    border-left: var(--apercuproduit-t11-btn-border-left-v1) !important;
    border-right: var(--apercuproduit-t11-btn-border-right-v1) !important;
}
.apercu-produit .btn:hover {
    background: var(--apercuproduit-t11-btn-color-v1)!important;
    color: var(--apercuproduit-t11-btn-bgcolor-v1)!important;
}

.fond2 .apercu-produit .btn {
    background: var(--apercuproduit-t11-btn-bgcolor-v2);
    color: var(--apercuproduit-t11-btn-color-v2);
    /*border: var(--apercuproduit-t11-btn-border-v2) !important;*/
    border-top: var(--apercuproduit-t11-btn-border-top-v2) !important;
    border-bottom: var(--apercuproduit-t11-btn-border-bottom-v2) !important;
    border-left: var(--apercuproduit-t11-btn-border-left-v2) !important;
    border-right: var(--apercuproduit-t11-btn-border-right-v2) !important;
}
.fond2 .apercu-produit .btn:hover {
    background: var(--apercuproduit-t11-btn-color-v2)!important;
    color: var(--apercuproduit-t11-btn-bgcolor-v2)!important;
}

.fond3 .apercu-produit .btn {
    background: var(--apercuproduit-t11-btn-bgcolor-v3);
    color: var(--apercuproduit-t11-btn-color-v3);
    /*border: var(--apercuproduit-t11-btn-border-v3) !important;*/
    border-top: var(--apercuproduit-t11-btn-border-top-v3) !important;
    border-bottom: var(--apercuproduit-t11-btn-border-bottom-v3) !important;
    border-left: var(--apercuproduit-t11-btn-border-left-v3) !important;
    border-right: var(--apercuproduit-t11-btn-border-right-v3) !important;
}
.fond3 .apercu-produit .btn-primary:hover {
    background: var(--apercuproduit-t11-btn-color-v3)!important;
    color: var(--apercuproduit-t11-btn-bgcolor-v3)!important;
}





/* ---------- LES PAGES PRODUIT ---------- */
#imageProduit{
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

.prix-produit{
    font-size: 1.25rem;
}



/* ---------- LES APERCUS DES COLLECTIONS ---------- */
.collection-produit.t-9 {
    overflow: hidden;
    background: white;
    -webkit-border-radius: var(--categorieproduits-t9-bloc-radius);
    -moz-border-radius: var(--categorieproduits-t9-bloc-radius);
    border-radius: var(--categorieproduits-t9-bloc-radius);

    /*border: var(--categorieproduits-t9-bloc-border-v1);*/
    border-top: var(--categorieproduits-t9-bloc-border-top-v1);
    border-bottom: var(--categorieproduits-t9-bloc-border-bottom-v1);
    border-left: var(--categorieproduits-t9-bloc-border-left-v1);
    border-right: var(--categorieproduits-t9-bloc-border-right-v1);
    box-shadow: var(--categorieproduits-t9-bloc-shadow-v1);
}

.fond2 .collection-produit.t-9 {
    /*border: var(--categorieproduits-t9-bloc-border-v2);*/
    border-top: var(--categorieproduits-t9-bloc-border-top-v2);
    border-bottom: var(--categorieproduits-t9-bloc-border-bottom-v2);
    border-left: var(--categorieproduits-t9-bloc-border-left-v2);
    border-right: var(--categorieproduits-t9-bloc-border-right-v2);
    box-shadow: var(--categorieproduits-t9-bloc-shadow-v2);
}

.fond3 .collection-produit.t-9 {
    /*border: var(--categorieproduits-t9-bloc-border-v3);*/
    border-top: var(--categorieproduits-t9-bloc-border-top-v3);
    border-bottom: var(--categorieproduits-t9-bloc-border-bottom-v3);
    border-left: var(--categorieproduits-t9-bloc-border-left-v3);
    border-right: var(--categorieproduits-t9-bloc-border-right-v3);
    box-shadow: var(--categorieproduits-t9-bloc-shadow-v3);
}

.collection-produit.t-9 .content {
    text-align: var(--categorieproduits-t9-content-align);
    padding: var(--categorieproduits-t9-content-padding);

    background: var(--categorieproduits-t9-content-bgcolor-v1);
    backdrop-filter: blur(var(--categorieproduits-t9-content-blur-v1));
}

.fond2 .collection-produit.t-9 .content {
    background: var(--categorieproduits-t9-content-bgcolor-v2);
    backdrop-filter: blur(var(--categorieproduits-t9-content-blur-v2));
}

.fond3 .collection-produit.t-9 .content {
    background: var(--categorieproduits-t9-content-bgcolor-v3);
    backdrop-filter: blur(var(--categorieproduits-t9-content-blur-v3));
}

.collection-produit.t-9 h3 {
    font-size: var(--categorieproduits-t9-titre-size);
}

.collection-produit.t-9 h3 {
    color: var(--categorieproduits-t9-titre-color-v1);
}

.fond2 .collection-produit.t-9 h3 {
    color: var(--categorieproduits-t9-titre-color-v2);
}

.fond3 .collection-produit.t-9 h3 {
    color: var(--categorieproduits-t9-titre-color-v3);
}

.collection-produit.t-9 p {
    font-size: var(--categorieproduits-t9-texte-size);
}

.collection-produit.t-9 p {
    color: var(--categorieproduits-t9-texte-color-v1);
}

.fond2 .collection-produit.t-9 p {
    color: var(--categorieproduits-t9-texte-color-v2);
}

.fond3 .collection-produit.t-9 p {
    color: var(--categorieproduits-t9-texte-color-v3);
}




.collection-produit.t-24 {
    background: white;
    -webkit-border-radius: var(--categorieproduits-t24-bloc-radius);
    -moz-border-radius: var(--categorieproduits-t24-bloc-radius);
    border-radius: var(--categorieproduits-t24-bloc-radius);
    overflow: hidden;
    background-position: center center;
    background-size: cover;

    box-shadow: var(--categorieproduits-t24-bloc-shadow-v1);
}
.fond2 .collection-produit.t-24 {
    box-shadow: var(--categorieproduits-t24-bloc-shadow-v2);
}
.fond3 .collection-produit.t-24 {
    box-shadow: var(--categorieproduits-t24-bloc-shadow-v3);
}

.collection-produit.t-24 .filtre{
    background: var(--categorieproduits-t24-filtre-bgcolor-v1);
    height: 100%;
}

.fond2 .collection-produit.t-24 .filtre{
    background: var(--categorieproduits-t24-filtre-bgcolor-v2);
    height: 100%;
}

.fond3 .collection-produit.t-24 .filtre{
    background: var(--categorieproduits-t24-filtre-bgcolor-v3);
    height: 100%;
}

.collection-produit.t-24 .content{
    padding: var(--categorieproduits-t24-content-padding);
    color: var(--categorieproduits-t24-content-color-v1);
}

.fond2 .collection-produit.t-24 .filtre{
    color: var(--categorieproduits-t24-content-color-v2);
}

.fond3 .collection-produit.t-24 .filtre{
    color: var(--categorieproduits-t24-content-color-v3);
}

.collection-produit.t-24 .content h3{
    color: var(--categorieproduits-t24-content-color-v1);
    font-size: var(--categorieproduits-t24-content-size);
    font-weight: var(--categorieproduits-t24-content-fontweight);
}
.fond2 .collection-produit.t-24 .content h3{
    color: var(--categorieproduits-t24-content-color-v2);
}
.fond3 .collection-produit.t-24 .content h3{
    color: var(--categorieproduits-t24-content-color-v3);
}



/* ---------- LE BLOG ---------- */
.white-frame{
    background-color: white;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 15px;
    margin-bottom: 25px;
}

.white-frame ul{
    padding-left: 0;
}

.white-frame ul li{
    list-style-type: none;
}



/* ---------- LES APERCUS ARTICLE ---------- */
.apercu-article {
    border-radius: var(--apercuarticle-t12-bloc-radius);
    overflow: hidden;

    /*border: var(--apercuarticle-t12-content-border-v1);*/
    border-top: var(--apercuarticle-t12-content-border-top-v1);
    border-bottom: var(--apercuarticle-t12-content-border-bottom-v1);
    border-left: var(--apercuarticle-t12-content-border-left-v1);
    border-right: var(--apercuarticle-t12-content-border-right-v1);
    box-shadow: var(--apercuarticle-t12-bloc-shadow-v1);
    -moz-box-shadow: var(--apercuarticle-t12-bloc-shadow-v1);
    -webkit-box-shadow: var(--apercuarticle-t12-bloc-shadow-v1);
    backdrop-filter: var(--apercuarticle-t12-content-blur-v1);
}
.fond2 .apercu-article {
    /*border: var(--apercuarticle-t12-content-border-v2);*/
    border-top: var(--apercuarticle-t12-content-border-top-v2);
    border-bottom: var(--apercuarticle-t12-content-border-bottom-v2);
    border-left: var(--apercuarticle-t12-content-border-left-v2);
    border-right: var(--apercuarticle-t12-content-border-right-v2);
    box-shadow: var(--apercuarticle-t12-bloc-shadow-v2);
    -moz-box-shadow: var(--apercuarticle-t12-bloc-shadow-v2);
    -webkit-box-shadow: var(--apercuarticle-t12-bloc-shadow-v2);
    backdrop-filter: var(--apercuarticle-t12-content-blur-v2);
}
.fond3 .apercu-article {
    /*border: var(--apercuarticle-t12-content-border-v3);*/
    border-top: var(--apercuarticle-t12-content-border-top-v3);
    border-bottom: var(--apercuarticle-t12-content-border-bottom-v3);
    border-left: var(--apercuarticle-t12-content-border-left-v3);
    border-right: var(--apercuarticle-t12-content-border-right-v3);
    box-shadow: var(--apercuarticle-t12-bloc-shadow-v3);
    -moz-box-shadow: var(--apercuarticle-t12-bloc-shadow-v3);
    -webkit-box-shadow: var(--apercuarticle-t12-bloc-shadow-v3);
    backdrop-filter: var(--apercuarticle-t12-content-blur-v3);
}


.apercu-article .content {
    text-align: var(--apercuarticle-t12-content-align);
    padding: var(--apercuarticle-t12-content-padding);
    background: var(--apercuarticle-t12-content-bgcolor-v1);
}
.fond2 .apercu-article .content {
    background: var(--apercuarticle-t12-content-bgcolor-v2);
}
.fond3 .apercu-article .content {
    background: var(--apercuarticle-t12-content-bgcolor-v3);
}


.apercu-article .blogCategorie a {
    font-size: var(--apercuarticle-t12-categorie-size);
    font-weight: var(--apercuarticle-t12-categorie-fontweight);
    margin-top: 10px;
    margin-bottom: 10px;

    color: var(--apercuarticle-t12-categorie-color-v1);
}
.fond2 .apercu-article .blogCategorie a {
    color: var(--apercuarticle-t12-categorie-color-v2);
}
.fond3 .apercu-article .blogCategorie a {
    color: var(--apercuarticle-t12-categorie-color-v3);
}


.apercu-article h3 {
    font-weight: bold;
    font-size: var(--apercuarticle-t12-titre-size);

    color: var(--apercuarticle-t12-titre-color-v1);
}
.fond2 .apercu-article h3 {
    color: var(--apercuarticle-t12-titre-color-v2);
}
.fond3 .apercu-article h3 {
    color: var(--apercuarticle-t12-titre-color-v3);
}


.apercu-article p {
    font-size: var(--apercuarticle-t12-texte-size);

    color: var(--apercuarticle-t12-texte-color-v1);
}
.fond2 .apercu-article p {
    color: var(--apercuarticle-t12-texte-color-v2);
}
.fond3 .apercu-article p {
    color: var(--apercuarticle-t12-texte-color-v3);
}


.apercu-article .more {
    font-size: var(--apercuarticle-t12-more-size);
    font-weight: bold;

    color: var(--apercuarticle-t12-more-color-v1);
}
.fond2 .apercu-article .more {
    color: var(--apercuarticle-t12-more-color-v2);
}
.fond3 .apercu-article .more {
    color: var(--apercuarticle-t12-more-color-v3);
}









/* ---------- LES PAGES ARTICLE ---------- */
#article{
    background: #ffffff;
    color: #797979;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 25px;
    margin-bottom: 25px;
}

#article h3{
    font-size: var(--items-t5-titre-size);
}

#article h4, #article h5, #article h6{
    font-size: var(--blocpage-texte-size);
    font-weight: bold;
}




/* ---------- LE PIED DE PAGE ---------- */
footer{
    background: var(--footer-t4-general-bgcolor);
    color: white;
    padding-top: 50px;
    padding-bottom: 50px;
}

footer.fixed{
    z-index: -10;
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
}

footer h4 {
    color: var(--footer-t4-titre-color);
    font-size: var(--footer-t4-titre-size);
}

footer p {
    color: var(--footer-t4-texte-color);
    font-size: var(--footer-t4-texte-size);
}

footer a, footer a:hover {
    color: var(--footer-t4-lien-color);
}

footer ul{
    padding-left: 0;
}

footer ul li{
    list-style-type: none;
    font-size: var(--footer-t4-texte-size);
}

footer .fas, footer .far, footer .fab {
    font-size: 1.5rem;
    margin-top: 10px;
    margin-right: 20px;
}

footer .container img {
    width: initial;
}



/* ---------- LES DERNIERS DETAILS ---------- */
.drapeau-france {
    width: initial !important;
}


.container-enabled {
    background: rgba(255,255,255,0.2);
    padding: 25px;
    border-radius: 10px;
    backdrop-filter: blur(7px);
}



/*.container-debordement-droit,
.container-debordement-gauche {
    width: 100%;
    overflow-x: hidden;
}
.container-debordement-droit {
    margin-left: auto;
    padding-left: 15px;
}
.container-debordement-droit > .cadre {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.container-debordement-gauche {
    margin-right: auto;
    padding-right: 15px;
}
.container-debordement-gauche > .cadre {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
@media (min-width: 576px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(540px + (100% - 540px)/2);
    }
}
@media (min-width: 768px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(720px + (100% - 720px)/2);
    }
}
@media (min-width: 992px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(960px + (100% - 960px)/2);
    }
}
@media (min-width: 1200px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(1140px + (100% - 1140px)/2);
    }
}*/



.container-debordement-droit,
.container-debordement-gauche {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
}
.container-debordement-droit .div-texte,
.container-debordement-gauche .div-texte {
    margin: 0 auto;
}
@media (min-width: 576px) {
    .container-debordement-droit .div-texte,
    .container-debordement-gauche .div-texte {
        max-width: 540px;
    }
}
@media (min-width: 768px) {
    .container-debordement-droit {
        margin-left: auto;
    }
    .container-debordement-droit > .cadre {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .container-debordement-gauche {
        margin-right: auto;
    }
    .container-debordement-gauche > .cadre {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
    .container-debordement-droit .div-texte,
    .container-debordement-gauche .div-texte {
        max-width: none;
        padding-right: 0;
        padding-left: 0;
    }


    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(720px + (100% - 720px)/2);
    }
}
@media (min-width: 992px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(960px + (100% - 960px)/2);
    }
}
@media (min-width: 1200px) {
    .container-debordement-droit,
    .container-debordement-gauche {
        max-width: calc(1140px + (100% - 1140px)/2);
    }
}



/* ---------- LE TUNNEL D'ACHAT ---------- */
#commande {
    overflow-x: hidden;
}

#commande .div-colonnes  {
    min-height: 100vh;
}

#commande .div-colonnes > aside::after {
    background-color: #e4e4e4;
    border-left: 1px solid darkgrey;
    content: '';
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 300%;
    z-index: -1;
}

#commande .div-image-produit {
    position: relative;
}

#commande .div-image-produit > p {
    position: absolute;
    top: 0;
    right: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: translate(50%, -50%);
    background: var(--blocpage-bouton-bgcolor-v1);
    color: var(--blocpage-bouton-color-v1);
    border-radius: 50%;
    min-width: 33px;
    aspect-ratio: 1 / 1;
    font-size: 14px;
    margin: 0;
    padding: 6px;
    line-height: 0;
}

@media screen and (max-width: 767px) {
    #commande .div-colonnes > aside::after {
        left: -50%;
    }
}










/* A CLASSER */
.blocpage h2 small{
    display: block;
    color: var(--blocpage-soustitre-color-v1);
    font-size: var(--blocpage-soustitre-size);
    margin-bottom: 15px;
}

.blocpage.fond2 h2 small{
    color: var(--blocpage-soustitre-color-v2);
}

.blocpage.fond3 h2 small{
    color: var(--blocpage-soustitre-color-v3);
}







.cadre {
    background: var(--blocpage-t26-cadre-bgcolor-v1);
    padding: var(--blocpage-t26-cadre-padding);
    border-radius: var(--blocpage-t26-cadre-radius);
    box-shadow: var(--blocpage-t26-cadre-shadow-v1);
}

.fond2 .cadre {
    background: var(--blocpage-t26-cadre-bgcolor-v2);
    box-shadow: var(--blocpage-t26-cadre-shadow-v2);
}

.fond3 .cadre {
    background: var(--blocpage-t26-cadre-bgcolor-v3);
    box-shadow: var(--blocpage-t26-cadre-shadow-v3);
}

.cadre h2 {
    font-size: var(--blocpage-t26-titre-size);
    color: var(--blocpage-t26-titre-color-v1);
}

.fond2 .cadre h2 {
    color: var(--blocpage-t26-titre-color-v2);
}

.fond3 .cadre h2 {
    color: var(--blocpage-t26-titre-color-v3);
}

.cadre h2 small{
    color: var(--blocpage-t26-soustitre-color-v1);
    font-size: var(--blocpage-t26-soustitre-size);
}

.fond2 .cadre h2 small{
    color: var(--blocpage-t26-soustitre-color-v2);
}

.fond3 .cadre h2 small{
    color: var(--blocpage-t26-soustitre-color-v3);
}

.cadre h2 strong{
    color: var(--blocpage-t26-titrestrong-color-v1);
    font-weight: var(--blocpage-t26-titrestrong-fontweight);
}

.fond2 .cadre h2 strong{
    color: var(--blocpage-t26-titrestrong-color-v2);
    font-weight: var(--blocpage-t26-titrestrong-fontweight);
}

.fond3 .cadre h2 strong{
    color: var(--blocpage-t26-titrestrong-color-v3);
    font-weight: var(--blocpage-t26-titrestrong-fontweight);
}

.cadre p{
    color: var(--blocpage-t26-texte-color-v1);
    font-size: var(--blocpage-t26-texte-size);
}
.cadre p:last-of-type{
    margin-bottom: 0;
}

.fond2 .cadre p{
    color: var(--blocpage-t26-texte-color-v2);
}

.fond3 .cadre p{
    color: var(--blocpage-t26-texte-color-v3);
}




.cadre .btn-primary {
    background: var(--blocpage-t26-bouton-bgcolor-v1);
    color: var(--blocpage-t26-bouton-color-v1);
    /*border: var(--blocpage-t26-bouton-border-v1);*/
    border-top: var(--blocpage-t26-bouton-border-top-v1);
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v1);
    border-left: var(--blocpage-t26-bouton-border-left-v1);
    border-right: var(--blocpage-t26-bouton-border-right-v1);
}
.cadre .btn-secondary {
    background: var(--blocpage-t26-btnsecondary-bgcolor-v1);
    color: var(--blocpage-t26-btnsecondary-color-v1);
    /*border: var(--blocpage-t26-btnsecondary-border-v1);*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v1);
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v1);
    border-left: var(--blocpage-t26-btnsecondary-border-left-v1);
    border-right: var(--blocpage-t26-btnsecondary-border-right-v1);
}
.cadre .btn:hover,
.cadre .btn:focus,
.cadre .btn:active,
.cadre .btn:active:focus {
    box-shadow: none!important;
}
.cadre .btn-primary:hover,
.cadre .btn-primary:focus,
.cadre .btn-primary:active,
.cadre .btn-primary:active:focus {
    background: var(--blocpage-t26-bouton-color-v1)!important;
    color: var(--blocpage-t26-bouton-bgcolor-v1)!important;
    /*border: var(--blocpage-t26-bouton-border-v1) !important;*/
    border-top: var(--blocpage-t26-bouton-border-top-v1) !important;
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v1) !important;
    border-left: var(--blocpage-t26-bouton-border-left-v1) !important;
    border-right: var(--blocpage-t26-bouton-border-right-v1) !important;
}
.cadre .btn-secondary:hover,
.cadre .btn-secondary:focus,
.cadre .btn-secondary:active,
.cadre .btn-secondary:active:focus {
    background: var(--blocpage-t26-btnsecondary-color-v1)!important;
    color: var(--blocpage-t26-btnsecondary-bgcolor-v1)!important;
    /*border: var(--blocpage-t26-btnsecondary-border-v1) !important;*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v1) !important;
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v1) !important;
    border-left: var(--blocpage-t26-btnsecondary-border-left-v1) !important;
    border-right: var(--blocpage-t26-btnsecondary-border-right-v1) !important;
}

.fond2 .cadre .btn-primary {
    background: var(--blocpage-t26-bouton-bgcolor-v2);
    color: var(--blocpage-t26-bouton-color-v2);
    /*border: var(--blocpage-t26-bouton-border-v2);*/
    border-top: var(--blocpage-t26-bouton-border-top-v2);
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v2);
    border-left: var(--blocpage-t26-bouton-border-left-v2);
    border-right: var(--blocpage-t26-bouton-border-right-v2);
}
.fond2 .cadre .btn-secondary {
    background: var(--blocpage-t26-btnsecondary-bgcolor-v2);
    color: var(--blocpage-t26-btnsecondary-color-v2);
    /*border: var(--blocpage-t26-btnsecondary-border-v2);*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v2);
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v2);
    border-left: var(--blocpage-t26-btnsecondary-border-left-v2);
    border-right: var(--blocpage-t26-btnsecondary-border-right-v2);
}

.fond2 .cadre .btn:hover,
.fond2 .cadre .btn:focus,
.fond2 .cadre .btn:active,
.fond2 .cadre .btn:active:focus {
    box-shadow: none !important;
}
.fond2 .cadre .btn-primary:hover,
.fond2 .cadre .btn-primary:focus,
.fond2 .cadre .btn-primary:active,
.fond2 .cadre .btn-primary:active:focus {
    background: var(--blocpage-t26-bouton-color-v2) !important;
    color: var(--blocpage-t26-bouton-bgcolor-v2) !important;
    /*border: var(--blocpage-t26-bouton-border-v2) !important;*/
    border-top: var(--blocpage-t26-bouton-border-top-v2) !important;
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v2) !important;
    border-left: var(--blocpage-t26-bouton-border-left-v2) !important;
    border-right: var(--blocpage-t26-bouton-border-right-v2) !important;
}
.fond2 .cadre .btn-secondary:hover,
.fond2 .cadre .btn-secondary:focus,
.fond2 .cadre .btn-secondary:active,
.fond2 .cadre .btn-secondary:active:focus {
    background: var(--blocpage-t26-btnsecondary-color-v2) !important;
    color: var(--blocpage-t26-btnsecondary-bgcolor-v2) !important;
    /*border: var(--blocpage-t26-btnsecondary-border-v2) !important;*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v2) !important;
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v2) !important;
    border-left: var(--blocpage-t26-btnsecondary-border-left-v2) !important;
    border-right: var(--blocpage-t26-btnsecondary-border-right-v2) !important;
}

.fond3 .cadre .btn-primary {
    background: var(--blocpage-t26-bouton-bgcolor-v3);
    color: var(--blocpage-t26-bouton-color-v3);
    /*border: var(--blocpage-t26-bouton-border-v3);*/
    border-top: var(--blocpage-t26-bouton-border-top-v3);
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v3);
    border-left: var(--blocpage-t26-bouton-border-left-v3);
    border-right: var(--blocpage-t26-bouton-border-right-v3);
}
.fond3 .cadre .btn-secondary {
    background: var(--blocpage-t26-btnsecondary-bgcolor-v3);
    color: var(--blocpage-t26-btnsecondary-color-v3);
    /*border: var(--blocpage-t26-btnsecondary-border-v3);*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v3);
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v3);
    border-left: var(--blocpage-t26-btnsecondary-border-left-v3);
    border-right: var(--blocpage-t26-btnsecondary-border-right-v3);
}

.fond3 .cadre .btn:hover,
.fond3 .cadre .btn:focus,
.fond3 .cadre .btn:active,
.fond3 .cadre .btn:active:focus {
    box-shadow: none !important;
}
.fond3 .cadre .btn-primary:hover,
.fond3 .cadre .btn-primary:focus,
.fond3 .cadre .btn-primary:active,
.fond3 .cadre .btn-primary:active:focus {
    background: var(--blocpage-t26-bouton-color-v3)!important;
    color: var(--blocpage-t26-bouton-bgcolor-v3)!important;
    /*border: var(--blocpage-t26-bouton-border-v3) !important;*/
    border-top: var(--blocpage-t26-bouton-border-top-v3) !important;
    border-bottom: var(--blocpage-t26-bouton-border-bottom-v3) !important;
    border-left: var(--blocpage-t26-bouton-border-left-v3) !important;
    border-right: var(--blocpage-t26-bouton-border-right-v3) !important;
}
.fond3 .cadre .btn-secondary:hover,
.fond3 .cadre .btn-secondary:focus,
.fond3 .cadre .btn-secondary:active,
.fond3 .cadre .btn-secondary:active:focus {
    background: var(--blocpage-t26-btnsecondary-color-v3)!important;
    color: var(--blocpage-t26-btnsecondary-bgcolor-v3)!important;
    /*border: var(--blocpage-t26-btnsecondary-border-v3) !important;*/
    border-top: var(--blocpage-t26-btnsecondary-border-top-v3) !important;
    border-bottom: var(--blocpage-t26-btnsecondary-border-bottom-v3) !important;
    border-left: var(--blocpage-t26-btnsecondary-border-left-v3) !important;
    border-right: var(--blocpage-t26-btnsecondary-border-right-v3) !important;
}





/* --------------------------------------------------
-----------------------------------------------------
--------------------- TEMPLATES ---------------------
-----------------------------------------------------
-------------------------------------------------- */

.blocpage .cadre {
    background-position: center;
    background-size: cover;
}


.blocpage .contenu p:last-child {
    margin: 0;
}



/* ---------------------------------
------------------------------------
TEXTES
------------------------------------
--------------------------------- */

/* ---------------------------------
Bouton sur le coté
--------------------------------- */
.blocpage.bloctexte.t-18 .btn {
    margin: 0;
}

/* ---------------------------------
Texte sur le côté
--------------------------------- */

/* ---------------------------------
Cadre bouton sur le côté
--------------------------------- */
.blocpage.bloctexte.t-87 .btn {
    margin: 0;
}

/* ---------------------------------
Cadre texte sur le côté
--------------------------------- */








/* ---------------------------------
------------------------------------
IMAGE & TEXTES
------------------------------------
--------------------------------- */

/* ---------------------------------
Titre et texte sur le côté
--------------------------------- */
.blocpage.blocimagetexte.t-19 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-19.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-19 .div-image {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Titre au dessus et texte sur le côté
--------------------------------- */
.blocpage.blocimagetexte.t-35 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-35.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-35 .div-image {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Image collée aux bords
--------------------------------- */
.blocpage.blocimagetexte.t-20 .div-texte {
    height: 100%;
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-20.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-20 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
        padding-left: 0;
        padding-right: 0;
    }
    .blocpage.blocimagetexte.t-20.ordre-txtImg .div-image {
        margin-left: 15px;
    }
    .blocpage.blocimagetexte.t-20.ordre-imgTxt .div-image {
        margin-right: 15px;
    }
    .blocpage.blocimagetexte.t-20 .div-image {
        height: 100%;
    }
    .blocpage.blocimagetexte.t-20 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Cadre sur le côté
--------------------------------- */
.blocpage.blocimagetexte.t-27 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-27.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-27 .div-image {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre avec marge
--------------------------------- */
.blocpage.blocimagetexte.t-36 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-36.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-36 .div-image {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre sans marge
--------------------------------- */
.blocpage.blocimagetexte.t-37 .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocimagetexte.t-37 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    height: 100%;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-37.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-37 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
    }
    .blocpage.blocimagetexte.t-37.ordre-imgTxt .div-texte {
        padding-left: 0;
    }
    .blocpage.blocimagetexte.t-37.ordre-txtImg .div-texte {
        padding-right: 0;
    }
    .blocpage.blocimagetexte.t-37 .div-image {
        height: 100%;
    }
    .blocpage.blocimagetexte.t-37 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Cadre sans marge sur le côté
--------------------------------- */
/*.blocpage.blocimagetexte.t-39 .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocimagetexte.t-39 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
}
.blocpage.blocimagetexte.t-39 .div-image {
    padding: var(--blocpage-t26-cadre-padding);
    padding-bottom: 0;
}
.blocpage.blocimagetexte.t-39.ordre-imgTxt .div-image {
    padding-left: 0;
}
.blocpage.blocimagetexte.t-39.ordre-txtImg .div-image {
    padding-right: 0;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-39.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocimagetexte.t-39 .cadre {
        padding: var(--blocpage-t26-cadre-padding);
    }
    .blocpage.blocimagetexte.t-39.ordre-imgTxt .cadre {
        padding-left: 0;
    }
    .blocpage.blocimagetexte.t-39.ordre-txtImg .cadre {
        padding-right: 0;
    }
    .blocpage.blocimagetexte.t-39 .div-texte {
        padding: 0;
    }
    .blocpage.blocimagetexte.t-39 .div-image {
        padding: 0;
    }
}*/

/* ---------------------------------
Chevauchement image en avant
--------------------------------- */
.blocpage.blocimagetexte.t-33 .div-image {
    position: relative;
    z-index: 1;
    margin: 0 30px;
}
.blocpage.blocimagetexte.t-33 .cadre {
    margin-top: -50px;
}
.blocpage.blocimagetexte.t-33 .cadre .div-texte {
    padding-top: 50px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-33.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocimagetexte.t-33 .div-image {
        margin: 0;
    }
    .blocpage.blocimagetexte.t-33 .cadre {
        margin-top: 0;
    }
    .blocpage.blocimagetexte.t-33.ordre-txtImg .cadre {
        padding-right: 0;
        margin-right: -200px;
    }
    .blocpage.blocimagetexte.t-33.ordre-imgTxt .cadre {
        padding-left: 0;
        margin-left: -200px;
    }

    .blocpage.blocimagetexte.t-33 .cadre .div-texte {
        padding-top: 0;
    }
    .blocpage.blocimagetexte.t-33.ordre-txtImg .cadre .div-texte {
        margin-right: 200px;
    }
    .blocpage.blocimagetexte.t-33.ordre-imgTxt .cadre .div-texte {
        margin-left: 200px;
    }
}

/* ---------------------------------
Chevauchement cadre en avant
--------------------------------- */
.blocpage.blocimagetexte.t-32 .cadre {
    position: relative;
    z-index: 1;
    margin: 0 30px;
    margin-top: -50px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-32.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocimagetexte.t-32 .cadre {
        margin: 0;
    }
    .blocpage.blocimagetexte.t-32.ordre-imgTxt .cadre {
        margin-left: -200px;
    }
    .blocpage.blocimagetexte.t-32.ordre-txtImg .cadre {
        margin-right: -200px;
    }
}


/* ---------------------------------
Chevauchement image pleine cadre en avant
--------------------------------- */
/*.blocpage.blocimagetexte.t-41 .cadre {
    position: relative;
    z-index: 1;
    margin: 0 30px;
    margin-top: -50px;
}

@media (min-width: 768px) {
    .blocpage.blocimagetexte.t-41.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocimagetexte.t-41 .cadre {
        margin: 0;
    }
    .blocpage.blocimagetexte.t-41.ordre-txtImg .cadre {
        margin-right: -200px;
    }
    .blocpage.blocimagetexte.t-41.ordre-imgTxt .cadre {
        margin-left: -200px;
    }
}*/

/* ---------------------------------
Cadre filtre plein
--------------------------------- */
/*.blocpage.blocimagetexte.template-filtrePlein .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocimagetexte.template-filtrePlein .filtre {
    padding: var(--blocpage-t26-cadre-padding);
}*/

/* ---------------------------------
Cadre filtre bandeau
--------------------------------- */
/*.blocpage.blocimagetexte.template-filtreBandeau .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocimagetexte.template-filtreBandeau .filtre {
    padding: var(--blocpage-t26-cadre-padding);
}*/

/* ---------------------------------
Cadre filtre texte
--------------------------------- */
/*.blocpage.blocimagetexte.template-filtreTexte .filtre {
    padding: var(--blocpage-t26-cadre-padding);
    border-radius: var(--blocpage-t26-cadre-radius);
}*/

/* ---------------------------------
Cadre cadre texte
--------------------------------- */








/* ---------------------------------
------------------------------------
VIDEO & TEXTES
------------------------------------
--------------------------------- */
.blocpage.blocvideotexte .div-video .embed-responsive {
    height: 100%;
}

/* ---------------------------------
Titre et texte sur le côté
--------------------------------- */
.blocpage.blocvideotexte.t-21 .div-video {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-21.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-21 .div-video {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Titre au dessus et texte sur le côté
--------------------------------- */
.blocpage.blocvideotexte.t-110 .div-video {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-110.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-110 .div-video {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Vidéo collée aux bords
--------------------------------- */
.blocpage.blocvideotexte.t-111 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    height: 100%;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-111.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-111 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
        padding-left: 0;
        padding-right: 0;
    }
    .blocpage.blocvideotexte.t-111.ordre-txtImg .div-video {
        margin-left: 15px;
    }
    .blocpage.blocvideotexte.t-111.ordre-imgTxt .div-video {
        margin-right: 15px;
    }
    .blocpage.blocvideotexte.t-111 .div-video {
        height: 100%;
    }
    .blocpage.blocvideotexte.t-111 .div-video img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Cadre sur le côté
--------------------------------- */
.blocpage.blocvideotexte.t-112 .div-video {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-112.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-112 .div-video {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre avec marge
--------------------------------- */
.blocpage.blocvideotexte.t-113 .div-video {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-113.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-113 .div-video {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre sans marge
--------------------------------- */
.blocpage.blocvideotexte.t-114 .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocvideotexte.t-114 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    height: 100%;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-114.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocvideotexte.t-114 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
    }
    .blocpage.blocvideotexte.t-114.ordre-imgTxt .div-texte {
        padding-left: 0;
    }
    .blocpage.blocvideotexte.t-114.ordre-txtImg .div-texte {
        padding-right: 0;
    }
    .blocpage.blocvideotexte.t-114 .div-video {
        height: 100%;
    }
    .blocpage.blocvideotexte.t-114 .div-video img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Chevauchement video en avant
--------------------------------- */
.blocpage.blocvideotexte.t-115 .div-video {
    position: relative;
    z-index: 1;
    margin: 0 30px;
}
.blocpage.blocvideotexte.t-115 .cadre {
    margin-top: -50px;
}
.blocpage.blocvideotexte.t-115 .cadre .div-texte {
    padding-top: 50px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-115.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocvideotexte.t-115 .div-video {
        margin: 0;
    }
    .blocpage.blocvideotexte.t-115 .cadre {
        margin-top: 0;
    }
    .blocpage.blocvideotexte.t-115.ordre-txtImg .cadre {
        padding-right: 0;
        margin-right: -200px;
    }
    .blocpage.blocvideotexte.t-115.ordre-imgTxt .cadre {
        padding-left: 0;
        margin-left: -200px;
    }

    .blocpage.blocvideotexte.t-115 .cadre .div-texte {
        padding-top: 0;
    }
    .blocpage.blocvideotexte.t-115.ordre-txtImg .cadre .div-texte {
        margin-right: 200px;
    }
    .blocpage.blocvideotexte.t-115.ordre-imgTxt .cadre .div-texte {
        margin-left: 200px;
    }
}

/* ---------------------------------
Chevauchement cadre en avant
--------------------------------- */
.blocpage.blocvideotexte.t-116 .cadre {
    position: relative;
    z-index: 1;
    margin: 0 30px;
    margin-top: -50px;
}

@media (min-width: 768px) {
    .blocpage.blocvideotexte.t-116.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocvideotexte.t-116 .cadre {
        margin: 0;
    }
    .blocpage.blocvideotexte.t-116.ordre-imgTxt .cadre {
        margin-left: -200px;
    }
    .blocpage.blocvideotexte.t-116.ordre-txtImg .cadre {
        margin-right: -200px;
    }
}






/* ---------------------------------
------------------------------------
PRODUIT EN AVANT
------------------------------------
--------------------------------- */
.blocpage.blocproduit .produit-prix {
    display: flex;
    align-items: center;
    gap: 10px;
}
.blocpage.blocproduit .produit-prix p {
    margin-bottom: 0;
    font-size: 1em;
}
.blocpage.blocproduit .produit-prix .prix-plein {
    text-decoration: line-through;
}
.blocpage.blocproduit .produit-prix .prix {
    font-size: 1.5em;
    font-weight: 600;
}

/* ---------------------------------
Titre et texte sur le côté
--------------------------------- */
.blocpage.blocproduit.t-141 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-141.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-141 .div-image {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Titre au dessus et texte sur le côté
--------------------------------- */
.blocpage.blocproduit.t-142 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-142.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-142 .div-image {
        margin-bottom: 0;
    }
}

/* ---------------------------------
Produit collée aux bords
--------------------------------- */
.blocpage.blocproduit.t-143 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    height: 100%;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-143.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-143 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
        padding-left: 0;
        padding-right: 0;
    }
    .blocpage.blocproduit.t-143.ordre-txtImg .div-image {
        margin-left: 15px;
    }
    .blocpage.blocproduit.t-143.ordre-imgTxt .div-image {
        margin-right: 15px;
    }
    .blocpage.blocproduit.t-143 .div-image {
        height: 100%;
    }
    .blocpage.blocproduit.t-143 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Cadre sur le côté
--------------------------------- */
.blocpage.blocproduit.t-144 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-144.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-144 .div-image {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre avec marge
--------------------------------- */
.blocpage.blocproduit.t-145 .div-image {
    margin-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-145.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-145 .div-image {
        margin-bottom: 0px;
    }
}

/* ---------------------------------
Cadre sans marge
--------------------------------- */
.blocpage.blocproduit.t-146 .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.blocproduit.t-146 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-top: 16px;
    height: 100%;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-146.ordre-txtImg .row {
        flex-direction: row-reverse;
    }
    .blocpage.blocproduit.t-146 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
    }
    .blocpage.blocproduit.t-146.ordre-imgTxt .div-texte {
        padding-left: 0;
    }
    .blocpage.blocproduit.t-146.ordre-txtImg .div-texte {
        padding-right: 0;
    }
    .blocpage.blocproduit.t-146 .div-image {
        height: 100%;
    }
    .blocpage.blocproduit.t-146 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}

/* ---------------------------------
Chevauchement video en avant
--------------------------------- */
.blocpage.blocproduit.t-147 .div-image {
    position: relative;
    z-index: 1;
    margin: 0 30px;
}
.blocpage.blocproduit.t-147 .cadre {
    margin-top: -50px;
}
.blocpage.blocproduit.t-147 .cadre .div-texte {
    padding-top: 50px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-147.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocproduit.t-147 .div-image {
        margin: 0;
    }
    .blocpage.blocproduit.t-147 .cadre {
        margin-top: 0;
    }
    .blocpage.blocproduit.t-147.ordre-txtImg .cadre {
        padding-right: 0;
        margin-right: -200px;
    }
    .blocpage.blocproduit.t-147.ordre-imgTxt .cadre {
        padding-left: 0;
        margin-left: -200px;
    }

    .blocpage.blocproduit.t-147 .cadre .div-texte {
        padding-top: 0;
    }
    .blocpage.blocproduit.t-147.ordre-txtImg .cadre .div-texte {
        margin-right: 200px;
    }
    .blocpage.blocproduit.t-147.ordre-imgTxt .cadre .div-texte {
        margin-left: 200px;
    }
}

/* ---------------------------------
Chevauchement cadre en avant
--------------------------------- */
.blocpage.blocproduit.t-148 .cadre {
    position: relative;
    z-index: 1;
    margin: 0 30px;
    margin-top: -50px;
}

@media (min-width: 768px) {
    .blocpage.blocproduit.t-148.ordre-txtImg .row {
        flex-direction: row-reverse;
    }

    .blocpage.blocproduit.t-148 .cadre {
        margin: 0;
    }
    .blocpage.blocproduit.t-148.ordre-imgTxt .cadre {
        margin-left: -200px;
    }
    .blocpage.blocproduit.t-148.ordre-txtImg .cadre {
        margin-right: -200px;
    }
}










/* ---------------------------------
------------------------------------
COLONNES DE CONTENUS
------------------------------------
--------------------------------- */

/* ---------------------------------
Défilements
--------------------------------- */
.blocpage.blocitems.t-149 .container-fluid,
.blocpage.blocitems.t-150 .container-fluid,
.blocpage.blocitems.t-151 .container-fluid,
.blocpage.blocitems.t-152 .container-fluid,
.blocpage.blocitems.t-153 .container-fluid {
    overflow: hidden;
}
.blocpage.blocitems.t-149 .div-defileur,
.blocpage.blocitems.t-150 .div-defileur,
.blocpage.blocitems.t-151 .div-defileur,
.blocpage.blocitems.t-152 .div-defileur,
.blocpage.blocitems.t-153 .div-defileur {
    background-color: blue;
    animation-play-state: running;
    animation: defilementItems calc(var(--animation-defilement-duree) * var(--nb-items)) infinite linear;
    width: calc((100% / var(--nb-colonnes)) * (var(--nb-items) * var(--nb-boucles)));
    /*transform: translateX(calc(-100% / var(--nb-boucles)));*/
}

@keyframes defilementItems {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(calc(-100% / var(--nb-boucles))); /*-50%*/
    }
}

.blocpage.blocitems.t-149 .div-defileur:hover,
.blocpage.blocitems.t-150 .div-defileur:hover,
.blocpage.blocitems.t-151 .div-defileur:hover,
.blocpage.blocitems.t-152 .div-defileur:hover,
.blocpage.blocitems.t-153 .div-defileur:hover {
    animation-play-state: paused;
}
.blocpage.blocitems.t-149 .items,
.blocpage.blocitems.t-150 .items,
.blocpage.blocitems.t-151 .items,
.blocpage.blocitems.t-152 .items,
.blocpage.blocitems.t-153 .items {
    display: flex;
    flex-wrap: nowrap;
}
.blocpage.blocitems.t-149 .items .item,
.blocpage.blocitems.t-150 .items .item,
.blocpage.blocitems.t-151 .items .item,
.blocpage.blocitems.t-152 .items .item,
.blocpage.blocitems.t-153 .items .item {
    position: relative;
    padding-right: 15px;
    padding-left: 15px;
    width: 100%;
}







/* ---------------------------------
------------------------------------
EN-TÊTE
------------------------------------
--------------------------------- */
#illustration {
    display: flex;
}

#illustration .contenu p:last-child {
    margin: 0;
}

#illustration h1 small {
    display: block;
    margin-bottom: 15px;
}

.minHeight-50 {
    min-height: 50vh;
}
.minHeight-75 {
    min-height: 75vh;
}
.minHeight-90 {
    min-height: 90vh;
}
.minHeight-100 {
    min-height: 100vh;
}

/* --------------------
SANS CADRE
-------------------- */
/* ---------------------------------
Image et vidéo d'arrière plan
--------------------------------- */
#illustration.t-6,
#illustration.t-156 {
    background-position: center center;
    background-size: cover;
    background-color: white;
    text-align: var(--entete-t6-general-align);
}
#illustration.t-6 .filtre,
#illustration.t-156 .filtre {
    background: var(--entete-t6-filtre-bgcolor);
    /*display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 75vh;
    padding-top: 50px;
    padding-bottom: 50px;*/

    width: 100%;
    display: flex;
    align-items: center;
    padding-top: 140px; /*170px*/
    padding-bottom: 50px;
}
#illustration.t-6 h1 small,
#illustration.t-156 h1 small {
    color: var(--entete-t6-soustitre-color);
    font-size: var(--entete-t6-soustitre-size);
}
#illustration.t-6 h1,
#illustration.t-156 h1 {
    color: var(--entete-t6-titre-color);
    font-size: var(--entete-t6-titre-size);
}
#illustration.t-6 h1 strong,
#illustration.t-156 h1 strong {
    color: var(--entete-t6-titrestrong-color);
    font-weight: var(--entete-t6-titrestrong-fontweight);
}
#illustration.t-6 .contenu p,
#illustration.t-156 .contenu p {
    color: var(--entete-t6-texte-color);
    font-size: var(--entete-t6-texte-size);
}
#illustration.t-6 .div-boutons,
#illustration.t-156 .div-boutons {
    justify-content: var(--entete-t6-general-align);
}
#illustration.t-6 .btn,
#illustration.t-156 .btn {
    border-radius: var(--entete-t6-bouton-radius);
    font-size: var(--entete-t6-bouton-size);
    padding: var(--entete-t6-bouton-padding);
}
#illustration.t-6 .btn-primary,
#illustration.t-156 .btn-primary {
    background: var(--entete-t6-bouton-bgcolor);
    color: var(--entete-t6-bouton-color);
    /*border: var(--entete-t6-bouton-border);*/
    border-top: var(--entete-t6-bouton-border-top);
    border-bottom: var(--entete-t6-bouton-border-bottom);
    border-left: var(--entete-t6-bouton-border-left);
    border-right: var(--entete-t6-bouton-border-right);
}
#illustration.t-6 .btn-secondary,
#illustration.t-156 .btn-secondary {
    background: var(--entete-t6-btnsecondary-bgcolor);
    color: var(--entete-t6-btnsecondary-color);
    /*border: var(--entete-t6-btnsecondary-border);*/
    border-top: var(--entete-t6-btnsecondary-border-top);
    border-bottom: var(--entete-t6-btnsecondary-border-bottom);
    border-left: var(--entete-t6-btnsecondary-border-left);
    border-right: var(--entete-t6-btnsecondary-border-right);
}
#illustration.t-6 .btn:hover,
#illustration.t-6 .btn:focus,
#illustration.t-6 .btn:active,
#illustration.t-6 .btn:active:focus,
#illustration.t-156 .btn:hover,
#illustration.t-156 .btn:focus,
#illustration.t-156 .btn:active,
#illustration.t-156 .btn:active:focus {
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
}
#illustration.t-6 .btn-primary:hover,
#illustration.t-6 .btn-primary:focus,
#illustration.t-6 .btn-primary:active,
#illustration.t-6 .btn-primary:active:focus,
#illustration.t-156 .btn-primary:hover,
#illustration.t-156 .btn-primary:focus,
#illustration.t-156 .btn-primary:active,
#illustration.t-156 .btn-primary:active:focus {
    background: var(--entete-t6-bouton-color) !important;
    color: var(--entete-t6-bouton-bgcolor) !important;
    /*border: var(--entete-t6-bouton-border) !important;*/
    border-top: var(--entete-t6-bouton-border-top) !important;
    border-bottom: var(--entete-t6-bouton-border-bottom) !important;
    border-left: var(--entete-t6-bouton-border-left) !important;
    border-right: var(--entete-t6-bouton-border-right) !important;
}
#illustration.t-6 .btn-secondary:hover,
#illustration.t-6 .btn-secondary:focus,
#illustration.t-6 .btn-secondary:active,
#illustration.t-6 .btn-secondary:active:focus,
#illustration.t-156 .btn-secondary:hover,
#illustration.t-156 .btn-secondary:focus,
#illustration.t-156 .btn-secondary:active,
#illustration.t-156 .btn-secondary:active:focus {
    background: var(--entete-t6-btnsecondary-color) !important;
    color: var(--entete-t6-btnsecondary-bgcolor) !important;
    /*border: var(--entete-t6-btnsecondary-border) !important;*/
    border-top: var(--entete-t6-btnsecondary-border-top) !important;
    border-bottom: var(--entete-t6-btnsecondary-border-bottom) !important;
    border-left: var(--entete-t6-btnsecondary-border-left) !important;
    border-right: var(--entete-t6-btnsecondary-border-right) !important;
}

/* ---------------------------------
Vidéo d'arrière plan
--------------------------------- */
#illustration.t-156 {
    position: relative;
}
#illustration.t-156 .background {
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
}
#illustration.t-156 .background .video-container {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}
#illustration.t-156 .background .video-container iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100vw;
    height: 100vh;
    transform: translate(-50%, -50%);

    /*@media (min-aspect-ratio: 16/9) {
        height: 56.25vh;
    }

    @media (max-aspect-ratio: 16/9) {
        width: 177.78vw;
    }*/
}
#illustration.t-156 .foreground {
    position: relative;
    z-index: 1;
    width: 100%;
}

/* ---------------------------------
Image à côté
--------------------------------- */
#illustration.t-7 {
    background: var(--entete-t7-fond-bgcolor);
    padding-top: 140px; /*170px*/
    padding-bottom: 50px;
    align-items: center;
}
#illustration.t-7 h1 small {
    color: var(--entete-t7-soustitre-color);
    font-size: var(--entete-t7-soustitre-size);
}
#illustration.t-7 h1 {
    color: var(--entete-t7-titre-color);
    font-size: var(--entete-t7-titre-size);
}
#illustration.t-7 h1 strong {
    color: var(--entete-t7-titrestrong-color);
    font-weight: var(--entete-t7-titrestrong-fontweight);
}
#illustration.t-7 .contenu p {
    color: var(--entete-t7-texte-color);
    font-size: var(--entete-t7-texte-size);
}
#illustration.t-7 .btn {
    border-radius: var(--entete-t7-bouton-radius);
    font-size: var(--entete-t7-bouton-size);
    padding: var(--entete-t7-bouton-padding);
}
#illustration.t-7 .btn-primary {
    background: var(--entete-t7-bouton-bgcolor);
    color: var(--entete-t7-bouton-color);
    /*border: var(--entete-t7-bouton-border);*/
    border-top: var(--entete-t7-bouton-border-top);
    border-bottom: var(--entete-t7-bouton-border-bottom);
    border-left: var(--entete-t7-bouton-border-left);
    border-right: var(--entete-t7-bouton-border-right);
}
#illustration.t-7 .btn-secondary {
    background: var(--entete-t7-btnsecondary-bgcolor);
    color: var(--entete-t7-btnsecondary-color);
    /*border: var(--entete-t7-btnsecondary-border);*/
    border-top: var(--entete-t7-btnsecondary-border-top);
    border-bottom: var(--entete-t7-btnsecondary-border-bottom);
    border-left: var(--entete-t7-btnsecondary-border-left);
    border-right: var(--entete-t7-btnsecondary-border-right);
}
#illustration.t-7 .btn:hover,
#illustration.t-7 .btn:focus,
#illustration.t-7 .btn:active,
#illustration.t-7 .btn:active:focus {
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
#illustration.t-7 .btn-primary:hover,
#illustration.t-7 .btn-primary:focus,
#illustration.t-7 .btn-primary:active,
#illustration.t-7 .btn-primary:active:focus {
    background: var(--entete-t7-bouton-color) !important;
    color: var(--entete-t7-bouton-bgcolor) !important;
    /*border: var(--entete-t7-bouton-border) !important;*/
    border-top: var(--entete-t7-bouton-border-top) !important;
    border-bottom: var(--entete-t7-bouton-border-bottom) !important;
    border-left: var(--entete-t7-bouton-border-left) !important;
    border-right: var(--entete-t7-bouton-border-right) !important;
}
#illustration.t-7 .btn-secondary:hover,
#illustration.t-7 .btn-secondary:focus,
#illustration.t-7 .btn-secondary:active,
#illustration.t-7 .btn-secondary:active:focus {
    background: var(--entete-t7-btnsecondary-color) !important;
    color: var(--entete-t7-btnsecondary-bgcolor) !important;
    /*border: var(--entete-t7-btnsecondary-border) !important;*/
    border-top: var(--entete-t7-btnsecondary-border-top) !important;
    border-bottom: var(--entete-t7-btnsecondary-border-bottom) !important;
    border-left: var(--entete-t7-btnsecondary-border-left) !important;
    border-right: var(--entete-t7-btnsecondary-border-right) !important;
}



#illustration.t-7 .div-texte {
    padding-bottom: 16px;
}

@media (min-width: 768px) {
    #illustration.t-7.ordre-imgTxt .row {
        flex-direction: row-reverse;
    }
    #illustration.t-7 .div-texte {
        padding-bottom: 0;
    }
}

/* ---------------------------------
Sans image
--------------------------------- */
#illustration.t-16 {
    text-align: var(--entete-t16-fond-align);
    background: var(--entete-t16-fond-bgcolor);
    align-items: center;
    padding-top: 140px; /*170px*/
    padding-bottom: 50px;
}
#illustration.t-16 h1 small {
    color: var(--entete-t16-soustitre-color);
    font-size: var(--entete-t16-soustitre-size);
}
#illustration.t-16 h1 {
    color: var(--entete-t16-titre-color);
    font-size: var(--entete-t16-titre-size);
}
#illustration.t-16 h1 strong {
    color: var(--entete-t16-titrestrong-color);
    font-weight: var(--entete-t16-titrestrong-fontweight);
}
#illustration.t-16 .contenu p {
    color: var(--entete-t16-texte-color);
    font-size: var(--entete-t16-texte-size);
}
#illustration.t-16 .div-boutons {
    justify-content: var(--entete-t16-general-align);
}
#illustration.t-16 .btn {
    border-radius: var(--entete-t16-bouton-radius);
    font-size: var(--entete-t16-bouton-size);
    padding: var(--entete-t16-bouton-padding);
}
#illustration.t-16 .btn-primary {
    background: var(--entete-t16-bouton-bgcolor);
    color: var(--entete-t16-bouton-color);
    /*border: var(--entete-t16-bouton-border);*/
    border-top: var(--entete-t16-bouton-border-top);
    border-bottom: var(--entete-t16-bouton-border-bottom);
    border-left: var(--entete-t16-bouton-border-left);
    border-right: var(--entete-t16-bouton-border-right);
}
#illustration.t-16 .btn-secondary {
    background: var(--entete-t16-btnsecondary-bgcolor);
    color: var(--entete-t16-btnsecondary-color);
    /*border: var(--entete-t16-btnsecondary-border);*/
    border-top: var(--entete-t16-btnsecondary-border-top);
    border-bottom: var(--entete-t16-btnsecondary-border-bottom);
    border-left: var(--entete-t16-btnsecondary-border-left);
    border-right: var(--entete-t16-btnsecondary-border-right);
}
#illustration.t-16 .btn:hover,
#illustration.t-16 .btn:focus,
#illustration.t-16 .btn:active,
#illustration.t-16 .btn:active:focus {
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
#illustration.t-16 .btn-primary:hover,
#illustration.t-16 .btn-primary:focus,
#illustration.t-16 .btn-primary:active,
#illustration.t-16 .btn-primary:active:focus {
    background: var(--entete-t16-bouton-color) !important;
    color: var(--entete-t16-bouton-bgcolor) !important;
    /*border: var(--entete-t16-bouton-border) !important;*/
    border-top: var(--entete-t16-bouton-border-top) !important;
    border-bottom: var(--entete-t16-bouton-border-bottom) !important;
    border-left: var(--entete-t16-bouton-border-left) !important;
    border-right: var(--entete-t16-bouton-border-right) !important;
}
#illustration.t-16 .btn-secondary:hover,
#illustration.t-16 .btn-secondary:focus,
#illustration.t-16 .btn-secondary:active,
#illustration.t-16 .btn-secondary:active:focus {
    background: var(--entete-t16-btnsecondary-color) !important;
    color: var(--entete-t16-btnsecondary-bgcolor) !important;
    /*border: var(--entete-t16-btnsecondary-border) !important;*/
    border-top: var(--entete-t16-btnsecondary-border-top) !important;
    border-bottom: var(--entete-t16-btnsecondary-border-bottom) !important;
    border-left: var(--entete-t16-btnsecondary-border-left) !important;
    border-right: var(--entete-t16-btnsecondary-border-right) !important;
}

/* ---------------------------------
Image pleine à côté
--------------------------------- */
#illustration.t-40 {
    background: var(--entete-t7-fond-bgcolor);
}
#illustration.t-40 h1 {
    color: var(--entete-t7-titre-color);
    font-size: var(--entete-t7-titre-size);
}
#illustration.t-40 h1 small {
    color: var(--entete-t7-soustitre-color);
    font-size: var(--entete-t7-soustitre-size);
}
#illustration.t-40 h1 strong {
    color: var(--entete-t7-titrestrong-color);
    font-weight: var(--entete-t7-titrestrong-fontweight);
}
#illustration.t-40 .contenu p {
    color: var(--entete-t7-texte-color);
    font-size: var(--entete-t7-texte-size);
}
#illustration.t-40 .btn {
    border-radius: var(--entete-t7-bouton-radius);
    font-size: var(--entete-t7-bouton-size);
    padding: var(--entete-t7-bouton-padding);
}
#illustration.t-40 .btn-primary {
    background: var(--entete-t7-bouton-bgcolor);
    color: var(--entete-t7-bouton-color);
    /*border: var(--entete-t7-bouton-border);*/
    border-top: var(--entete-t7-bouton-border-top);
    border-bottom: var(--entete-t7-bouton-border-bottom);
    border-left: var(--entete-t7-bouton-border-left);
    border-right: var(--entete-t7-bouton-border-right);
}
#illustration.t-40 .btn-secondary {
    background: var(--entete-t7-btnsecondary-bgcolor);
    color: var(--entete-t7-btnsecondary-color);
    /*border: var(--entete-t7-btnsecondary-border);*/
    border-top: var(--entete-t7-btnsecondary-border-top);
    border-bottom: var(--entete-t7-btnsecondary-border-bottom);
    border-left: var(--entete-t7-btnsecondary-border-left);
    border-right: var(--entete-t7-btnsecondary-border-right);
}
#illustration.t-40 .btn:hover,
#illustration.t-40 .btn:focus,
#illustration.t-40 .btn:active,
#illustration.t-40 .btn:active:focus {
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
#illustration.t-40 .btn-primary:hover,
#illustration.t-40 .btn-primary:focus,
#illustration.t-40 .btn-primary:active,
#illustration.t-40 .btn-primary:active:focus {
    background: var(--entete-t7-bouton-color) !important;
    color: var(--entete-t7-bouton-bgcolor) !important;
    /*border: var(--entete-t7-bouton-border) !important;*/
    border-top: var(--entete-t7-bouton-border-top) !important;
    border-bottom: var(--entete-t7-bouton-border-bottom) !important;
    border-left: var(--entete-t7-bouton-border-left) !important;
    border-right: var(--entete-t7-bouton-border-right) !important;
}
#illustration.t-40 .btn-secondary:hover,
#illustration.t-40 .btn-secondary:focus,
#illustration.t-40 .btn-secondary:active,
#illustration.t-40 .btn-secondary:active:focus {
    background: var(--entete-t7-btnsecondary-color) !important;
    color: var(--entete-t7-btnsecondary-bgcolor) !important;
    /*border: var(--entete-t7-btnsecondary-border) !important;*/
    border-top: var(--entete-t7-btnsecondary-border-top) !important;
    border-bottom: var(--entete-t7-btnsecondary-border-bottom) !important;
    border-left: var(--entete-t7-btnsecondary-border-left) !important;
    border-right: var(--entete-t7-btnsecondary-border-right) !important;
}



#illustration.t-40 .row {
    height: 100%;
}
#illustration.t-40 .div-texte {
    height: 100%;
    padding-top: 140px; /*170px*/
    padding-bottom: 16px;
}

@media (min-width: 768px) {
    #illustration.t-40.ordre-imgTxt .row {
        flex-direction: row-reverse;
    }
    #illustration.t-40 .div-texte {
        padding-bottom: 50px;
    }
    #illustration.t-40.ordre-txtImg .div-image {
        margin-left: 15px;
    }
    #illustration.t-40.ordre-imgTxt .div-image {
        margin-right: 15px;
    }
    #illustration.t-40 .div-image {
        height: 100%;
    }
    #illustration.t-40 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}





#illustration.t-42,
#illustration.t-43,
#illustration.t-78,
#illustration.t-79,
#illustration.t-80,
#illustration.t-81,
#illustration.t-82,
#illustration.t-83,
#illustration.t-84,
#illustration.t-85,
#illustration.t-89,
#illustration.t-90 {
    background: var(--entete-t7-fond-bgcolor);
}
#illustration.t-78,
#illustration.t-80 {
    text-align: var(--entete-t16-fond-align);
}
#illustration.t-42,
#illustration.t-43,
#illustration.t-78,
#illustration.t-79,
#illustration.t-80,
#illustration.t-81,
#illustration.t-82,
#illustration.t-83,
#illustration.t-84,
#illustration.t-85,
#illustration.t-89 {
    padding-top: 150px;
    padding-bottom: 50px;
}
#illustration.t-90 .div-texte {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}
@media (min-width: 768px) {
    #illustration.t-90 .div-texte {
        margin-right: 15px;
    }
    #illustration.t-90 .div-image {
        margin-left: 15px;
    }
}
@media (min-width: 768px) {
    #illustration.t-81 .div-image,
    #illustration.t-90 .div-image {
        height: 100%;
    }
    #illustration.t-81 .div-image img,
    #illustration.t-90 .div-image img {
        height: 100%;
        object-fit: cover;
        object-position: center;
    }
}
#illustration.t-78 .cadre,
#illustration.t-79 .cadre,
#illustration.t-80 .cadre,
#illustration.t-81 .cadre,
#illustration.t-82 .cadre,
#illustration.t-83 .cadre,
#illustration.t-84 .cadre,
#illustration.t-85 .cadre {
    background: #1f9ce8;
    overflow: hidden;
}
#illustration.t-42 h1,
#illustration.t-43 h1,
#illustration.t-78 h1,
#illustration.t-79 h1,
#illustration.t-80 h1,
#illustration.t-81 h1,
#illustration.t-82 h1,
#illustration.t-83 h1,
#illustration.t-84 h1,
#illustration.t-85 h1,
#illustration.t-89 h1,
#illustration.t-90 h1 {
    color: var(--entete-t7-titre-color);
    font-size: var(--entete-t7-titre-size);
}
#illustration.t-42 h1 strong,
#illustration.t-43 h1 strong,
#illustration.t-78 h1 strong,
#illustration.t-79 h1 strong,
#illustration.t-80 h1 strong,
#illustration.t-81 h1 strong,
#illustration.t-82 h1 strong,
#illustration.t-83 h1 strong,
#illustration.t-84 h1 strong,
#illustration.t-85 h1 strong,
#illustration.t-89 h1 strong,
#illustration.t-90 h1 strong {
    color: var(--entete-t7-titrestrong-color);
    font-weight: var(--entete-t7-titrestrong-fontweight);
}
#illustration.t-42 .contenu p,
#illustration.t-43 .contenu p,
#illustration.t-78 .contenu p,
#illustration.t-79 .contenu p,
#illustration.t-80 .contenu p,
#illustration.t-81 .contenu p,
#illustration.t-82 .contenu p,
#illustration.t-83 .contenu p,
#illustration.t-84 .contenu p,
#illustration.t-85 .contenu p,
#illustration.t-89 .contenu p,
#illustration.t-90 .contenu p {
    color: var(--entete-t7-texte-color);
    font-size: var(--entete-t7-texte-size);
}
#illustration.t-78 .div-boutons,
#illustration.t-80 .div-boutons {
    justify-content: var(--entete-t16-fond-align);
}
#illustration.t-42 .btn,
#illustration.t-43 .btn,
#illustration.t-78 .btn,
#illustration.t-79 .btn,
#illustration.t-80 .btn,
#illustration.t-81 .btn,
#illustration.t-82 .btn,
#illustration.t-83 .btn,
#illustration.t-84 .btn,
#illustration.t-85 .btn,
#illustration.t-89 .btn,
#illustration.t-90 .btn {
    font-size: var(--entete-t7-bouton-size);
    padding: var(--entete-t7-bouton-padding);
    border-radius: var(--entete-t7-bouton-radius);
}
#illustration.t-42 .btn-primary,
#illustration.t-43 .btn-primary,
#illustration.t-78 .btn-primary,
#illustration.t-79 .btn-primary,
#illustration.t-80 .btn-primary,
#illustration.t-81 .btn-primary,
#illustration.t-82 .btn-primary,
#illustration.t-83 .btn-primary,
#illustration.t-84 .btn-primary,
#illustration.t-85 .btn-primary,
#illustration.t-89 .btn-primary,
#illustration.t-90 .btn-primary {
    background: var(--entete-t7-bouton-bgcolor);
    color: var(--entete-t7-bouton-color);
    /*border: var(--entete-t7-bouton-border);*/
    border-top: var(--entete-t7-bouton-border-top);
    border-bottom: var(--entete-t7-bouton-border-bottom);
    border-left: var(--entete-t7-bouton-border-left);
    border-right: var(--entete-t7-bouton-border-right);
}
#illustration.t-42 .btn-secondary,
#illustration.t-43 .btn-secondary,
#illustration.t-78 .btn-secondary,
#illustration.t-79 .btn-secondary,
#illustration.t-80 .btn-secondary,
#illustration.t-81 .btn-secondary,
#illustration.t-82 .btn-secondary,
#illustration.t-83 .btn-secondary,
#illustration.t-84 .btn-secondary,
#illustration.t-85 .btn-secondary,
#illustration.t-89 .btn-secondary,
#illustration.t-90 .btn-secondary {
    background: var(--entete-t7-btnsecondary-bgcolor);
    color: var(--entete-t7-btnsecondary-color);
    /*border: var(--entete-t7-btnsecondary-border);*/
    border-top: var(--entete-t7-btnsecondary-border-top);
    border-bottom: var(--entete-t7-btnsecondary-border-bottom);
    border-left: var(--entete-t7-btnsecondary-border-left);
    border-right: var(--entete-t7-btnsecondary-border-right);
}
#illustration.t-42 .btn:hover, #illustration.t-42 .btn:focus, #illustration.t-42 .btn:active, #illustration.t-42 .btn:active:focus,
#illustration.t-43 .btn:hover, #illustration.t-43 .btn:focus, #illustration.t-43 .btn:active, #illustration.t-43 .btn:active:focus,
#illustration.t-78 .btn:hover, #illustration.t-78 .btn:focus, #illustration.t-78 .btn:active, #illustration.t-78 .btn:active:focus,
#illustration.t-79 .btn:hover, #illustration.t-79 .btn:focus, #illustration.t-79 .btn:active, #illustration.t-79 .btn:active:focus,
#illustration.t-80 .btn:hover, #illustration.t-80 .btn:focus, #illustration.t-80 .btn:active, #illustration.t-80 .btn:active:focus,
#illustration.t-81 .btn:hover, #illustration.t-81 .btn:focus, #illustration.t-81 .btn:active, #illustration.t-81 .btn:active:focus,
#illustration.t-82 .btn:hover, #illustration.t-82 .btn:focus, #illustration.t-82 .btn:active, #illustration.t-82 .btn:active:focus,
#illustration.t-83 .btn:hover, #illustration.t-83 .btn:focus, #illustration.t-83 .btn:active, #illustration.t-83 .btn:active:focus,
#illustration.t-84 .btn:hover, #illustration.t-84 .btn:focus, #illustration.t-84 .btn:active, #illustration.t-84 .btn:active:focus,
#illustration.t-85 .btn:hover, #illustration.t-85 .btn:focus, #illustration.t-85 .btn:active, #illustration.t-85 .btn:active:focus,
#illustration.t-89 .btn:hover, #illustration.t-89 .btn:focus, #illustration.t-89 .btn:active, #illustration.t-89 .btn:active:focus,
#illustration.t-90 .btn:hover, #illustration.t-90 .btn:focus, #illustration.t-90 .btn:active, #illustration.t-90 .btn:active:focus {
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
}
#illustration.t-42 .btn-primary:hover, #illustration.t-42 .btn-primary:focus, #illustration.t-42 .btn-primary:active, #illustration.t-42 .btn-primary:active:focus,
#illustration.t-43 .btn-primary:hover, #illustration.t-43 .btn-primary:focus, #illustration.t-43 .btn-primary:active, #illustration.t-43 .btn-primary:active:focus,
#illustration.t-78 .btn-primary:hover, #illustration.t-78 .btn-primary:focus, #illustration.t-78 .btn-primary:active, #illustration.t-78 .btn-primary:active:focus,
#illustration.t-79 .btn-primary:hover, #illustration.t-79 .btn-primary:focus, #illustration.t-79 .btn-primary:active, #illustration.t-79 .btn-primary:active:focus,
#illustration.t-80 .btn-primary:hover, #illustration.t-80 .btn-primary:focus, #illustration.t-80 .btn-primary:active, #illustration.t-80 .btn-primary:active:focus,
#illustration.t-81 .btn-primary:hover, #illustration.t-81 .btn-primary:focus, #illustration.t-81 .btn-primary:active, #illustration.t-81 .btn-primary:active:focus,
#illustration.t-82 .btn-primary:hover, #illustration.t-82 .btn-primary:focus, #illustration.t-82 .btn-primary:active, #illustration.t-82 .btn-primary:active:focus,
#illustration.t-83 .btn-primary:hover, #illustration.t-83 .btn-primary:focus, #illustration.t-83 .btn-primary:active, #illustration.t-83 .btn-primary:active:focus,
#illustration.t-84 .btn-primary:hover, #illustration.t-84 .btn-primary:focus, #illustration.t-84 .btn-primary:active, #illustration.t-84 .btn-primary:active:focus,
#illustration.t-85 .btn-primary:hover, #illustration.t-85 .btn-primary:focus, #illustration.t-85 .btn-primary:active, #illustration.t-85 .btn-primary:active:focus,
#illustration.t-89 .btn-primary:hover, #illustration.t-89 .btn-primary:focus, #illustration.t-89 .btn-primary:active, #illustration.t-89 .btn-primary:active:focus,
#illustration.t-90 .btn-primary:hover, #illustration.t-90 .btn-primary:focus, #illustration.t-90 .btn-primary:active, #illustration.t-90 .btn-primary:active:focus {
    background: var(--entete-t7-bouton-color) !important;
    color: var(--entete-t7-bouton-bgcolor) !important;
    /*border: var(--entete-t7-bouton-border) !important;*/
    border-top: var(--entete-t7-bouton-border-top) !important;
    border-bottom: var(--entete-t7-bouton-border-bottom) !important;
    border-left: var(--entete-t7-bouton-border-left) !important;
    border-right: var(--entete-t7-bouton-border-right) !important;
}
#illustration.t-42 .btn-secondary:hover, #illustration.t-42 .btn-secondary:focus, #illustration.t-42 .btn-secondary:active, #illustration.t-42 .btn-secondary:active:focus,
#illustration.t-43 .btn-secondary:hover, #illustration.t-43 .btn-secondary:focus, #illustration.t-43 .btn-secondary:active, #illustration.t-43 .btn-secondary:active:focus,
#illustration.t-78 .btn-secondary:hover, #illustration.t-78 .btn-secondary:focus, #illustration.t-78 .btn-secondary:active, #illustration.t-78 .btn-secondary:active:focus,
#illustration.t-79 .btn-secondary:hover, #illustration.t-79 .btn-secondary:focus, #illustration.t-79 .btn-secondary:active, #illustration.t-79 .btn-secondary:active:focus,
#illustration.t-80 .btn-secondary:hover, #illustration.t-80 .btn-secondary:focus, #illustration.t-80 .btn-secondary:active, #illustration.t-80 .btn-secondary:active:focus,
#illustration.t-81 .btn-secondary:hover, #illustration.t-81 .btn-secondary:focus, #illustration.t-81 .btn-secondary:active, #illustration.t-81 .btn-secondary:active:focus,
#illustration.t-82 .btn-secondary:hover, #illustration.t-82 .btn-secondary:focus, #illustration.t-82 .btn-secondary:active, #illustration.t-82 .btn-secondary:active:focus,
#illustration.t-83 .btn-secondary:hover, #illustration.t-83 .btn-secondary:focus, #illustration.t-83 .btn-secondary:active, #illustration.t-83 .btn-secondary:active:focus,
#illustration.t-84 .btn-secondary:hover, #illustration.t-84 .btn-secondary:focus, #illustration.t-84 .btn-secondary:active, #illustration.t-84 .btn-secondary:active:focus,
#illustration.t-85 .btn-secondary:hover, #illustration.t-85 .btn-secondary:focus, #illustration.t-85 .btn-secondary:active, #illustration.t-85 .btn-secondary:active:focus,
#illustration.t-89 .btn-secondary:hover, #illustration.t-89 .btn-secondary:focus, #illustration.t-89 .btn-secondary:active, #illustration.t-89 .btn-secondary:active:focus,
#illustration.t-90 .btn-secondary:hover, #illustration.t-90 .btn-secondary:focus, #illustration.t-90 .btn-secondary:active, #illustration.t-90 .btn-secondary:active:focus {
    background: var(--entete-t7-btnsecondary-color) !important;
    color: var(--entete-t7-btnsecondary-bgcolor) !important;
    /*border: var(--entete-t7-btnsecondary-border) !important;*/
    border-top: var(--entete-t7-btnsecondary-border-top) !important;
    border-bottom: var(--entete-t7-btnsecondary-border-bottom) !important;
    border-left: var(--entete-t7-btnsecondary-border-left) !important;
    border-right: var(--entete-t7-btnsecondary-border-right) !important;
}










#illustration.t-78 .cadre {
    padding: 0;
    background-position: center;
    background-size: cover;
}
#illustration.t-78 .filtre {
    background: var(--entete-t6-filtre-bgcolor);
    padding: var(--blocpage-t26-cadre-padding);
}



#illustration.t-81 .cadre {
    padding: 0;
    overflow: hidden;
}
#illustration.t-81 .div-texte {
    padding: var(--blocpage-t26-cadre-padding);
    padding-bottom: 0;
}
@media (min-width: 768px) {
    #illustration.t-81 .div-texte {
        padding: var(--blocpage-t26-cadre-padding);
        padding-right: 0;
    }
}



#illustration.t-84 .cadre {
    position: relative;
    z-index: 1;
    margin: 0 30px;
    margin-bottom: -50px;
}
@media (min-width: 768px) {
    #illustration.t-84 .cadre {
        margin: 0;
        margin-right: -200px;
    }
}



#illustration.t-85 .div-image {
    position: relative;
    z-index: 1;
    margin: 0 30px;
}
#illustration.t-85 .cadre {
    margin-bottom: -50px;
}
#illustration.t-85 .cadre .div-texte {
    padding-bottom: 50px;
}
@media (min-width: 768px) {
    #illustration.t-85 .div-image {
        margin: 0;
    }
    #illustration.t-85 .cadre {
        margin-bottom: 0;
        padding-right: 0;
        margin-right: -200px;
    }
    #illustration.t-85 .cadre .div-texte {
        padding-bottom: 0;
        margin-right: 200px;
    }
}



#illustration.t-89 .div-texte,
#illustration.t-90 .div-texte {
    position: relative;
    z-index: 1;
}
#illustration.t-89 .div-texte {
    padding-bottom: 16px;
}
#illustration.t-90 .div-texte {
    height: 100%;
    padding-top: 140px;
    padding-bottom: 16px;
}
#illustration.t-89 .div-image,
#illustration.t-90 .div-image {
    position: relative;
}
#illustration.t-89 .filtre,
#illustration.t-90 .filtre {
    background: var(--entete-t6-filtre-bgcolor);
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}
@media (min-width: 768px) {
    #illustration.t-89 .div-texte {
        padding-bottom: 0;
    }
    #illustration.t-90 .div-texte {
        padding-bottom: 50px;
    }
    #illustration.t-89 h1,
    #illustration.t-90 h1 {
        margin-right: -50%;
    }
}












/* ---------------------------------
------------------------------------
FAQ
------------------------------------
--------------------------------- */
.blocpage.blocfaq .accordion .card {
    border-radius: var(--faq-t93-faq-radius);
    margin-bottom: 20px;
    border: none;

    background: var(--faq-t93-content-bgcolor-v1);
    backdrop-filter: blur(var(--faq-t93-content-blur-v1));
    box-shadow: var(--faq-t93-faq-shadow-v1);
}
.blocpage.blocfaq.fond2 .accordion .card {
    background: var(--faq-t93-content-bgcolor-v2);
    backdrop-filter: blur(var(--faq-t93-content-blur-v2));
    box-shadow: var(--faq-t93-faq-shadow-v2);
}
.blocpage.blocfaq.fond3 .accordion .card {
    background: var(--faq-t93-content-bgcolor-v3);
    backdrop-filter: blur(var(--faq-t93-content-blur-v3));
    box-shadow: var(--faq-t93-faq-shadow-v3);
}
.blocpage.blocfaq .accordion .card .card-header {
    background: none;
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    padding: var(--faq-t93-content-padding);
}

.blocpage.blocfaq .accordion .card .card-header h3 {
    font-size: var(--faq-t93-question-size);
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;

    color: var(--faq-t93-question-color-v1);
}
.blocpage.blocfaq.fond2 .accordion .card .card-header h3 {
    color: var(--faq-t93-question-color-v2);
}
.blocpage.blocfaq.fond3 .accordion .card .card-header h3 {
    color: var(--faq-t93-question-color-v3);
}

.blocpage.blocfaq .accordion .card .card-header svg {
    /*width: calc(var(--faq-t93-question-size) * 2);*/
    width: var(--faq-t93-icone-size);
    aspect-ratio: 1 / 1;
    transition: all .3s ease-out;
    transform: rotate(0deg);

    fill: var(--faq-t93-icone-color-v1);
}
.blocpage.blocfaq.fond2 .accordion .card .card-header svg {
    fill: var(--faq-t93-icone-color-v2);
}
.blocpage.blocfaq.fond3 .accordion .card .card-header svg {
    fill: var(--faq-t93-icone-color-v3);
}

.blocpage.blocfaq .accordion .card .card-header[data-toggle="collapse"]:not(.collapsed) svg {
    transform: rotate(-180deg);
}

.blocpage.blocfaq .accordion .card .card-body {
    padding: var(--faq-t93-content-padding);
}
/*.blocpage.blocfaq .accordion .card .card-body {
    border-top: solid 1px;
    border-color: var(--items-t5-titre-color-v1);
}
.blocpage.blocfaq.fond2 .accordion .card .card-body {
    border-color: var(--items-t5-titre-color-v2);
}
.blocpage.blocfaq.fond3 .accordion .card .card-body {
    border-color: var(--items-t5-titre-color-v3);
}*/

.blocpage.blocfaq .accordion .card .card-body p {
    font-size: var(--faq-t93-reponse-size);

    color: var(--faq-t93-reponse-color-v1);
}
.blocpage.blocfaq.fond2 .accordion .card .card-body p {
    color: var(--faq-t93-reponse-color-v2);
}
.blocpage.blocfaq.fond3 .accordion .card .card-body p {
    color: var(--faq-t93-reponse-color-v3);
}






















/* ---------------------------------
------------------------------------
FORMULAIRE CONTACT
------------------------------------
--------------------------------- */

.blocpage.bloccontact .map_canvas {
    min-height: 350px;
    height: 100%;
}


/* ---------------------------------
Carte pleine sur le côté
--------------------------------- */
.blocpage.bloccontact.t-101 .div-formulaire {
    padding: var(--blocpage-t26-cadre-padding);
    padding-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.bloccontact.t-101 .div-formulaire {
        padding: var(--blocpage-t26-cadre-padding);
        padding-left: 0;
        padding-right: 0;
    }
    .blocpage.bloccontact.t-101.ordre-blocForm .map_canvas {
        margin-left: 15px;
    }
    .blocpage.bloccontact.t-101.ordre-formBloc .map_canvas {
        margin-right: 15px;
    }
}

/* ---------------------------------
Cadre carte pleine sur le côté
--------------------------------- */
.blocpage.bloccontact.t-104 .cadre {
    padding: 0;
    overflow: hidden;
}
.blocpage.bloccontact.t-104 .div-formulaire {
    padding: var(--blocpage-t26-cadre-padding);
    padding-bottom: 16px;
}

@media (min-width: 768px) {
    .blocpage.bloccontact.t-104 .div-formulaire {
        padding: var(--blocpage-t26-cadre-padding);
    }
    .blocpage.bloccontact.t-104.ordre-blocForm .div-formulaire {
        padding-right: 0;
    }
    .blocpage.bloccontact.t-104.ordre-formBloc .div-formulaire {
        padding-left: 0;
    }
}





/* ---------------------------------
------------------------------------
GALERIE IMAGES
------------------------------------
--------------------------------- */
.blocpage.blocgalerieimages.t-131 .frame img,
.blocpage.blocgalerieimages.t-132 .frame img,
.blocpage.blocgalerieimages.t-133 .frame img,
.blocpage.blocgalerieimages.t-134 .frame img,
.blocpage.blocgalerieimages.t-135 .frame img {
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}
.blocpage.blocgalerieimages .frame img {
    cursor: pointer;
}

/*.blocpage.blocgalerieimages .espacement-inactif {
    padding: 0;
    margin: 0;
}*/







.lightbox {
    display: none;
    background: rgba(0, 0, 0, 0.75);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.lightbox .lightbox-body {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.lightbox .lightbox-body .lightbox-bouton {
    display: flex;
    justify-content: end;
    padding: 15px 15px 0;
}
.lightbox .lightbox-body .lightbox-bouton svg {
    fill: white;
    width: 44px;
}
.lightbox .lightbox-body .lightbox-image {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 1;
    overflow: hidden;
    padding: 20px 30px 30px;
}
.lightbox .lightbox-body .lightbox-image img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
}













/* --------------------------------------------------
-----------------------------------------------------
----------------- MODAL DES COOKIES -----------------
-----------------------------------------------------
-------------------------------------------------- */

.modal#cookiesWall .modal-content {
    font-size: 14px;
    background: var(--blocpage-section-bgcolor-v1);
}
.modal#cookiesWall .modal-content .modal-header h3 {
    font-size: 1.5em;
}
.modal#cookiesWall .modal-content .modal-body h4 {
    font-size: 1.25em;
}
.modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible {
    margin-bottom: 1em;
}
.modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible p {
    margin-bottom: 0;
}
.modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible p.estTronque {
    overflow: hidden;
    max-height: 3em;
}
.modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible a {
    color: var(--blocpage-lien-color-v1);
    cursor: pointer;
}

@media (min-width: 768px) {
    .modal#cookiesWall .modal-content {
        font-size: 16px;
    }
    .modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible a {
        display: none;
    }
    .modal#cookiesWall .modal-content .modal-body .div-paragraphe-expansible p.estTronque {
        overflow: visible;
        max-height: none;
    }
}




/* --------------------------------------------------
-----------------------------------------------------
---------------- OFFCANVAS DU PANIER ----------------
-----------------------------------------------------
-------------------------------------------------- */
.offcanvas {
    display: none;
    overflow: hidden;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    z-index: 2000;
    background-color: rgba(40, 40, 40, 0.5);
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-play-state: paused;
    animation-fill-mode: forwards;
}
.offcanvas .offcanvas-body {
    display: flex;
    flex-direction: column;
    background: white;
    overflow-y: auto;
    width: 100%;
    max-width: 500px;
    height: 100%;
    margin-left: auto;
    animation-timing-function: ease;
    animation-iteration-count: 1;
    animation-play-state: paused;
    animation-fill-mode: forwards;
}


@keyframes offcanvasApparition {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes offcanvasOuverture {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}
@keyframes offcanvasDisparition {
    0% {
        opacity: 1;
    }
    100% {
        opacity: 0;
    }
}
@keyframes offcanvasFermeture {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(100%);
    }
}


.offcanvas.offcanvas-panier {
    font-size: 16px;
    display: none;
}
.offcanvas.offcanvas-panier .offcanvas-body {
    overflow-y: hidden;
    position: relative;
    background: white; /*var(--blocpage-section-bgcolor-v1)*/
    color: #808080; /*var(--blocpage-texte-color-v1)*/
    max-width: 580px;
}
.offcanvas.offcanvas-panier .offcanvas-body .div-icone {
    cursor: pointer;
}

.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-header {
    background: white; /*var(--blocpage-section-bgcolor-v1)*/
    position: sticky;
    top: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    padding: 15px 20px;
    border-bottom: solid 1px #CFCFCF;
    /*box-shadow: 0 10px 20px 10px white;*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-header h3 {
    font-size: 1.5em;
    margin-bottom: 0;
    width: 100%;
    text-align: center;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-header .div-icone svg {
    width: 1.5em;
    fill: #808080; /*var(--blocpage-texte-color-v1)*/
}


.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main {
    overflow-y: auto;
    padding: 20px;
    flex: 1;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit {
    display: flex;
    justify-content: end;
    align-items: start;
    gap: 15px;
    margin-bottom: 24px;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit:not(:first-child) {
    padding-top: 20px;
    border-top: solid 1px #CFCFCF;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit img {
    min-width: 50px;
    width: 150px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations {
    flex: 1;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-nom {
    display: flex;
    align-items: start;
    gap: 10px;
    margin-bottom: 1em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-nom h3 {
    width: 100%;
    font-size: 1.25em;
    margin-bottom: 0;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-nom .div-icone svg {
    width: 1.5em;
    fill: #DA3131; /*var(--blocpage-soustitre-color-v1)*/
    transition: fill 0.2s ease-in-out;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details {
    display: flex;
    align-items: end;
    gap: 10px;
    flex-wrap: wrap;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques {
    flex: 1;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques p {
    margin: 0;
    font-size: 1em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite {
    background: #EDEDED; /*var(--blocpage-t26-cadre-bgcolor-v1)*/
    border-radius: 100px;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0.25em;
    margin-top: 1em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite p {
    color: #808080; /*var(--blocpage-t26-texte-color-v1)*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone {
    border-radius: 1em;
    padding: 0.25em;
    transition: background 0.2s ease-in-out;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone:hover {
    background: #D7D7D7; /*var(--blocpage-t26-bouton-color-v1)*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone svg {
    width: 1.5em;
    fill: #808080; /*var(--blocpage-t26-bouton-bgcolor-v1)*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone.quantite-max {
    cursor: default;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone.quantite-max:hover {
    background: none;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-caracteristiques .produit-quantite .div-icone.quantite-max svg {
    fill: #C2C2C2;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-prix > div {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-prix p {
    margin-bottom: 0;
    text-align: right;
    font-size: 1em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-prix .prix-plein {
    text-decoration: line-through;
    color: #DA3131; /*var(--blocpage-soustitre-color-v1)*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-prix .prix-quantite .prix-plein {
    font-size: 1.25em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-main .div-produit .produit-informations .produit-details .produit-prix .prix-quantite .prix {
    color: var(--blocpage-titre-color-v1);
    font-size: 1.5em;
    font-weight: 600;
}




.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer {
    background: white; /*var(--blocpage-section-bgcolor-v1)*/
    position: sticky;
    bottom: 0;
    z-index: 1;
    padding: 10px 20px 20px;
    border-top: solid 1px #cfcfcf;
    /*box-shadow: 0 10px 20px 10px white;*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-prix-total {
    display: flex;
    justify-content: space-between;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 0.5em;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-prix-total {
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-prix-total p {
    margin: 0;
    font-size: 1.2em;
    font-weight: 600;
    color: #444444; /*var(--blocpage-titre-color-v1)*/
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-prix-total p:nth-child(2) {
    font-size: 1.8em;
    font-weight: 700;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-validation {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-validation > div {
    flex: 1;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-validation .btn {
    position: relative;
    z-index: 1;
}
.offcanvas.offcanvas-panier .offcanvas-body .offcanvas-footer .panier-validation p {
    margin: 0;
    margin-top: 0.5em;
    font-size: 0.8em;
    text-align: right;
    color: #808080;
}





/* ---------- LES COLONNES DE CONTENU ---------- */
.blocpage .masonry .colonnes {
    align-items: start;
}
/*.blocpage.blocitems .items {
    margin-bottom: -25px;
}*/

/*
.blocpage.blocitems .frame  img {
    width: 100%;
}
.blocpage.blocitems .frame .div-contenu {
    display: flex;
    flex-direction: column;
}
.blocpage.blocitems .frame .div-contenu,
.blocpage.blocitems .frame .bloc,
.blocpage.blocitems .frame .filtre {
    height: 100%;
}
.blocpage.blocitems .frame .illustration img {
    object-fit: cover;
    object-position: center;
}*/

.blocpage.blocitems .frame {
    text-align: var(--items-t5-item-align);

    /*filter: drop-shadow(var(--items-t5-item-shadow-v1));*/
}
/*.blocpage.blocitems.fond2 .frame {
    filter: drop-shadow(var(--items-t5-item-shadow-v2));
}
.blocpage.blocitems.fond3 .frame {
    filter: drop-shadow(var(--items-t5-item-shadow-v3));
}*/
.blocpage.blocitems .frame .illustration {
    display: flex;
    height: 100%;
}
.blocpage.blocitems .frame .filtre {
    background: rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(2px);
}

.blocpage.blocitems .frame .bloc {
    background: var(--items-t5-content-bgcolor-v1);
    backdrop-filter: blur(var(--items-t5-content-blur-v1));
}
.blocpage.blocitems.fond2 .frame .bloc {
    background: var(--items-t5-content-bgcolor-v2);
    backdrop-filter: blur(var(--items-t5-content-blur-v2));
}
.blocpage.blocitems.fond3 .frame .bloc {
    background: var(--items-t5-content-bgcolor-v3);
    backdrop-filter: blur(var(--items-t5-content-blur-v3));
}

.blocpage.blocitems .frame.bordure,
.blocpage.blocitems .frame .bordure {
    -webkit-border-radius: var(--items-t5-item-radius);
    -moz-border-radius: var(--items-t5-item-radius);
    border-radius: var(--items-t5-item-radius);

    box-shadow: var(--items-t5-item-shadow-v1);
    border-top: var(--items-t5-item-border-top-v1);
    border-bottom: var(--items-t5-item-border-bottom-v1);
    border-left: var(--items-t5-item-border-left-v1);
    border-right: var(--items-t5-item-border-right-v1);
}
.blocpage.blocitems.fond2 .frame.bordure,
.blocpage.blocitems.fond2 .frame .bordure {
    box-shadow: var(--items-t5-item-shadow-v2);
    border-top: var(--items-t5-item-border-top-v2);
    border-bottom: var(--items-t5-item-border-bottom-v2);
    border-left: var(--items-t5-item-border-left-v2);
    border-right: var(--items-t5-item-border-right-v2);
}
.blocpage.blocitems.fond3 .frame.bordure,
.blocpage.blocitems.fond3 .frame .bordure {
    box-shadow: var(--items-t5-item-shadow-v3);
    border-top: var(--items-t5-item-border-top-v3);
    border-bottom: var(--items-t5-item-border-bottom-v3);
    border-left: var(--items-t5-item-border-left-v3);
    border-right: var(--items-t5-item-border-right-v3);
}

.blocpage.blocitems .frame h3 {
    font-size: var(--items-t5-titre-size);
    color: var(--items-t5-titre-color-v1);
}
.blocpage.blocitems.fond2 .frame h3 {
    color: var(--items-t5-titre-color-v2);
}
.blocpage.blocitems.fond3 .frame h3 {
    color: var(--items-t5-titre-color-v3);
}

.blocpage.blocitems .frame .contenu,
.blocpage.blocitems .frame .contenu p,
.blocpage.blocitems .frame .contenu a {
    font-size: var(--items-t5-texte-size);
    color: var(--items-t5-texte-color-v1);
}
.blocpage.blocitems.fond2 .frame .contenu,
.blocpage.blocitems.fond2 .frame .contenu p,
.blocpage.blocitems.fond2 .frame .contenu a {
    color: var(--items-t5-texte-color-v2);
}
.blocpage.blocitems.fond3 .frame .contenu,
.blocpage.blocitems.fond3 .frame .contenu p,
.blocpage.blocitems.fond3 .frame .contenu a {
    color: var(--items-t5-texte-color-v3);
}

.blocpage.blocitems .frame .btn {
    padding: var(--items-t5-btn-padding);
    font-size: var(--items-t5-btn-size);
    border-radius: var(--items-t5-btn-radius);

    background: var(--items-t5-btn-bgcolor-v1);
    color: var(--items-t5-btn-color-v1);
    border-top: var(--items-t5-btn-border-top-v1) !important;
    border-bottom: var(--items-t5-btn-border-bottom-v1) !important;
    border-left: var(--items-t5-btn-border-left-v1) !important;
    border-right: var(--items-t5-btn-border-right-v1) !important;
}
.blocpage.blocitems .frame .btn-primary:hover {
    background: var(--items-t5-btn-color-v1) !important;
    color: var(--items-t5-btn-bgcolor-v1) !important;
}
.blocpage.blocitems.fond2 .frame .btn {
    background: var(--items-t5-btn-bgcolor-v2);
    color: var(--items-t5-btn-color-v2);
    border-top: var(--items-t5-btn-border-top-v2) !important;
    border-bottom: var(--items-t5-btn-border-bottom-v2) !important;
    border-left: var(--items-t5-btn-border-left-v2) !important;
    border-right: var(--items-t5-btn-border-right-v2) !important;
}
.blocpage.blocitems.fond2 .frame .btn-primary:hover {
    background: var(--items-t5-btn-color-v2) !important;
    color: var(--items-t5-btn-bgcolor-v2) !important;
}
.blocpage.blocitems.fond3 .frame .btn {
    background: var(--items-t5-btn-bgcolor-v3);
    color: var(--items-t5-btn-color-v3);
    border-top: var(--items-t5-btn-border-top-v3) !important;
    border-bottom: var(--items-t5-btn-border-bottom-v3) !important;
    border-left: var(--items-t5-btn-border-left-v3) !important;
    border-right: var(--items-t5-btn-border-right-v3) !important;
}
.blocpage.blocitems.fond3 .frame .btn-primary:hover {
    background: var(--items-t5-btn-color-v3) !important;
    color: var(--items-t5-btn-bgcolor-v3) !important;
}



/* =====================
BLOCS CLASSIQUES
======================= */
/* ---------------------------------
1 - Bloc sans fond
--------------------------------- */
.blocpage.blocitems .frame.t-28 .div-contenu {
    display: flex;
    flex-direction: column;
    gap: var(--items-t5-content-padding-y);
}
.blocpage.blocitems .frame.t-28 .div-contenu .content {
    margin-bottom: var(--items-t5-content-padding-y);
}

.blocpage.blocitems .frame.t-28.alignement-gauche .div-contenu .illustration {
    justify-content: start;
}
.blocpage.blocitems .frame.t-28.alignement-centre .div-contenu .illustration {
    justify-content: center;
}
.blocpage.blocitems .frame.t-28.alignement-droite .div-contenu .illustration {
    justify-content: end;
}



.blocpage.blocitems .frame.t-28 {
    text-align: var(--items-t28-item-align);
}

.blocpage.blocitems .frame.t-28 h3 {
    font-size: var(--items-t28-titre-size);

    color: var(--items-t28-titre-color-v1);
}
.blocpage.blocitems.fond2 .frame.t-28 h3 {
    color: var(--items-t28-titre-color-v2);
}
.blocpage.blocitems.fond3 .frame.t-28 h3 {
    color: var(--items-t28-titre-color-v3);
}

.blocpage.blocitems .frame.t-28 .contenu,
.blocpage.blocitems .frame.t-28 .contenu p {
    font-size: var(--items-t28-texte-size);

    color: var(--items-t28-texte-color-v1);
}
.blocpage.blocitems.fond2 .frame.t-28 .contenu,
.blocpage.blocitems.fond2 .frame.t-28 .contenu p {
    color: var(--items-t28-texte-color-v2);
}
.blocpage.blocitems.fond3 .frame.t-28 .contenu,
.blocpage.blocitems.fond3 .frame.t-28 .contenu p {
    color: var(--items-t28-texte-color-v3);
}

.blocpage.blocitems .frame.t-28 .btn {
    padding: var(--items-t28-btn-padding);
    font-size: var(--items-t28-btn-size);
    border-radius: var(--items-t28-btn-radius);

    background: var(--items-t28-btn-bgcolor-v1);
    color: var(--items-t28-btn-color-v1);
    border-top: var(--items-t28-btn-border-top-v1) !important;
    border-bottom: var(--items-t28-btn-border-bottom-v1) !important;
    border-left: var(--items-t28-btn-border-left-v1) !important;
    border-right: var(--items-t28-btn-border-right-v1) !important;
}
.blocpage.blocitems .frame.t-28 .btn-primary:hover {
    background: var(--items-t28-btn-color-v1) !important;
    color: var(--items-t28-btn-bgcolor-v1) !important;
}
.blocpage.blocitems.fond2 .frame.t-28 .btn {
    background: var(--items-t28-btn-bgcolor-v2);
    color: var(--items-t28-btn-color-v2);
    border-top: var(--items-t28-btn-border-top-v2) !important;
    border-bottom: var(--items-t28-btn-border-bottom-v2) !important;
    border-left: var(--items-t28-btn-border-left-v2) !important;
    border-right: var(--items-t28-btn-border-right-v2) !important;
}
.blocpage.blocitems.fond2 .frame.t-28 .btn-primary:hover {
    background: var(--items-t28-btn-color-v2) !important;
    color: var(--items-t28-btn-bgcolor-v2) !important;
}
.blocpage.blocitems.fond3 .frame.t-28 .btn {
    background: var(--items-t28-btn-bgcolor-v3);
    color: var(--items-t28-btn-color-v3);
    border-top: var(--items-t28-btn-border-top-v3) !important;
    border-bottom: var(--items-t28-btn-border-bottom-v3) !important;
    border-left: var(--items-t28-btn-border-left-v3) !important;
    border-right: var(--items-t28-btn-border-right-v3) !important;
}
.blocpage.blocitems.fond3 .frame.t-28 .btn-primary:hover {
    background: var(--items-t28-btn-color-v3) !important;
    color: var(--items-t28-btn-bgcolor-v3) !important;
}

/* ---------------------------------
2 - Bloc image et cadre
--------------------------------- */
.blocpage.blocitems .frame.t-15 .div-contenu {
    display: flex;
    flex-direction: column;
    gap: calc(var(--items-t5-content-padding-y)/2);
}
.blocpage.blocitems .frame.t-15 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

.blocpage.blocitems .frame.t-15.alignement-gauche .div-contenu .illustration {
    justify-content: start;
}
.blocpage.blocitems .frame.t-15.alignement-centre .div-contenu .illustration {
    justify-content: center;
}
.blocpage.blocitems .frame.t-15.alignement-droite .div-contenu .illustration {
    justify-content: end;
}

/* ---------------------------------
3 - Bloc image marge
--------------------------------- */
.blocpage.blocitems .frame.t-29 .div-contenu {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
    display: flex;
    flex-direction: column;
    gap: var(--items-t5-content-padding-y);
}

.blocpage.blocitems .frame.t-29.alignement-gauche .div-contenu .illustration {
    justify-content: start;
}
.blocpage.blocitems .frame.t-29.alignement-centre .div-contenu .illustration {
    justify-content: center;
}
.blocpage.blocitems .frame.t-29.alignement-droite .div-contenu .illustration {
    justify-content: end;
}

/* ---------------------------------
4 - Bloc image pleine
--------------------------------- */
.blocpage.blocitems .frame.t-5 {
    overflow: hidden;
}
.blocpage.blocitems .frame.t-5 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

.blocpage.blocitems .frame.t-5.alignement-gauche .div-contenu .illustration {
    justify-content: start;
}
.blocpage.blocitems .frame.t-5.alignement-centre .div-contenu .illustration {
    justify-content: center;
}
.blocpage.blocitems .frame.t-5.alignement-droite .div-contenu .illustration {
    justify-content: end;
}


/* =====================
BLOCS IMAGES EN FOND
======================= */
.blocpage.blocitems .frame.t-imgFond {
    overflow: hidden;
    background-size: cover;
    background-position: center;
}

/* ---------------------------------
5 - Bloc filtre plein
--------------------------------- */
.blocpage.blocitems .frame.t-25 .div-contenu {
    padding-top: 200px;
}
.blocpage.blocitems .frame.t-25 .div-contenu .content {
    padding: 0 var(--items-t5-content-padding-x) var(--items-t5-content-padding-y);
}

/* ---------------------------------
6 - Bloc filtre bandeau
--------------------------------- */
.blocpage.blocitems .frame.t-117 .div-contenu {
    padding-top: 200px;
}
.blocpage.blocitems .frame.t-117 .div-contenu .content{
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

/* ---------------------------------
7 - Bloc filtre texte
--------------------------------- */
.blocpage.blocitems .frame.t-118 .filtre {
    border-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-118 .div-contenu {
    padding: 200px var(--items-t5-content-padding-x) var(--items-t5-content-padding-y);
}
.blocpage.blocitems .frame.t-118 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

/* ---------------------------------
8 - Bloc cadre texte
--------------------------------- */
.blocpage.blocitems .frame.t-119 .bloc {
    border-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-119 .div-contenu {
    padding: 200px var(--items-t5-content-padding-x) var(--items-t5-content-padding-y);
}
.blocpage.blocitems .frame.t-119 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

/* ---------------------------------
9 - Bloc filtre texte en coin
--------------------------------- */
.blocpage.blocitems .frame.t-120 .div-contenu {
    padding-top: 200px;
}
.blocpage.blocitems .frame.t-120 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

.blocpage.blocitems .frame.t-120.alignement-gauche .filtre {
    border-top-right-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-120.alignement-gauche .div-contenu {
    padding-right: calc(var(--items-t5-content-padding-x)*2);
}
.blocpage.blocitems .frame.t-120.alignement-centre .filtre {
    border-top-left-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
    border-top-right-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-120.alignement-centre .div-contenu {
    padding-left: var(--items-t5-content-padding-x);
    padding-right: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-120.alignement-droite .filtre {
    border-top-left-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-120.alignement-droite .div-contenu {
    padding-left: calc(var(--items-t5-content-padding-x)*2);
}

/* ---------------------------------
10 - Bloc cadre texte en coin
--------------------------------- */
.blocpage.blocitems .frame.t-121 .div-contenu {
    padding-top: 200px;
}
.blocpage.blocitems .frame.t-121 .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

.blocpage.blocitems .frame.t-121.alignement-gauche .bloc {
    border-top-right-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-121.alignement-gauche .div-contenu {
    padding-right: calc(var(--items-t5-content-padding-x)*2);
}
.blocpage.blocitems .frame.t-121.alignement-centre .bloc {
    border-top-left-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
    border-top-right-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-121.alignement-centre .div-contenu {
    padding-left: var(--items-t5-content-padding-x);
    padding-right: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-121.alignement-droite .bloc {
    border-top-left-radius: calc(var(--items-t5-item-radius) - min(var(--items-t5-content-padding-x), var(--items-t5-content-padding-y)));
}
.blocpage.blocitems .frame.t-121.alignement-droite .div-contenu {
    padding-left: calc(var(--items-t5-content-padding-x)*2);
}


/* =======================
BLOCS DESTRUCTURES
======================= */
:root {
    --decalage: 30px;
}
.blocpage.blocitems .frame.t-destructure .div-contenu .content {
    padding: var(--items-t5-content-padding-y) var(--items-t5-content-padding-x);
}

/* ---------------------------------
11 - Bloc image en avant
--------------------------------- */
.blocpage.blocitems .frame.t-122.decalage-actif .div-contenu .illustration {
    position: relative;
    z-index: 1;
}
.blocpage.blocitems .frame.t-122.decalage-actif .div-contenu .bloc {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}
.blocpage.blocitems .frame.t-122.decalage-actif .div-contenu .bloc .filtre {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}

.blocpage.blocitems .frame.t-122.decalage-actif.alignement-gauche .bloc {
    margin-right: calc(var(--items-t5-content-padding-x)*2);
}
.blocpage.blocitems .frame.t-122.decalage-actif.alignement-centre .bloc {
    margin-left: var(--items-t5-content-padding-x);
    margin-right: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-122.decalage-actif.alignement-droite .bloc {
    margin-left: calc(var(--items-t5-content-padding-x)*2);
}

/* ---------------------------------
12 - Bloc image en avant en haut
--------------------------------- */
.blocpage.blocitems .frame.t-123.decalage-actif .div-contenu .illustration {
    position: relative;
    z-index: 1;

    margin: 0 var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-123.decalage-actif .div-contenu .bloc {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}
.blocpage.blocitems .frame.t-123.decalage-actif .div-contenu .bloc .filtre {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}

.blocpage.blocitems .frame.t-123.decalage-actif.alignement-gauche .div-contenu .illustration {
    justify-content: start;
}
.blocpage.blocitems .frame.t-123.decalage-actif.alignement-centre .div-contenu .illustration {
    justify-content: center;
}
.blocpage.blocitems .frame.t-123.decalage-actif.alignement-droite .div-contenu .illustration {
    justify-content: end;
}

/* ---------------------------------
13 - Bloc image en avant sur le côté
--------------------------------- */
.blocpage.blocitems .frame.t-124.decalage-actif .div-contenu .illustration {
    padding-top: var(--items-t5-content-padding-y);
}

.blocpage.blocitems .frame.t-124.decalage-actif.alignement-gauche {
    margin-left: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-124.decalage-actif.alignement-droite {
    margin-right: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-124.decalage-actif.alignement-gauche .div-contenu .illustration {
    justify-content: start;
    padding-right: var(--items-t5-content-padding-x);
    margin-left: calc(var(--items-t5-content-padding-x) * -1);
}
.blocpage.blocitems .frame.t-124.decalage-actif.alignement-droite .div-contenu .illustration {
    justify-content: end;
    padding-left: var(--items-t5-content-padding-x);
    margin-right: calc(var(--items-t5-content-padding-x) * -1);
}

/* ---------------------------------
14 - Bloc image en avant des deux côtés
--------------------------------- */
.blocpage.blocitems .frame.t-125.decalage-actif {
    margin: 0 var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-125.decalage-actif .div-contenu .illustration {
    padding-top: var(--items-t5-content-padding-y);

    margin: 0 calc(var(--items-t5-content-padding-x) * -1);
}

/* ---------------------------------
15 - Bloc texte en avant
--------------------------------- */
.blocpage.blocitems .frame.t-126.decalage-actif .div-contenu .illustration {
    position: relative;
    z-index: 1;
}
.blocpage.blocitems .frame.t-126.decalage-actif .div-contenu .bloc {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}
.blocpage.blocitems .frame.t-126.decalage-actif .div-contenu .bloc .filtre {
    margin-top: calc(var(--decalage) * -1);
    padding-top: var(--decalage);
}

.blocpage.blocitems .frame.t-126.decalage-actif.alignement-gauche .div-contenu .illustration {
    margin-right: var(--items-t5-content-padding-x);
    justify-content: start;
}
.blocpage.blocitems .frame.t-126.decalage-actif.alignement-gauche .div-contenu .bloc {
    margin-left: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-126.decalage-actif.alignement-droite .div-contenu .illustration {
    margin-left: var(--items-t5-content-padding-x);
    justify-content: end;
}
.blocpage.blocitems .frame.t-126.decalage-actif.alignement-droite .div-contenu .bloc {
    margin-right: var(--items-t5-content-padding-x);
}

/* ---------------------------------
16 - Bloc texte en avant en coin
--------------------------------- */
.blocpage.blocitems .frame.t-127.decalage-actif .div-contenu .bloc {
    position: relative;
    z-index: 1;

    margin-top: calc(var(--decalage) * -1);
}

.blocpage.blocitems .frame.t-127.decalage-actif.alignement-gauche .bloc {
    margin-right: calc(var(--items-t5-content-padding-x)*2);
}
.blocpage.blocitems .frame.t-127.decalage-actif.alignement-centre .bloc {
    margin-left: var(--items-t5-content-padding-x);
    margin-right: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-127.decalage-actif.alignement-droite .bloc {
    margin-left: calc(var(--items-t5-content-padding-x)*2);
}

/* ---------------------------------
17 - Bloc image en avant en coin
--------------------------------- */
.blocpage.blocitems .frame.t-128.decalage-actif .div-contenu .bloc {
    position: relative;
    z-index: 1;

    margin-top: calc(var(--decalage) * -1);
}

.blocpage.blocitems .frame.t-128.decalage-actif.alignement-gauche .div-contenu .illustration {
    margin-right: var(--items-t5-content-padding-x);
    justify-content: start;
}
.blocpage.blocitems .frame.t-128.decalage-actif.alignement-gauche .div-contenu .bloc {
    margin-left: var(--items-t5-content-padding-x);
}
.blocpage.blocitems .frame.t-128.decalage-actif.alignement-droite .div-contenu .illustration {
    margin-left: var(--items-t5-content-padding-x);
    justify-content: end;
}
.blocpage.blocitems .frame.t-128.decalage-actif.alignement-droite .div-contenu .bloc {
    margin-right: var(--items-t5-content-padding-x);
}

/*
ANCIENS BLOCS
*/
/* Carte sans marges */
/*
.blocitems .frame.t-5 {
    text-align: var(--items-t5-item-align);
    -webkit-border-radius: var(--items-t5-item-radius);
    -moz-border-radius: var(--items-t5-item-radius);
    border-radius: var(--items-t5-item-radius);
    overflow: hidden;

    box-shadow: var(--items-t5-item-shadow-v1);
    backdrop-filter: blur(var(--items-t5-content-blur-v1));
    border-top: var(--items-t5-item-border-top-v1);
    border-bottom: var(--items-t5-item-border-bottom-v1);
    border-left: var(--items-t5-item-border-left-v1);
    border-right: var(--items-t5-item-border-right-v1);
}
.fond2.blocitems .frame.t-5 {
    box-shadow: var(--items-t5-item-shadow-v2);
    backdrop-filter: blur(var(--items-t5-content-blur-v2));
    border-top: var(--items-t5-item-border-top-v2);
    border-bottom: var(--items-t5-item-border-bottom-v2);
    border-left: var(--items-t5-item-border-left-v2);
    border-right: var(--items-t5-item-border-right-v2);
}
.fond3.blocitems .frame.t-5 {
    box-shadow: var(--items-t5-item-shadow-v3);
    backdrop-filter: blur(var(--items-t5-content-blur-v3));
    border-top: var(--items-t5-item-border-top-v3);
    border-bottom: var(--items-t5-item-border-bottom-v3);
    border-left: var(--items-t5-item-border-left-v3);
    border-right: var(--items-t5-item-border-right-v3);
}

.blocitems .frame.t-5 .content {
    padding: var(--items-t5-content-padding);
    background: var(--items-t5-content-bgcolor-v1);
}

.fond2.blocitems .frame.t-5 .content {
    background: var(--items-t5-content-bgcolor-v2);
}

.fond3.blocitems .frame.t-5 .content {
    background: var(--items-t5-content-bgcolor-v3);
}

.blocitems .frame.t-5 h3 {
    font-size: var(--items-t5-titre-size);
    color: var(--items-t5-titre-color-v1);
}

.fond2.blocitems .frame.t-5 h3 {
    color: var(--items-t5-titre-color-v2);
}

.fond3.blocitems .frame.t-5 h3 {
    color: var(--items-t5-titre-color-v3);
}

.blocitems .frame.t-5 p {
    color: var(--items-t5-texte-color-v1);
    font-size: var(--items-t5-texte-size);
}

.fond2.blocitems .frame.t-5 p {
    color: var(--items-t5-texte-color-v2);
}

.fond3.blocitems .frame.t-5 p {
    color: var(--items-t5-texte-color-v3);
}



/* Carte sans fond */
/*
.blocitems .frame.t-28 {
    text-align: left;
}

.blocitems .frame.t-28 .content {
    padding: var(--items-t5-content-padding);
    padding-left: 0!important;
    padding-right: 0!important;
    background: none;
}

.fond2.blocitems .frame.t-28 .content {
    background: none;
}

.fond3.blocitems .frame.t-28 .content {
    background: none;
}

.blocitems .frame.t-28 h3 {
    font-size: var(--items-t5-titre-size);
    color: var(--blocpage-titre-color-v1);
}

.fond2.blocitems .frame.t-28 h3 {
    color: var(--blocpage-titre-color-v2);
}

.fond3.blocitems .frame.t-28 h3 {
    color: var(--blocpage-titre-color-v3);
}

.blocitems .frame.t-28 p {
    color: var(--blocpage-texte-color-v1);
    font-size: var(--items-t5-texte-size);
}

.fond2.blocitems .frame.t-28 p {
    color: var(--blocpage-texte-color-v2);
}

.fond3.blocitems .frame.t-28 p {
    color: var(--blocpage-texte-color-v3);
}



/* Carte avec marges */
/*
.blocitems .frame.t-29 {
    text-align: var(--items-t5-item-align);
    -webkit-border-radius: var(--items-t5-item-radius);
    -moz-border-radius: var(--items-t5-item-radius);
    border-radius: var(--items-t5-item-radius);
    overflow: hidden;

    background: var(--items-t5-content-bgcolor-v1);
    box-shadow: var(--items-t5-item-shadow-v1);
    backdrop-filter: blur(var(--items-t5-content-blur-v1));
    border-top: var(--items-t5-item-border-top-v1);
    border-bottom: var(--items-t5-item-border-bottom-v1);
    border-left: var(--items-t5-item-border-left-v1);
    border-right: var(--items-t5-item-border-right-v1);
}
.fond2.blocitems .frame.t-29 {
    background: var(--items-t5-content-bgcolor-v2);
    box-shadow: var(--items-t5-item-shadow-v2);
    backdrop-filter: blur(var(--items-t5-content-blur-v2));
    border-top: var(--items-t5-item-border-top-v2);
    border-bottom: var(--items-t5-item-border-bottom-v2);
    border-left: var(--items-t5-item-border-left-v2);
    border-right: var(--items-t5-item-border-right-v2);
}
.fond3.blocitems .frame.t-29 {
    background: var(--items-t5-content-bgcolor-v3);
    box-shadow: var(--items-t5-item-shadow-v3);
    backdrop-filter: blur(var(--items-t5-content-blur-v3));
    border-top: var(--items-t5-item-border-top-v3);
    border-bottom: var(--items-t5-item-border-bottom-v3);
    border-left: var(--items-t5-item-border-left-v3);
    border-right: var(--items-t5-item-border-right-v3);
}

.blocitems .frame.t-29 .illustration {
    padding: var(--items-t5-content-padding);
    padding-bottom: 0;
}

.blocitems .frame.t-29 .content {
    padding: var(--items-t5-content-padding);
}

.fond2.blocitems .frame.t-29 .content {
    background: var(--items-t5-content-bgcolor-v2);
}

.fond3.blocitems .frame.t-29 .content {
    background: var(--items-t5-content-bgcolor-v3);
}

.blocitems .frame.t-29 h3 {
    font-size: var(--items-t5-titre-size);
    color: var(--items-t5-titre-color-v1);
}

.fond2.blocitems .frame.t-29 h3 {
    color: var(--items-t5-titre-color-v2);
}

.fond3.blocitems .frame.t-29 h3 {
    color: var(--items-t5-titre-color-v3);
}

.blocitems .frame.t-29 p {
    color: var(--items-t5-texte-color-v1);
    font-size: var(--items-t5-texte-size);
}

.fond2.blocitems .frame.t-29 p {
    color: var(--items-t5-texte-color-v2);
}

.fond3.blocitems .frame.t-29 p {
    color: var(--items-t5-texte-color-v3);
}*/



/* ------------------------------------------------
---------------------------------------------------
---------------- PAGES SPECIFIQUES ----------------
---------------------------------------------------
------------------------------------------------ */
#page-fiche-produit {
    overflow: hidden;
}
#page-fiche-produit .div-images-produit {
    display: grid;
    gap: 10px;
}
#page-fiche-produit .div-images-produit .div-image-principale {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    aspect-ratio: 1 / 1;
}
#page-fiche-produit .div-images-produit .div-image-principale img {
    min-width: 0;
    min-height: 0;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    border-radius: 15px;
    object-fit: cover;
}
#page-fiche-produit .div-images-produit .div-image-principale .zoom-loupe {
    position: absolute;
    z-index: 1;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, .5);
    background-size: 1200px;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
#page-fiche-produit .div-images-produit .div-galerie {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(60px, 100%), 1fr));
    gap: 10px;
}
#page-fiche-produit .div-images-produit .div-galerie .div-image {
    overflow: hidden;
    aspect-ratio: 1 / 1;
    border-radius: 10px;
    cursor: pointer;
}
#page-fiche-produit .div-images-produit .div-galerie .div-image.selection {
    border: solid 2px var(--blocpage-bouton-bgcolor-v1);
}
#page-fiche-produit .div-images-produit .div-galerie .div-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.1s ease-in-out;
}
#page-fiche-produit .div-images-produit .div-galerie .div-image:hover img {
    transform: scale(120%);
}




/*
------------------------------
CHAMPS DE FORMULAIRES
------------------------------
*/
#page-fiche-produit .form-attribut {
    user-select: none;
}
#page-fiche-produit .form-attribut p {
    margin: 0;
}
#page-fiche-produit .form-attribut .select-hidden {
    display: none;
}

#page-fiche-produit .form-attribut .couleur,
#page-fiche-produit .form-attribut .image {
    aspect-ratio: 1 / 1;
    background-position: center;
    border: solid 1px darkgray;
    position: relative;
}
#page-fiche-produit .form-attribut .couleur {
    background-size: 8px;
    border-radius: 50%;
}
#page-fiche-produit .form-attribut .image {
    background-size: cover;
}


/* -----
CLASSIQUES
----- */
#page-fiche-produit .form-attribut-normal .valeurs-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    list-style: none;
    padding: 0;
}
#page-fiche-produit .form-attribut-normal .valeurs-list li {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

#page-fiche-produit .form-attribut-normal .valeurs-list li .designation-bulle {
    display: none;
    position: absolute;
    bottom: calc(100% + var(--blocpage-texte-size) * 0.5);
    padding: calc(var(--blocpage-texte-size) * 0.2) calc(var(--blocpage-texte-size) * 0.5);
    background: white;
    box-shadow: 3px 3px 9px #b5b5b5;
    text-align: center;
}
#page-fiche-produit .form-attribut-normal .valeurs-list li .designation-bulle:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border : calc(var(--blocpage-texte-size) * 0.5) solid transparent;
    border-top : calc(var(--blocpage-texte-size) * 0.5) solid white;
}
#page-fiche-produit .form-attribut-normal .valeurs-list li:hover .designation-bulle {
    display: inline-block;
}
#page-fiche-produit .form-attribut-normal .valeurs-list li.disabled .designation-bulle {
    color: lightgray;
    text-decoration: line-through;
}

/* ...TEXTES */
#page-fiche-produit .form-attribut-normal-textes .valeurs-list {
    gap: calc(var(--blocpage-texte-size) * 0.5);
}
#page-fiche-produit .form-attribut-normal-textes .valeurs-list li .designation {
    text-transform: uppercase;
    padding: calc(var(--blocpage-texte-size) * 0.3) calc(var(--blocpage-texte-size) * 0.5);
    cursor: pointer;
    border-bottom: solid 2px transparent;
}
#page-fiche-produit .form-attribut-normal-textes .valeurs-list li.disabled .designation {
    cursor: default;
    color: lightgray;
    text-decoration: line-through;
}
#page-fiche-produit .form-attribut-normal-textes .valeurs-list li.selected .designation {
    border-bottom-color: var(--blocpage-formcontrol-color-v1);
}

/* ...COULEURS */
#page-fiche-produit .form-attribut-normal-couleurs .valeurs-list li .couleur {
    width: 30px;
    cursor: pointer;
}
#page-fiche-produit .form-attribut-normal-couleurs .valeurs-list li.disabled .couleur {
    cursor: default;
}
#page-fiche-produit .form-attribut-normal-couleurs .valeurs-list li.disabled .couleur:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}
#page-fiche-produit .form-attribut-normal-couleurs .valeurs-list li .couleur:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    border: solid 2px transparent;
    border-radius: 50%;
    transition: all 0.2s ease-in-out;
}
#page-fiche-produit .form-attribut-normal-couleurs .valeurs-list li.selected .couleur:before {
    top: -5px;
    left: -5px;
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border-color: var(--blocpage-bouton-bgcolor-v1);
}

/* ...IMAGES */
#page-fiche-produit .form-attribut-normal-images .valeurs-list li .image {
    width: 80px;
    cursor: pointer;
    outline: transparent;
    transition: all 0.2s ease-in-out;
}
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.disabled .image {
    filter: grayscale(0.5);
    cursor: default;
}
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.disabled .image:before,
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.disabled .image:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
}
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.disabled .image:before {
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    transform: translateY(-50%) rotate(45deg);
}
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.disabled .image:after {
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}
#page-fiche-produit .form-attribut-normal-images .valeurs-list li.selected .image {
    border-color: var(--blocpage-bouton-bgcolor-v1);
    outline: solid 1px var(--blocpage-bouton-bgcolor-v1);
}



/* -----
BOUTONS
----- */
#page-fiche-produit .form-attribut-buttons .buttons-list {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--blocpage-bouton-padding-y) * 0.5);
}
#page-fiche-produit .form-attribut-buttons .buttons-list button {
    display: flex;
    align-items: center;
    gap: calc(var(--blocpage-bouton-size) * 0.5);
    background: var(--blocpage-formcontrol-bgcolor-v1);
    border-top: var(--blocpage-formcontrol-border-top-v1);
    border-bottom: var(--blocpage-formcontrol-border-bottom-v1);
    border-left: var(--blocpage-formcontrol-border-left-v1);
    border-right: var(--blocpage-formcontrol-border-right-v1);
    border-radius: var(--blocpage-bouton-radius);
    padding: var(--blocpage-bouton-padding);
    font-size: var(--blocpage-bouton-size);
    color: var(--blocpage-formcontrol-color-v1);
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    outline: transparent;
}
#page-fiche-produit .form-attribut-buttons .buttons-list button.disabled,
#page-fiche-produit .form-attribut-buttons .buttons-list button:disabled {
    cursor: default;
}
#page-fiche-produit .form-attribut-buttons .buttons-list button.selected {
    border-color: var(--blocpage-bouton-bgcolor-v1);
    outline: solid 1px var(--blocpage-bouton-bgcolor-v1);
}
#page-fiche-produit .form-attribut-buttons .buttons-list button.disabled {
    color: lightgray;
    text-decoration: line-through;
}

/* ...COULEURS */
#page-fiche-produit .form-attribut-buttons-couleurs .buttons-list button .couleur {
    width: calc(var(--blocpage-bouton-size) * 1.2);
}
#page-fiche-produit .form-attribut-buttons-couleurs .buttons-list button.disabled .couleur:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}

/* ...IMAGES */
#page-fiche-produit .form-attribut-buttons-images .buttons-list button .image {
    width: calc(var(--blocpage-bouton-size) * 2);
    border-radius: calc(var(--blocpage-bouton-radius) - min(var(--blocpage-bouton-padding-x), var(--blocpage-bouton-padding-y)));
}
#page-fiche-produit .form-attribut-buttons-images .buttons-list button.disabled .image:before,
#page-fiche-produit .form-attribut-buttons-images .buttons-list button.disabled .image:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
}
#page-fiche-produit .form-attribut-buttons-images .buttons-list button.disabled .image:before {
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    transform: translateY(-50%) rotate(45deg);
}
#page-fiche-produit .form-attribut-buttons-images .buttons-list button.disabled .image:after {
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}

/* ...IMAGES V2 */
#page-fiche-produit .form-attribut-buttons-images2 .buttons-list button {
    flex-direction: column;
    word-break: break-word;
    max-width: 120px;
}
#page-fiche-produit .form-attribut-buttons-images2 .buttons-list button .image {
    width: calc(var(--blocpage-bouton-size) * 3);
}



/* -----
SELECTS
----- */
#page-fiche-produit .form-attribut-select {
    position: relative;
    color: var(--blocpage-formcontrol-color-v1);
}
#page-fiche-produit .form-attribut-select .select-value,
#page-fiche-produit .form-attribut-select .select-dropdown {
    border-top: var(--blocpage-formcontrol-border-top-v1);
    border-bottom: var(--blocpage-formcontrol-border-bottom-v1);
    border-left: var(--blocpage-formcontrol-border-left-v1);
    border-right: var(--blocpage-formcontrol-border-right-v1);
    border-radius: var(--blocpage-formcontrol-radius);
}
#page-fiche-produit .form-attribut-select .select-value,
#page-fiche-produit .form-attribut-select .select-dropdown li {
    display: flex;
    gap: calc(var(--blocpage-texte-size) * 0.5);
    align-items: center;
    font-size: var(--blocpage-texte-size);
}
#page-fiche-produit .form-attribut-select .select-value {
    background: var(--blocpage-formcontrol-bgcolor-v1);
    position: relative;
    padding: var(--blocpage-formcontrol-padding);
    cursor: pointer;
}
#page-fiche-produit .form-attribut-select .select-value:focus {
    outline: auto;
}
#page-fiche-produit .form-attribut-select .select-value:after {
    content: '';
    width: calc(var(--blocpage-texte-size) * 0.5);
    aspect-ratio: 1 / 1;
    border: calc(var(--blocpage-texte-size) * 0.1) solid var(--blocpage-formcontrol-color-v1);
    border-left: none;
    border-top: none;
    position: absolute;
    transform: translateX(-50%) translateY(-75%) rotate(45deg);
    top: 50%;
    right: var(--blocpage-formcontrol-padding-x);
}
#page-fiche-produit .form-attribut-select .select-dropdown {
    background: white;
    position: absolute;
    right: 0;
    left: 0;
    z-index: 1;
    padding: 0;
    margin: 0;
    list-style: none;
    border-top: none;
    overflow-y: auto;
    max-height: 400px;
}
#page-fiche-produit .form-attribut-select .select-dropdown li {
    padding: var(--blocpage-formcontrol-padding);
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}
#page-fiche-produit .form-attribut-select .select-dropdown li:not(.disabled):hover {
    background: #e7e7e7;
}
#page-fiche-produit .form-attribut-select .select-dropdown li.disabled {
    cursor: default;
    color: lightgray;
    text-decoration: line-through;
}
#page-fiche-produit .form-attribut-select .select-dropdown li.selected {
    background: #DDE9FB;
}

/* ...COULEURS */
#page-fiche-produit .form-attribut-select-couleurs .select-value .couleur,
#page-fiche-produit .form-attribut-select-couleurs .select-dropdown li .couleur {
    width: calc(var(--blocpage-texte-size) * 1.2);
}
#page-fiche-produit .form-attribut-select-couleurs .select-dropdown li.disabled .couleur:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}

/* ...IMAGES */
#page-fiche-produit .form-attribut-select-images .select-value .image,
#page-fiche-produit .form-attribut-select-images .select-dropdown li .image {
    width: calc(var(--blocpage-texte-size) * 2);
    border-radius: calc(var(--blocpage-formcontrol-radius) - min(var(--blocpage-formcontrol-padding-x), var(--blocpage-formcontrol-padding-y)));
}
#page-fiche-produit .form-attribut-select-images .select-dropdown li.disabled .image:before,
#page-fiche-produit .form-attribut-select-images .select-dropdown li.disabled .image:after {
    content: '';
    position: absolute;
    background-color: #7f7f7f;
    mix-blend-mode: difference;
}
#page-fiche-produit .form-attribut-select-images .select-dropdown li.disabled .image:before {
    top: 50%;
    left: 0;
    width: 100%;
    height: 1px;
    transform: translateY(-50%) rotate(45deg);
}
#page-fiche-produit .form-attribut-select-images .select-dropdown li.disabled .image:after {
    top: 0;
    left: 50%;
    width: 1px;
    height: 100%;
    transform: translateX(-50%) rotate(45deg);
}