* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Century-Gothic-Std", "Century Gothic";
}


@import url('https://fonts.googleapis.com/css2?family=Allura&family=Bebas+Neue&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital@0;1&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Sassy+Frass&display=swap');

@font-face {
    font-family: "Century-Gothic-Std";
    src: url("../fonts/Century-Gothic-Std-Regular.woff") format("woff");
}

/* info global */

:root {
    /* ===== Colors ===== */
    --Heading_color: #000;
    --red_color: #d43f39;
    --grayLighten_color: #f5f5f5;
    --white-color: #fff;
    /* ===== fonts family===== */
    --Brand_title_fonts:
        'Century Gothic';
    /* ===== fonts weight===== */
    --Brand_title_weight: bold;
    /* ===== fonts size ===== */
    --Brand_title_size_level_one: 106px;
    --Brand_title_size_level_two: 50px;
    --Brand_title_size_level_three: 45px;
    --Brand_title_size_level_forth: 35px;
    --Brand_title_size_level_five: 40px;
    --Brand_title_size_level_seven: 16px;
    --Brand_para_size: 16px;
}

.fa-classic,
.fa-regular,
.fa-solid,
.far,
.fas {
    font-family: "Font Awesome 6 Free";
}



body {
    min-height: 100vh;
}

html {
    overflow-x: hidden !important;
}

a {
    text-decoration: none;
}

li.lang a {
    color: rgb(0, 0, 0);
    font-size: 13px;
}

li.lang a:hover {
    color: rgb(255, 0, 0);
}

/* start hover shine */
.menu_scrol.sticky {
    position: fixed;
    /* top: 0; */
    left: 0;
    width: 100%;
    z-index: 4;
    background: #fff;
    top: 0;
    box-shadow: 0 0 10px #d7d7d7d6;
}

.btn-panier-vide:hover {
    background-color: #000000;
}

.shine {
    position: relative;
    overflow: hidden;
}

.box-actualité {
    background: #fff !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}


.image-box-actualité img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

.title-box-actualité {
    font-size: 20px !important;
    font-weight: bold !important;
    color: #333 !important;
    padding: 15px 20px !important;
    text-align: center !important;
}


.detail-box-actualité {
    display: flex !important;
    justify-content: space-between !important;
    padding: 10px 20px !important;
    font-size: 14px ;
    color: #777 !important;
    /* border-bottom: 1px solid #e0e0e0; */
}

.content-box-actualité {
    padding: 20px !important;
    color: #555 !important;
}

.description-content {
    position: relative;
}

a.titre-actualite-hover:hover {
    color: gray;
}

.description-content .btn-box-blogs a {
    display: inline-block !important;
    padding: 8px 16px !important;
    /* background-color: #007bff; */
    color: #070707 !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    transition: background-color 0.3s ease !important;
}

.shine::before {
    /* background: transparent;
    content: "";
    /* display: block; */
    /* height: 100%; */
    /* left: -75%; */
    /* position: absolute; */
    /* top: 0; */
    /* transform: skewX(-25deg); */
    /* width: 50%; */
    /* z-index: 2; */
}

/*.shine:hover::before,
.shine:focus::before {
    -webkit-animation: shine 0.85s;
    animation: shine 0.85s;
}

@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}

@keyframes shine {
    100% {
        left: 125%;
    }
}
*/

/* end hover shine */

i.first-icon {
    position: fixed;
    bottom: 145px;
    right: 20px;
    font-size: 16px;
    background-color: var(--white-color);
    color: var(--Heading_color);
    cursor: pointer;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    z-index: 2;
    padding: 10px;
    border: 2px solid var(--Heading_color);
}


/* start nos offres */

div.nos_offres {
    background: var(--Heading_color);
    padding: 3px 0 6px;
    text-align: center;
}

div.nos_offres span,
div.nos_offres a {
    color: var(--white-color);
    font-family: var(--Brand_title_fonts);
    font-weight: 300;
    font-size: 12px;
}

section.lamarque.soinPeau .cont-description {
    width: 100%;
    margin-top: 8px;
}

div.nos_offres a {
    text-decoration: underline;
    display: inline-block;
    margin-left: 28px;
}

div.nos_offres a i {
    color: var(--white-color);
}

img.pack-image {
    width: 100%;
}

/* end nos offres */


/* start header logo and icons */

.header_logo_icons {
    padding: 8px 33px;
}

.header_logo_icons .content_lang {
    display: flex;
    gap: 30px;
    margin-top: 10px;
}

.header_logo_icons .lang-menu,
.header_logo_icons .monnais,
.header_logo_icons .laguages {
    position: relative;
    text-decoration: underline;
    cursor: pointer;
}

.header_logo_icons .lang-menu ul.languages_uses {
    padding: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 20px;
    display: none;
    right: inherit;
    z-index: 2;
    transition: .7s;
    list-style: none;
    margin-top: 5px;
}

.header_logo_icons .lang-menu .mon_uses,
.header_logo_icons .lang-menu .laguages_uses {
    padding: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 20px;
    display: none;
    /* right: 11px; */
    z-index: 2;
    transition: .7s;
    list-style: none;
    margin-top: 5px;
}

.telheader a {
    text-decoration: none;
    color: black;
    font-size: 15px;
    padding-top: 17px;
}

.header_logo_icons .lang-menu ul.active,
.header_logo_icons .lang-menu .mon_uses.active,
.header_logo_icons .lang-menu .laguages_uses.active {
    display: block;
    background: white;
}

.header_logo_icons .lang-menu .selected-lang {
    position: relative;
    display: table;
    cursor: pointer;
}

.header_logo_icons .monnais span {
    display: inline-block;
    width: 45px;
}

/*.header_logo_icons .lang-menu .selected-lang:after,
.header_logo_icons .monnais:after,
.header_logo_icons .laguages:after {
    position: absolute;
    content: "\f107";
    font-family: "Font Awesome 5 Pro";
    top: 50%;
    transform: translateY(-50%);
    right: -15px;
}

.header_logo_icons .lang-menu .selected-lang.active:after,
.header_logo_icons .monnais.active:after,
.header_logo_icons .laguages.active:after {
    content: "\f106";
}*/

.header_logo_icons .mahassen-live span:first-of-type {
    display: inline-block;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    font-size: 12.5px;
}

.header_logo_icons .mahassen-live span.live {
    padding: 3px;
    font-family: var(--Brand_title_fonts);
    position: relative;
    top: -13px;
}

.header_logo_icons .mahassen-live span.live:after {
    position: absolute;
    content: "";
    top: -17px;
    right: -17px;
    width: 17px;
    height: 17px;
    background-image: url(../images/live.png);
}

.header_logo_icons .header_icons {
    display: flex;
    gap: 6px;
    margin-top: 6px;
    justify-content: end;
}


/* end header logo and icons */


/* start slider */

.content_slider {
    position: relative;
    padding: 0 33px;
    overflow: hidden;
}

.content_slider .content_networks {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 14px;
    gap: 10px;
    transform: translateY(-50%);
}

.content_slider .content_networks.maquillage {
    justify-content: end;
    align-items: center;
    position: absolute;
    top: 35%;
    bottom: inherit;
    transform: inherit;
    padding-bottom: 33px;
}

.content_slider .carousel-indicators {
    position: absolute;
    right: 0 !important;
    bottom: inherit;
    left: inherit !important;
    z-index: 2;
    display: flex;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 0;
    margin-right: -41px !important;
    margin-bottom: inherit !important;
    margin-left: inherit !important;
    list-style: none;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.content_slider button.carousel-control-prev,
.content_slider button.carousel-control-next {
    display: none;
}

.content_slider .carousel-indicators [data-bs-target] {
    /* box-sizing: inherit; */
    /* flex: 0; */
    /* width: auto; */
    /* width: 13px !important; */
    /* height: 13px !important; */
    /* padding: 0; */
    /* margin-right: 3px; */
    /* margin-left: 3px; */
    /* text-indent: -999px; */
    /* cursor: pointer; */
    /* border-radius: 50% !important; */
    background-color: transparent;
    /* background-clip: padding-box; */
    /* border: 0; */
    /* border-top: 10px solid transparent; */
    /* border-bottom: 10px solid transparent; */
    /* opacity: .1; */
    /* transition: opacity .6s ease; */
}

.content_slider .carousel-indicators button.active {
    opacity: 1;
    position: relative;
}

.content_slider .carousel-indicators button.active:after {
    /* position: absolute; */
    content: "";
    width: 17px;
    height: 2px;
    background-color: var(--Heading_color);
    transform: translateY(-50%);
}

.content_slider .carousel-indicators button {
    opacity: .1;
}

.content_slider .content_networks a {
    color: var(--Heading_color);
}

.content_slider .content_networks a i {
    transition: all 1s;
}

.content_slider .content_networks a:hover i {
    transform: scale(1.2);
}

.content_slider {
    position: relative;
    padding: 0 33px;
}

.content_slider .carousel-item {
    height: 650px !important;
}

.content_slider .carousel-item img.d-block.w-100 {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover;
}

.content_slider .carousel-caption {
    position: absolute;
    right: inherit !important;
    left: 50px !important;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: var(--Heading_color) !important;
    text-align: left !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.content_slider .carousel-caption span.collection {
    font-size: 22px;
    font-family: var(--Brand_title_fonts);
    display: inline-block;
    margin-bottom: 13px;
    letter-spacing: 5px;
}

.content_slider .carousel-caption h1 {
    font-size: 28px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.content_slider .carousel-caption p {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    max-width: 660px;
}

.content_slider .carousel-caption button {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 10px 45px;
    text-transform: uppercase;
    margin-top: 40px;
    transition: opacity 2s;
    border: none;
}

.content_slider .carousel-caption button:hover {
    opacity: .5;
}


/* end slider */

nav:not(.nav-breadcrumb) {
    border-top: 1px solid #e2e2e2;
    z-index: 99;
    padding: 12px 0;
}

nav .navbar {
    height: 100%;
    /* max-width: 1250px; */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    padding: 0 50px;
}

nav .navbar .logo {
    display: none;
}

.navbar .logo a {
    font-size: 30px;
    text-decoration: none;
    font-weight: 600;
}

nav .navbar .nav-links {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

nav .navbar .links {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
}

nav .navbar .links li {
    /* position: relative; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    padding: 0 14px;
}

nav .navbar .links li a {
    height: 100%;
    font-weight: 300;
    text-decoration: none;
    white-space: nowrap;
    color: var(--Heading_color);
    font-size: 11.5px;
    font-weight: lighter;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
}

.telheader a {
    font-size: 12px;
}

nav .navbar .links li a:hover {
    color: var(--red_color);
}

.links li:hover i.fa-caret-down,
.links li:hover .fa-caret-down {
    transform: rotate(180deg);
}

nav .navbar .links li .fa-caret-right,
nav .navbar .links li .fa-caret-down {
    height: 100%;
    width: 22px;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    font-size: 12px;
}

nav .navbar .links li .sub-menu {
    position: absolute;
    top: 36px;
    left: 0;
    right: 0;
    line-height: 27px;
    background: var(--white-color);
    border-radius: 0 0 4px 4px;
    display: none;
    z-index: 20;
    padding: 20px 40px;
    box-shadow: 0 0px 3px 0 rgb(0 0 0 / 15%);
}

nav .navbar .links li .sub-menu .nav-n1 {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

nav .navbar .links li .sub-menu .nav-n1 h4 {
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: bold;
    font-size: 13px;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 {
    padding: 0;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.li-mariee a.mariee {
    padding: 5px;
    background: #fde2e1;
    text-transform: uppercase;
    text-align: inherit;
    font-style: italic;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1>li {
    padding: 0;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child {
    position: relative;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child.active .ul-nav-n2 {
    display: block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li {
    position: relative;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child.active .ul-nav-n3 {
    display: block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n3 {
    position: absolute;
    right: -100%;
    position: absolute;
    /* right: -127%; */
    padding: 0;
    top: 0;
    -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
    box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    display: none;
    z-index: 1;
    background: white;
}


/* nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a:after,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a:after {
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    content: "\f054";
    width: 10px;
    height: 10px;
    font-size: 10px;
    right: -17px;
} */

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child .nav-n1-has-child-flex,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 .nav-n2-has-child-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
    width: 100%;
    height: 100%;
    position: relative;
    display: inline-block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a.active,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a:hover {
    color: red;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
    padding: 11px;
    font-size: 10px;
    line-height: 8px;
    cursor: pointer;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
    position: absolute;
    left: 0;
    padding: 0;
    top: 7px;
    -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
    box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    display: none;
    z-index: 1;
    background: white;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a {
    position: relative;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
    max-width: 200px;
    height: 100px;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image:last-of-type {
    margin-bottom: 41px !important;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image.no-list {
    margin-top: 20px;
    align-items: end;
    justify-content: start;
    gap: 20px;
}

.navbar .links li .sub-menu li {
    padding: 0 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.navbar .links li .sub-menu a {
    font-size: 12.5px;
    font-weight: 500;
    font-family: var(--Brand_title_fonts);
    text-transform: capitalize;
}

.navbar .links li .sub-menu .fa-caret-right {
    line-height: 40px;
}

.navbar .links li .sub-menu .more-sub-menu {
    position: absolute;
    top: 0;
    left: 100%;
    border-radius: 0 4px 4px 4px;
    z-index: 1;
    display: none;
}

.links li .sub-menu .more:hover .more-sub-menu {
    display: block;
}

.navbar .search-box {
    position: relative;
    height: 40px;
    width: 40px;
    display: none;
}

.navbar .search-box i {
    position: absolute;
    height: 100%;
    width: 100%;
    line-height: 40px;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.navbar .search-box .input-box {
    position: absolute;
    right: calc(100% - 40px);
    top: 80px;
    height: 60px;
    width: 300px;
    border-radius: 6px;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s ease;
}

.navbar.showInput .search-box .input-box {
    top: 65px;
    opacity: 1;
    pointer-events: auto;
    ;
}

.search-box .input-box::before {
    content: '';
    position: absolute;
    height: 20px;
    width: 20px;
    right: 10px;
    top: -6px;
    transform: rotate(45deg);
}

.search-box .input-box input {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 4px;
    transform: translate(-50%, -50%);
    height: 35px;
    width: 280px;
    outline: none;
    padding: 0 15px;
    font-size: var(--Brand_title_size_level_seven);
    border: none;
}

.navbar .nav-links .sidebar-logo {
    display: none;
}

.navbar .bx-menu {
    display: none;
}

@media (max-width:920px) {
    nav .navbar {
        max-width: 100%;
        padding: 0 25px;
    }

    nav .navbar .logo a {
        font-size: 27px;
    }

    nav .navbar .links li {
        padding: 0 10px;
        white-space: nowrap;
    }

    nav .navbar .links li a {
        font-size: 15px;
    }
}

@media (max-width:992px) {
    nav .navbar .logo {
        display: none;
    }

    .navbar .bx-menu {
        display: block;
    }

    nav .navbar .nav-links {
        position: fixed;
        top: 0;
        left: -100%;
        display: block;
        max-width: 270px;
        width: 100%;
        line-height: 40px;
        padding: 20px;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        transition: all 0.5s ease;
        z-index: 1000;
        background: white;
        overflow-y: scroll;
    }

    .navbar .nav-links .sidebar-logo {
        display: grid;
        grid-template-columns: auto 25px;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .sidebar-logo .logo-name img {
        width: 160px;
    }

    /* .sidebar-logo .logo-name {
        font-size: 25px;
    } */
    .sidebar-logo i,
    .navbar .bx-menu {
        font-size: 20px;
    }

    nav .navbar .links {
        display: block;
        margin-top: 20px;
        padding: 0;
    }

    nav .navbar .links li .arrow {
        line-height: 40px;
    }

    nav .navbar .links li {
        display: block;
    }

    nav .navbar .links li .sub-menu {
        position: relative;
        top: 0;
        box-shadow: none;
        display: none;
        padding: 0;
    }

    nav .navbar .links li .sub-menu li {
        border-bottom: none;
    }

    .navbar .links li .sub-menu .more-sub-menu {
        display: none;
        position: relative;
        left: 0;
    }

    .navbar .links li .sub-menu .more-sub-menu li {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .links li:hover i.fa-caret-down,
    .links li:hover .fa-caret-down {
        transform: rotate(0deg);
    }

    .navbar .links li .sub-menu .more-sub-menu {
        display: none;
    }

    .navbar .links li .sub-menu .more span {
        display: flex;
        align-items: center;
    }

    .links li .sub-menu .more:hover .more-sub-menu {
        display: none;
    }

    nav .navbar .links li:hover .htmlCss-sub-menu,
    nav .navbar .links li:hover .js-sub-menu {
        display: none;
    }

    .navbar .nav-links.show1 .links .htmlCss-sub-menu,
    .navbar .nav-links.show3 .links .js-sub-menu,
    .navbar .nav-links.show2 .links .more .more-sub-menu {
        display: block;
    }

    .navbar .nav-links.show1 .links i.fa-caret-down,
    .navbar .nav-links.show3 .links .fa-caret-down {
        transform: rotate(180deg);
    }

    .navbar .nav-links.show2 .links .fa-caret-right {
        transform: rotate(90deg);
    }
}

@media (max-width:370px) {
    nav .navbar .nav-links {
        max-width: 100%;
        background: var(--white-color);
    }
}


/* start section collection */

section.collection {
    /* padding-bottom: 50px; */
    padding-top: 50px;
}

section.collection .maps {
    padding: 25px 0 !important;
    position: fixed;
    bottom: 11px;
    right: 24px;
    z-index: 3;
}

section.collection .collection_hiver {
    position: relative;
}

section.collection .desc_collection {
    padding: 55px 0 0 40px;
    display: grid;
    justify-content: start;
    align-content: baseline;
    gap: 40px;
}

section.collection .desc_collection h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}

section.collection .desc_collection h4 {
    font-weight: 400;
    margin: 0 0 35px;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}

section.collection .desc_collection p,
section.autonome .content-autonome-desc p,
section.nouveaute .content-noveaute-desc .contnet-nouveaute p {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 30px;
    font-family: 'Century-Gothic-Std';
    line-height: 29px;
    /* letter-spacing: 0.1rem; */
}

.description-by-mahassen {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 30px;
    font-family: 'Century-Gothic-Std';
    line-height: 29px;
    margin-top: 20px;
}

.titre-by-mahassen {
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}



section.collection .desc_collection a.decouvrir,
section.autonome .content-autonome-desc a.decouvrir,
section.maquillage .content-autonome-desc a.decouvrir,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
section.avis-clients a.decouvrir,
section.mahassen-lives .mahassen-live-desc a.decouvrir,
.cont-description a.decouvrir {
    font-size: 13.5px;
    text-decoration: none;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    padding: 15px 15px 15px 0;
    letter-spacing: 0.02rem;
    background: transparent !important;
    background-position: center;
    animation: change 3s linear infinite;
    position: relative;
    font-family: "Century-Gothic-Std", "Century Gothic";
    background: transparent !important;
}

@keyframes change {
    0% {
        background-image: url(../images/bg-btn.jpg);
    }

    100% {
        background-image: url(../images/bg-red.jpg);
    }
}

section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.maquillage .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir i.fa-solid.fa-arrow-right-long,
section.avis-clients a.decouvrir i.fa-solid.fa-arrow-right-long,
section.hamam.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.massage.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.massage.coiffure.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long {
    margin-left: 12px;
}

/* section.collection .desc_collection a.decouvrir:after,
section.autonome .content-autonome-desc a.decouvrir:after,
section.maquillage .content-autonome-desc a.decouvrir:after,
section.mahassen-lives .mahassen-live-desc a.decouvrir:after,
section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one a.decouvrir:after,
section.carte-mahassen .content-carte-mahassen.carte-one .content-carte-one a.decouvrir:after,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:after {
    content: "";
    position: absolute;
    bottom: 13px;
    width: 113px;
    height: 1px;
    left: 0;
    right: inherit;
    top: inherit;
    background: var(--Heading_color);
} */


section.collection .desc_collection a.decouvrir:after,
section.autonome .content-autonome-desc a.decouvrir:after,
section.maquillage .content-autonome-desc a.decouvrir:after,
section.mahassen-lives .mahassen-live-desc a.decouvrir:after,
section.hamam.mah-Centre.mah .cont-description a.decouvrir:after,
section.massage.mah-Centre.mah .cont-description a.decouvrir:after,
section.massage.coiffure.mah-Centre.mah .cont-description a.decouvrir:after,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:after {
    content: "";
    position: absolute;
    bottom: 13px;
    width: 113px;
    height: 1px;
    left: 0;
    right: inherit;
    top: inherit;
    background: black;
}

@keyframes animate {
    0% {
        background-position: left;
    }

    50% {
        background-position: center;
    }

    100% {
        background-position: right;
    }
}

section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
section.mahassen-lives .mahassen-live-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one a.decouvrir i.fa-solid.fa-arrow-right-long,
section.carte-mahassen .content-carte-mahassen.carte-one .content-carte-one a.decouvrir i.fa-solid.fa-arrow-right-long,
section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long {
    margin-left: 10px;
}

section.collection .desc_collection .collection_networks,
section.autonome .content-autonome .collection_networks,
.cont-description .collection_networks,
.fond-de-tient-description .collection_networks {
    display: flex;
    gap: 35px;
    margin-top: 20px;
}

section.collection .desc_collection .collection_networks a,
section.autonome .content-autonome .collection_networks a,
.cont-description .collection_networks a,
.fond-de-tient-description .collection_networks a {
    padding: 7px 10px;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: inherit;
    display: inline-block;
    border: 1px solid var(--Heading_color);
    color: var(--Heading_color);
    transition: all 2s;
    position: relative;
}

section.collection .desc_collection .collection_networks a:hover,
.content-autonome .collection_networks a:hover,
.fond-de-tient-description .collection_networks a:hover {
    opacity: .5;
}

section.collection .collection_hiver div#carouselExampleCaptions1 {
    max-width: 725px;
    /* height: 740px; */
    margin-left: 0;
    margin-right: 0;
    min-height: 740px;
}

/*
section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
    height: 645px !important;
    width: 625px;
} */

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
    height: 100% !important;
    width: 100%;
    object-fit: cover;
}

section.collection .collection_hiver .carousel-indicators {
    bottom: -60px;
    gap: 20px;
    margin-right: 150px;
}

section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-next,
section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-prev,
section.autonome div#carouselExampleCaptions2 button.carousel-control-prev,
section.autonome div#carouselExampleCaptions2 button.carousel-control-next,
section.maquillage div#carouselExampleCaptions3 button.carousel-control-next,
section.maquillage div#carouselExampleCaptions3 button.carousel-control-prev {
    display: none;
}

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-indicators button,
section.autonome div#carouselExampleCaptions2 .carousel-indicators button,
section.maquillage .content-carousel-maquillage .carousel-indicators button,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators button {
    width: auto;
    height: auto;
    background-color: transparent !important;
    opacity: 1;
    box-sizing: inherit;
    border-top: 0px solid transparent !important;
    border-bottom: 0px solid transparent !important;
}

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-indicators button.active,
section.autonome div#carouselExampleCaptions2 .carousel-indicators button.active,
section.maquillage .content-carousel-maquillage .carousel-indicators button.active,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators button.active {
    /* width: 25px; */
    /* height: 25px; */
    /* border-radius: 50%; */
    /* background-color: transparent !important; */
    /* border: 2px solid #989898; */
}

section.collection .collection_hiver .content-img_collection {
    position: absolute;
    bottom: -38px;
    right: inherit;
    left: 33px;
    width: 375px;
    /* height: 425px; */
}

section.collection .collection_hiver .content-img_collection img {
    width: 100%;
    /* height: 100%; */
}

section.collection .collection_hiver .contents-img_collection {
    position: absolute;
    bottom: -38px;
    right: inherit;
    left: 33px;
    width: 375px;
    /* height: 425px; */
}

section.collection .collection_hiver .contents-img_collection img {
    width: 100%;
    /* height: 100%; */
}

section.collection .desc_collection .spa.maquillage {
    /* height: 127px; */
}

section.collection .desc_collection .spa img {
    width: 100%;
    /* height: 100%; */
}


/* end section collection */


/* start section autonome */



section.autonome .content-autonome {
    display: grid;
    grid-template-columns: 42% 58%;
    position: relative;
}

.art-block {
    width: 100%;
}

section.autonome .content-autonome .picture {
    /* height: 765px; */
    margin-top: 20px;
}

p.justified-text-modify {
    padding-top: 10px;
}

section.autonome .content-autonome .picture img {
    /* height: 100%; */
    width: 100%;
    object-fit: cover;
}

h2#swal2-title {

    color: black;
}

div#swal2-html-container {

    color: black;
}

.reseaux {
    padding-bottom: 10px;
    padding-right: 6px;
}

section.autonome .content-autonome-desc h2 {
    font-size: 29px;
    padding-left: 401px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    position: absolute;
    /* top: 200px; */
    left: 0;
    right: inherit;
    width: auto;
    color: var(--Heading_color);
    z-index: 1;
}

section.autonome .content-autonome-desc .title-maquillage-pro {
    font-size: 29px;
    /* padding-left: 401px; */
    font-family: "Century-Gothic-Std", "Century Gothic" !important;
    text-transform: uppercase;
    position: absolute;
    /* top: 200px; */
    left: 0;
    right: inherit;
    width: auto;
    /* color: var(--Heading_color); */
    z-index: 1;
}



.recrutement-title-one {
    font-size: 32px;
    font-weight: 600;
    text-align: center !important;
}


section.autonome .content-autonome-desc span {
    color: var(--white-color);
}

.cont-descriptionn-actualité-centre {
    width: 100%;
    max-width: 80%;
    margin: 40px auto;
    text-align: justify;
    padding: 0 10%;
}


section.catalogBloc {
    padding: 20px 0;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

section.autonome .content-autonome-desc {
    padding-top: 100px;
}

section.autonome .content-autonome-desc p {
    padding-right: 20px;
}

section.autonome .content-autonome .collection_networks a,
.cont-description .collection_networks a {
    position: relative;
    display: inline-block;
}

.content-autonome-desc a.decouvrir {
    margin-top: 0;
}

section.autonome .content-autonome-desc a.decouvrir {
    margin-left: 0;
    display: inline-block;
}

section.autonome .content-autonome .collection_networks {
    margin-left: 40px;
}

.content-autonome .collection_networks,
.cont-description .collection_networks {
    margin-top: 50px;
}

.content-autonome .collection_networks a:not(:last-of-type):after,
.cont-description .collection_networks a:not(:last-of-type):after,
.fond-de-tient-description .collection_networks a:not(:last-of-type):after {
    position: absolute;
    content: "";
    height: 35px;
    width: 1px;
    background-color: #adadad;
    right: -20px;
    top: 0;
    bottom: 0;
}

section.autonome div#carouselExampleCaptions2 {
    height: 725px;
    position: relative;
}

section.autonome div#carouselExampleCaptions2 .carousel-item {
    /* height: 725px; */
    margin-top: 20px;
}

section.autonome div#carouselExampleCaptions2 .carousel-item img {
    /* height: 600px !important; */
    width: 100% !important;
    background-size: cover;
    margin: 0 auto;
}

.custom-caption {
    /* background-color: rgba(255, 255, 255, 0.7); */
    padding: 10px;
    border-radius: 5px;
    top: 39%;
}

.item-desc button {
    text-decoration: none;
    background-color: black;
    color: white;
}

button.btn-ajouter-brush.shine {
    outline: none;
    border: none;
    background: black;
    color: white;
    font-size: var(--Brand_para_size);
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 300;
    text-transform: uppercase;
    padding: 6px 0;
    transition: all 2s;
    margin: 0 auto;
    width: 168px;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

.justified-text {
    text-align: justify;
    text-justify: inter-word;

}


section.autonome div#carouselExampleCaptions2 .carousel-caption {
    position: absolute;
    bottom: 50px;
    z-index: 0;
    width: 100%;
    left: 0;
    text-align: center;
    padding-top: 0;
    padding-bottom: 0;
}

/* .item-icons {
    position: absolute;
    top: 2px;
    left: 21px !important;
    padding-right:11px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 25px;
    font-size: 13px;
    box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
    font-family: var(--Brand_title_fonts);
    text-align: center;
    flex-direction: column;
} */

section.autonome div#carouselExampleCaptions2 .carousel-caption p,
section.maquillage .content-carousel-maquillage .carousel-caption p,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
    color: var(--Heading_color);
    font-family: var(--Brand_title_fonts);
    font-size: 18px;
    font-weight: 450;
    margin-bottom: 5px;
}

section.autonome div#carouselExampleCaptions2 .carousel-caption h4,
section.maquillage .content-carousel-maquillage .carousel-caption h4,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption h4 {
    color: #f33f38;
    font-family: 'Century-Gothic-Std';
    font-size: 16px;
}

section.autonome div#carouselExampleCaptions2 .carousel-indicators {
    position: absolute;
    top: -146px;
    right: -105px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    align-items: flex-end;
    text-align: right;
    z-index: 0;
}

section.autonome div#carouselExampleCaptions2 .carousel-indicators button:not(.active) {
    margin-right: 12px;
}


/* end section autonome */


/* start section maquillage */

section.maquillage {
    padding: 50px 170px 50px;
    background: #f5f5f5;
}

.owl-nav button {
    background: none;
    border: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    /* Arrow color */
    font-size: 2rem;
    cursor: pointer;
}

.owl-nav .owl-prev {
    left: -30px;
    /* Position the left arrow */
}

.owl-nav .owl-next {
    right: -30px;
    /* Position the right arrow */
}

.owl-nav button:hover {
    color: #000;
    /* Change color on hover */
}

.owl-nav button span {
    display: inline-block;
}


section.maquillage .video-container {
    height: 745px;
    width: 100%;
    position: relative;
}

section.maquillage .video-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.maquillage .video-container::after {
    position: absolute;
    content: "";
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playvideo.png);
    background-size: cover;
    pointer-events: none;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 2;
    /* animation: scale 3s linear infinite; */
}

@keyframes scale {
    0% {
        box-shadow: -4px 2px 111px 1px rgba(5, 3, 3, 0.75);
    }

    100% {
        box-shadow: -4px 2px 111px 28px rgba(5, 3, 3, 0.75);
    }
}

section.maquillage .popup-video {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background: rgba(0, 0, 0, .8);
    height: 100%;
    width: 100%;
}

section.maquillage .popup-video video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 750px;
    height: 750px;
    border-radius: 5px;
    border: 2px solid var(--white-color);
    object-fit: cover;
}

section.maquillage .popup-video span {
    position: absolute;
    top: 5px;
    right: 20px;
    font-size: 50px;
    color: var(--white-color);
    font-weight: 700;
    z-index: 100;
    cursor: pointer;
}

section.maquillage video {
    height: 100%;
    width: 100%;
}

section.maquillage .content-autonome-desc {
    /* margin-top: 130px; */
    padding-right: 6px;
    margin-left: 80px;
    padding-left: 93px;
    margin-top: 0px;
}

h2.adjust-hammem-spa-title {
    margin-bottom: 20px;
}


section.maquillage .content-autonome-desc a.decouvrir {
    margin-top: 26px;
}

section.maquillage .content-autonome-desc h2 {
    font-family: var(--Brand_title_fonts);
    font-size: 27px;
    text-transform: uppercase;
    margin-bottom: 30px;
}

section.maquillage .content-autonome-desc p {
    font-family: var(--Brand_title_fonts);
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 30px;
    letter-spacing: 0.01rem;
}

section.maquillage .content-autonome-desc a.decouvrir:hover {
    /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
    background-size: contain !important;
    transition: 1s all ease-out;
}

section.maquillage .content-carousel-maquillage {
    position: relative;
    margin-top: 43px;
}

section.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: 40px;
    width: 470px;
    height: 685px;
    top: 40px;
    left: -89px;
    z-index: 0;
}

.content-img-esthetique img {
    width: 60px;
    object-fit: cover;
    /* border-radius: 4px; */
    margin-right: 10px;
}

.content-img-esthetique img {
    max-width: 100%;
}


@media (min-width: 1200px) and (max-width: 1676px) {
    section.esthetique-home .content-img-esthetique img {
        width: 100%;
        object-fit: cover;
    }

    .title-contact {
        margin-left: 0px;

    }
}

.content-carousel-maquillage img {
    width: 380px !important;
}

section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 45px;
    gap: 30px;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner {
    height: 100%;
    position: relative;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
    bottom: 0;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
    height: 725px;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
    position: absolute;
    bottom: 60px;
    left: 0;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner img,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner img {
    height: 500px;
    box-shadow: 4px 6px 15px -4px rgb(0 0 0 / 10%);
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .new,
section.product-cosmetique div#product-slider .product-item .new,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .new,
.product-item .new,
.carousel-item .new,
.carousel-maquillage .new {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #f33f38;
    padding: 4px 11px;
    font-size: 13px;
    background: var(--white-color);
    box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
    font-family: var(--Brand_title_fonts);
    text-align: center;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    /* background-image: url(../images/bg-remise.png); */
    background: red;
    /* background-position: center; */
    border-radius: 50%;
}

.carousel-maquillage .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    /* background-image: url(../images/bg-remise.png); */
    background: red;
    /* background-position: center; */
    border-radius: 50%;
}

.carousel-maquillage .remise span {
    color: white;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise span,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise span,
carousel-maquillage .carousel-inner .remise span {
    color: var(--white-color);
    font-family: var(--Brand_title_fonts);
    font-size: var(--Brand_para_size);
    font-weight: 700;
    /* margin-top: 23px; */
    /* padding: 3px 58px; */
    display: inline-block;
    /* transform: rotate(45deg); */
}


/* end section maquillage */


/* start section nouveaute */

section.nouveaute {
    padding: 50px 35px 50px;
}

section.nouveaute .content-image {
    /* height: 552px; */
}

section.nouveaute .content-image img {
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}

section.nouveaute .content-noveaute-desc {
    position: relative;
    height: 100%;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
    font-size: 25px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    font-weight: 400;
    width: auto;
    color: var(--Heading_color);
    margin-bottom: 22px;
}


/* end section nouveaute */


/* start product-cosmetique */

section.product-cosmetique {
    padding: 0 0 20px;
}

section.product-cosmetique .item {
    padding: 0px 28px;
    display: inline-block;
}

section.product-cosmetique .item .product-item {
    /* height: 400px; */
    position: relative;
}

section.product-cosmetique .item .product-item img {
    height: 100%;
    background-size: cover;
    width: 100%;
}

@keyframes viewicons {
    0% {
        bottom: 0;
    }

    50% {
        bottom: 20px;
    }

    100% {
        bottom: 50px;
    }
}

section.product-cosmetique .item:hover .item-icons {
    display: block;
}

section.product-cosmetique .item .product-item .item-icons i {
    padding: 20px 25px;

    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons-left i {
    padding: 20px 25px;

    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons i:hover {
    color: #acacac;
}

section.product-cosmetique .item .product-item .item-icons-left i:hover {
    color: #acacac;
}

section.product-cosmetique .slick-slider {
    margin: 0 13px;
}

section.product-cosmetique .item .item-desc {
    padding: 26px 32px;
    text-align: center;
}

section.product-cosmetique .item a {
    text-decoration: none;
}



section.product-cosmetique .item .item-desc h5 {
    font-size: 20px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: #f33f38;
}

section.product-cosmetique button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 35px;
    width: 50px;
    height: 50px;
    left: inherit;
}

section.product-cosmetique button.slick-prev.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 84px;
    width: 50px;
    height: 50px;
    left: inherit;
    z-index: 3;
}

section.product-cosmetique .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/* end product-cosmetique */


/* start section avis */

section.avis-clients {
    padding: 0 0 50px 0;
    text-align: center;
    position: relative;
}

section.avis-clients img {
    position: absolute;
    top: 66px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background: var(--white-color);
    border-radius: 50%;
}

section.avis-clients .content-slider-avis {
    max-width: 80%;
    margin: 0 auto;
    position: relative;
}

section.avis-clients .avis-slider.slick-initialized.slick-slider {
    background-color: #f5f5f5;
    padding: 106px 0 50px;
    position: relative;
}

section.avis-clients .avis-slider .item {
    color: var(--Heading_color);
    position: relative;
    text-decoration: none;
}

section.avis-clients .avis-slider .item p {
    font-size: 20px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    max-width: 100%;
    padding: 0 30px;
    margin: 0 auto;
}

section.avis-clients .avis-slider .item .author-avis {
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    margin-top: 54px;
    position: relative;
    font-style: italic;
}

section.avis-clients .avis-slider .item .author-avis:after {
    position: absolute;
    content: "";
    width: 2px;
    height: 32px;
    top: inherit;
    bottom: 30px;
    background: var(--Heading_color);
    left: 50%;
    transform: translateX(1px);
}

section.avis-clients h2 {
    font-size: 27px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 28px;
}

section.avis-clients .avis-slider .slick-dots {
    top: 50%;
    height: 5px;
}

section.avis-clients .slick-prev:before {
    content: "";
    background: var(--Heading_color);
    font-size: 51px;
    position: absolute;
    left: -69px;
    width: 115px;
    height: 2px;
}

section.avis-clients .slick-next:before {
    background: var(--Heading_color);
    content: "";
    font-size: 51px;
    position: absolute;
    right: -69px;
    width: 115px;
    height: 2px;
}

span.slick-prev-index {
    position: absolute;
    top: 43%;
    left: -94px;
}

span.slick-next-index {
    position: absolute;
    top: 43%;
    right: -94px;
}

section.avis-clients a.decouvrir {
    margin-top: 30px;
    background: url(../images/bg-votre-avis.png);
    background-size: cover;
}


/* end section avis */


/* start section carte mahassen */

section.carte-mahassen {
    padding: 50px 35px 20px;
}

section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
    display: grid;
    grid-template-columns: 60px auto 142px;
}

section.carte-mahassen .content-carte-mahassen.carte-two {
    display: grid;
    grid-template-columns: auto 100px;
    padding-left: 65px;
    padding-top: 39px;
}

section.carte-mahassen .content-carte-mahassen .content-img img {
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
}

section.carte-mahassen .content-carte-mahassen .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.carte-mahassen .content-carte-mahassen span.profiter {
    writing-mode: tb-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    text-align: end;
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
}

section.carte-mahassen .content-carte-mahassen span.profiter .remise,
carousel-maquillage span.profiter .remise {
    color: #f33f38;
}

section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
    writing-mode: vertical-rl;
    font-size: 150px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: var(--grayLighten_color);
    margin-left: 126px;
    letter-spacing: 0.2rem;
    display: inherit;
    line-height: initial;
}

section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: #fde2e1;
    margin-top: 361px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
    margin-top: 50px;
}

section.carte-mahassen .content-carte-mahassen.content-carte-one .content-img {
    margin-bottom: 45px;
    max-height: 600px;
    width: 100%;
}


section.carte-mahassen .content-carte-mahassen.carte-two .content-img {
    margin-bottom: 45px;
    max-height: 802px;
}



section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .contents-img {
    margin-top: 50px;
}

section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .contents-img {
    margin-bottom: 45px;
    max-height: 600px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one .contents-img {
    margin-bottom: 45px;
    max-height: 600px;
    width: 100%;
}

section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
    margin-top: 264px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
    font-size: 38px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 25px;
    letter-spacing: 0.02rem;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
    font-size: 27px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 21px;
    letter-spacing: 0.02rem;
}

.content-carte-one p {
    font-size: 14px;
    line-height: 29px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button {
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    padding: 8px 11px;
    background: var(--white-color);
    margin-top: 14px;
    transition: opacity 2s;
    text-transform: uppercase;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button:hover {
    opacity: .5;
}


/* end section carte mahassen */


/* start section mahassen live */

section.mahassen-lives {
    padding: 30px 76px 30px 30px;
    position: relative;
    /* margin-top: 100px; */
}

/* section.mahassen-lives .mahassen-live-desc h2, .cont-description h2 {
    font-family: 'Century-Gothic-Std';

    color: var(--Heading_color);
} */

.title-bloc-marque {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


section.mahassen-lives .item {
    position: relative;
    padding: 0 20px;
}

section.mahassen-lives .item a img {
    width: 100%;
    /* height: 100%; */
}

section.mahassen-lives .item::after {
    position: absolute;
    content: "";
    width: 60px;
    height: 60px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playlive.png);
    cursor: pointer;
    pointer-events: none;
    /* animation: scale 1s linear infinite; */
    border-radius: 50%;
    background-size: contain;
}

section.mahassen-lives button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: -54px;
    right: 35px;
}

.swal-error-popup {
    background-color: #f8d7da;
    border: 2px solid #dc3545;
}

.swal-error-title {
    color: #dc3545;
}

.text-error {
    color: #000000;
}


.custom-cancel-btn {
    background-color: #a7a7a7 !important;
    color: white !important;
}


.custom-confirm-btn:hover {
    background-color: #45a049;
}


.custom-cancel-btn {
    background-color: #f44336;
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
}

.custom-cancel-btn:hover {
    background-color: #e53935;
}

section.mahassen-lives .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    width: 51px;
    height: 51px;
    background: url(../images/btnright.png)center no-repeat;
    height: 68px;
    width: 60px;
    content: "";
}

section.mahassen-lives button.slick-prev.slick-arrow {
    position: absolute;
    bottom: -54px;
    left: inherit;
    right: 114px;
    top: inherit;
}

a.decouvrir {
    padding-top: 30px;
}

section.mahassen-lives .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    font-weight: 300;
    width: 51px;
    height: 51px;
    background: url(../images/btnleft.png)center no-repeat;
    height: 68px;
    width: 60px;
    content: "";
}

section.mahassen-lives .mahassen-live-desc .diese {
    margin-top: 0;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    height: 116px;
}



section.mahassen-lives .mahassen-live-desc .diese::after {
    position: absolute;
    content: "";
    width: 531px;
    height: 286px;
    background: #fbfaf8;
    top: 23px;
    right: -206px;
    z-index: -1;
}

section.mahassen-lives .mahassen-live-desc {
    font-size: 14px;
    font-family: 'Century-Gothic-Std';
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 85px;
    line-height: 27px;
}



section.mahassen-lives .mahassen-live-desc a.decouvrir {
    margin-top: 0;
}

section.mahassen-lives .mahassen-live-desc span.live {
    position: absolute;
    bottom: 76px;
    left: 8%;
    height: 324px;
    width: 624px;
    z-index: -1;
}

section.mahassen-lives .mahassen-live-desc span.live img {
    width: 100%;
    object-fit: cover;
}


/* end section mahassen live */


/* start section abonnez vous */

section.abonnez-vous {
    padding: 50px 30px 65px;
    text-align: center;
    /* background: #f5f5f5; */
}

section.abonnez-vous.no-bg {
    background: #fff;
}

section.abonnez-vous h2 {
    font-size: 24px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    padding-bottom: 31px;
    padding-top: 20px;
    letter-spacing: 0.02rem;
}

.img-flex {
    height: 200px;
    width: auto;
    object-fit: cover;
}

.fidelite-one-acceuil {
    font-size: 1.5rem;
    margin-left: 20px;
    display: flex;
    align-items: center;
    height: auto !important;
}


section.abonnez-vous h5 {
    font-size: 18px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    color: var(--Heading_color);
    margin-bottom: 45px;
}

section.abonnez-vous .item {
    padding: 0 10px;
    position: relative;
}

section.abonnez-vous:not(.instagram) .item::after {
    position: absolute;
    content: "";
    width: 56px;
    height: 40px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../images/playyoutube.png);
    cursor: pointer;
    pointer-events: none;
}

section.abonnez-vous .item img {
    width: 100%;
    /* height: 100%; */
}

section.abonnez-vous .slick-slider {
    margin: 0 -15px;
}


/* end section abonnez vous */


/* start section abonnez vous */

section.newsletter {
    padding: 20px 0 45px;
    text-align: center;
}

section.newsletter h2 {
    font-size: 22px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 8px;
    letter-spacing: 0.02rem;
}

section.newsletter span {
    font-size: 19px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.01rem;
}

section.newsletter .email {
    max-width: 1050px;
    margin: 35px auto 0;
    display: grid;
    grid-template-columns: auto 238px;
    gap: 20px
}

section.newsletter .email input[type="email"] {
    padding: 16px;
    border: 1px solid #382e2e;
    outline: none;
}

section.newsletter .email .inscrire {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
}

section.newsletter .email .inscrire:hover {
    opacity: 0.5;
}


/* end section abonnez vous */


/* start section icons */

section.icons {
    padding: 50px 0;
    text-align: center;
}

section.icons .container-fluid {
    position: relative;
}

section.icons .container-fluid:after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    width: 15px;
    height: 100%;
    background: var(--white-color);
}

section.icons .container-fluid::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    bottom: 0;
    width: 15px;
    height: 100%;
    background: var(--white-color);
}

section.icons .item-desc img {
    margin: 0 auto 28px;
}

section.icons .item {
    position: relative;
    padding: 0 10px;
}

/* section.icons .item:after {
    position: absolute;
    content: "";
    height: 100%;
    width: 1px;
    background: #e6e6e6;
    right: 0;
    top: 0;
    bottom: 0;
} */


/* e6e6e6 */

section.icons .item-desc h5 {
    font-size: 13px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: bold;
    color: var(--Heading_color);
    margin-bottom: 20px;
}


/* end section icons */


/* start footer */

section.footer {
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 52px 25px 25px;
    border-bottom: 2px solid #2e2e2e;
}

section.footer .footer-content {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 60px;
}

section.footer .footer-content h3 {
    font-size: var(--Brand_title_size_level_seven);
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    font-weight: bold;
    color: var(--white-color);
    margin-bottom: 25px;
}

section.footer .footer-content span {
    margin-bottom: 12px;
    display: block;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.55px;
}

section.footer .footer-content h3 span {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: initial;
    display: block;
    margin-top: 10px;
}

section.footer .footer-content .adresse {
    padding-left: 25px;
    background-image: url(../images/icon-maps.png);
    background-position: top 3px left;
    background-repeat: no-repeat;
    margin-bottom: 20px;
}

section.footer .footer-content .telephone a,
section.footer .footer-content .email a {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    text-transform: initial;
    display: block;
    color: var(--white-color);
    text-decoration: none;
}

section.footer .footer-content .telephone a span,
section.footer .footer-content .email a span {
    margin: 0;
}

section.footer .footer-content .telephone {
    padding-left: 25px;
    background-image: url(../images/icon-tel.png);
    background-position: top 4px left;
    background-repeat: no-repeat;
    margin-bottom: 20px;
}

section.footer .footer-content .email {
    padding-left: 25px;
    background-image: url(../images/icon-email.png);
    background-position: top 7px left;
    background-repeat: no-repeat;
}

.footer-networks {
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 0 21px;
}

.footer-networks a {
    color: var(--white-color);
}

.footer-networks i {
    font-size: 14px;
    font-weight: bold;
    margin-right: 5px;
    cursor: pointer;
}

.footer-networks .carte-banck {
    display: flex;
    gap: 15px;
}


/* end footer */


/* ===============================================
            start page centre mahassen
=============================================== */


/* start marketing */

.header-marketing {
    height: auto;
    position: relative;
}

.header-marketing:after {
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #00000020;
    z-index: 0;
}

.header-marketing img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header-marketing .header-marketing-icons {
    position: absolute;
    top: 50%;
    right: 0;
    color: var(--white-color);
    z-index: 1;
}

.header-marketing .header-marketing-icons {
    position: absolute;
    top: 50%;
    right: 0;
    color: var(--white-color);
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    transform: translateY(-50%);
    overflow: hidden;
    width: auto;
}

.header-marketing .header-marketing-icons a {
    display: flex;
    background: var(--Heading_color);
    gap: 13px;
    text-transform: uppercase;
    font-size: var(--Brand_title_size_level_seven);
    font-weight: 400;
    width: auto;
    padding: 15px;
    color: var(--white-color);
    text-decoration: none;
    align-items: center;
    position: relative;
    right: -162px;
    transition: right 2s;
    font-size: 13px;
}

li.breadcrumb-item a {

    font-size: 14px;
    color: white;

}

.header-marketing .header-marketing-icons a:hover {
    right: 0;
}

.header-marketing .header-marketing-icons a i {
    font-size: 14px;
}

.header-marketing .header-marketing-desc {
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    text-align: center;
    color: var(--white-color);
    z-index: 1;
}

.header-marketing .header-marketing-desc.meilleur {
    width: 100%;
}

.header-marketing .header-marketing-desc h1 {
    font-size: 28px;
    font-weight: 700;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    letter-spacing: 0.15rem;
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
}

li.breadcrumb-item a:hover {
    color: #fff;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: #fff;
}

.header-marketing .header-marketing-desc p {
    font-size: 14px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
}

.header-marketing .header-marketing-desc.meilleur p {
    width: 53%;
    margin: 0 auto;
}

a.decouvre {
    font-size: 16px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-decoration: none;
    color: white;
    background: black;
    padding: 20px;
    width: 240px;
    height: 60px;
    clear: both;
    display: table;
    margin: 30px auto 0;
    text-transform: uppercase;
    transition: opacity 2s;
}

a.decouvre:hover {
    opacity: .5;
}


/* end marketing */


/* start section nouveaute */

section.collection.mah-nouveaute {
    position: relative;
    padding-left: 35px;
    padding-right: 35px;
}

section.collection.mah-nouveaute .content-img {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .content-img-collection {
    padding-right: 160px;
    width: 100%;
}


.content-img-collection {
    margin-left: 70px;
}


section.actualité-blogs {
    margin-top: 50px;
}


section.collection.mah-nouveaute .content-img.shine-two {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .content-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.collection.mah-nouveaute .contents-img {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.collection.mah-nouveaute div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    right: 50%;
    transform: inherit;
    bottom: 0;
    max-width: 462px;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    display: none;
}

section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 0;
    gap: 30px;
    left: 0;
}


/* end section nouveaute */


/* start section hamam */

.cont-description {
    width: 85%;
    margin-top: 42px;
}

.cont-description-section-la-marque {
    width: 85%;
    margin-top: 42px;
    margin-left: 30px;
}

section.hamam .cont-description {
    margin-top: 50px;
}

section.hamam {
    padding: 0 35px 0;
    position: relative;
    margin: 50px 0 50px;
}

section.hamam .hamam-img {
    background: url(../images/mahassen-centre1.jpg) left no-repeat;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 43%;
}

section.hamam .hamam-img .content-img {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}


section.hamam .hamam-img .content-img-hammem {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}



section.hamam .hamam-img .content-img-hammem img {
    width: 100%;
    height: 100%;
}

section.hamam .hamam-img .content-img img {
    width: 100%;
    height: 100%;
}


section.hamam .hamam-img .contents-img {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}

section.hamam .hamam-img .contents-img img {
    width: 100%;
    height: 100%;
}

/* end section hamam */


/* start section massage */

section.massage {
    padding: 50px 35px;
    position: relative;
}

section.massage .hamam-img {
    position: relative;
}

section.massage:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.massage.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.massage.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.content-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    line-height: 31px;
    font-size: 18px !important;
    text-align: justify;
}

section.massage .content-img {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    /* padding-right: 50px; */
}

/* a.close-carte {
    color: #000000 !important;
    vertical-align: middle;
    height: 52px;
    display: table-cell;
} */

section.massage .content-img-la-marque {
    text-align: center;
    width: 50%;
    margin: 0 auto;
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    /* padding-right: 50px; */
}

.button-space {
    margin-right: 10px;
}

section.massage .content-img img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .content-img-la-marque img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .contents-img {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    padding-right: 50px;
}

section.massage .contents-img-la-marque {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    padding-right: 50px;
}

section.massage .contents-img img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .contents-img-la-marque img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}



/* end section massage */


/* start section la Marque */

section.lamarque {
    position: relative;
    padding-right: 46px;
    padding-left: 32px;
    padding-top: 70px;
    padding-bottom: 70px;
}

.live-slider.slick-initialized.slick-slider .item {
    /* height: 594px; */
}

.live-slider.slick-initialized.slick-slider img {
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}


section.lamarque:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 50%;
    bottom: 0;
    z-index: -1;
}

section.lamarque .slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    left: inherit;
    right: 60px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    bottom: -80px;
}

section.lamarque .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    background: url(../images/btnleft.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}

section.lamarque .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    left: inherit;
    right: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    bottom: -80px;
}

section.lamarque .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/* end section la Marque */


/* start page esthetique-home */

section.esthetique-home {
    padding: 50px 35px;
    background: #f5f5f5;
    margin-top: 50px;
    padding-bottom: 80px;
}

section.esthetique-home .content-slider-home {
    padding-left: 50px;
    position: relative;
}

section.esthetique-home span.count-slide-position {
    /* position: absolute; */
    /* bottom: -78px; */
    /* left: 145px; */
    font-size: 32px;
    font-family: var(--Brand_title_fonts);
}

section.esthetique-home .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    -webkit-transform: inherit !important;
    -ms-transform: inherit !important;
    transform: inherit !important;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: 0;
    background: 0 0;
    left: 185px;
    bottom: 0px !important;
}

section.esthetique-home .slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    -webkit-transform: inherit !important;
    -ms-transform: inherit !important;
    transform: inherit !important;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: 0;
    background: 0 0;
    right: inherit;
    bottom: 0px !important;
    left: 0;
}

section.esthetique-home .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
}

section.esthetique-home .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: -0;
    left: 0;
    font-weight: 300;
}

section.esthetique-home .content-img {
    height: 967px;
}

section.esthetique-home .content-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.esthetique-home .contents-img {
    height: 967px;
}

section.esthetique-home .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.esthetique-home h2 {
    font-size: 41px;
    text-align: center;
    margin-bottom: 50px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
}

section.esthetique-home h3 {
    font-size: 31px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
}

section.esthetique-home p {
    font-weight: 400;
    font-size: 16px;
    font-family: var(--Brand_title_fonts);
    margin-bottom: 50px;
}

section.esthetique-home .homme-slider.slick-initialized.slick-slider .item {
    height: 465px;
}

section.esthetique-home .content-img-abs {
    position: relative;
    width: 100%;
    height: 100%;
}

section.esthetique-home .content-img-abs img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 415px;
    height: 375px;
    object-fit: cover;
}

section.esthetique-home .contents-img-abs {
    position: relative;
    width: 100%;
    height: 100%;
}

section.esthetique-home .contents-img-abs img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 415px;
    height: 375px;
    object-fit: cover;
}


/* end page esthetique-home */


/* ===============================================
            end page centre mahassen
=============================================== */


/* ===============================================
            start page maquillage
=============================================== */


/* start section collection.mah-nouveaute.maquillage */

section.collection.mah-nouveaute.maquillage {
    background: white;
    padding: 50px 37px 65px;
}

section.collection.mah-nouveaute.maquillage .desc_collection {
    padding: 55px 0 0;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    left: 37px;
    right: inherit;
    transform: inherit;
    bottom: 0;
    max-width: 472px;
    z-index: 1;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    left: 37px;
    right: inherit;
    transform: inherit;
    bottom: -189px;
    max-width: 472px;
    z-index: 1;
}

section.collection.mah-nouveaute.maquillage .content-img {
    padding-right: 0;
    height: 700px;
    max-width: 722px;
    margin-left: auto;
}

section.collection.mah-nouveaute.maquillage .content-img-collection {
    padding-right: 0;
    max-width: 722px;
    margin-left: auto;
}


section.collection.mah-nouveaute.maquillage .contents-img {
    padding-right: 0;
    height: 700px;
    max-width: 722px;
    margin-left: auto;
}

section.collection.mah-nouveaute.maquillage .desc_collection {
    padding: 55px 0 0 20px;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 170px;
    gap: 30px;
    right: -141%;
    left: inherit;
}


/* end section collection.mah-nouveaute.maquillage */


/* start collection.mahassen */

section.collection.mahassen {
    padding: 50px 37px 50px;
    margin-top: 120px;
    background: #f5f5f5;
}

section.collection.mahassen h2 {
    font-size: var(--Brand_title_size_level_forth);
    font-weight: 700;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 50px;
}

section.collection.mahassen .slick-slider {
    margin: 0 -22px;
}

section.collection.mahassen .item {
    padding: 0 22px;
}

section.collection.mahassen .item .product-item {
    height: 454px;
    margin-bottom: 25px;
}

section.collection.mahassen .item img {
    height: 100%;
    background-size: cover;
}

section.collection.mahassen .item a {
    text-decoration: none;
}

section.collection.mahassen .item h4 {
    text-align: center;
    text-decoration: none;
    color: black;
    font-size: 28px;
    margin: 15px 0 15px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
}

section.collection.mahassen .slick-dots {
    bottom: -39px;
}

section.collection.mahassen .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 10px;
    height: 10px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: 0;
    background: black !important;
    color: black !important;
    border-radius: 50%;
    margin: 0 auto;
}

section.collection.mahassen .slick-dots li.slick-active button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 25px;
    height: 25px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: 0;
    background: transparent !important;
    color: transparent !important;
    border-radius: 50%;
    margin: 0 auto;
    border: 2px solid #989898;
}


/* end collection.mahassen */


/* start section product cosmetique maquillage */

section.product-cosmetique.maquillage {
    padding: 50px 0 40px;
    background: white;
}

section.product-cosmetique.maquillage.maquillage2 {
    padding: 20px 0 20px;
    background: white;
}

section.product-cosmetique.maquillage h2 {
    font-size: var(--Brand_title_size_level_forth);
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 50px;
}


/* end section product cosmetique maquillage */


/* start section idees */

section.idees {
    padding: 50px 37px 50px;
    background: #f5f5f5;
}

section.idees .slick-slider {
    margin: 0 -24px;
}

section.idees .item-desc {
    text-align: center;
}

section.idees h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 70px;
}

section.idees .item {
    padding: 0px 37px;
    display: inline-block;
}

button.btn-ajouter.ajouter.shine {
    height: 42px;
    width: 100%;
    outline: none;
    background: #1e1e1e !important;
    color: white;
    margin-bottom: 30px;
    text-transform: uppercase;
    outline: none;
    border: none;
}

/* section.idees .product-item {
    height: 685px !important;
} */

section.idees .item .product-item:nth-child(odd) {
    margin-bottom: 45px;
}


section.idees .item .product-item:nth-child(even) {
    margin-top: 45px;
}

section.idees .item .product-item img {
    /* height: 100%; */
    background-size: cover;
}

section.idees .item a {
    text-decoration: none;
}

section.idees .item .item-desc h4 {
    color: #000 !important;
    font-family: var(--Brand_title_fonts);
    font-size: 22px;
}

section.idees .item .item-desc p {
    color: #000 !important;
    font-weight: 300;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
    text-transform: capitalize;
    padding: 0 15px;
    margin: 0;
}


/* end section idees */


/* ===============================================
            end page maquillage
=============================================== */


/* ================== start section inscrivez-vous */

section.inscrivez-vous {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #4c4c4ce3;
    z-index: 55;
    display: none;
}

section.inscrivez-vous .container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

section.inscrivez-vous .inscrivez-vous-description {
    padding: 45px 50px 45px 65px;
}

section.inscrivez-vous .inscrivez-vous-description h2 {
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.02rem;
}

section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
    font-size: 15px;
    font-weight: 400;
    margin: 0 0 15px;
    font-family: var(--Brand_title_fonts);
    line-height: 30px;
    letter-spacing: 0.1rem;
    color: #adaaaa;
}

section.inscrivez-vous .inscrivez-vous-description p:last-of-type {
    font-size: 13px;
    font-weight: 400;
    margin: 0 0 15px;
    font-family: var(--Brand_title_fonts);
    line-height: 23px;
    color: #000;
    text-transform: uppercase;
}

section.inscrivez-vous .content_networks-pop-up {
    display: flex;
    gap: 15px;
}

section.inscrivez-vous .content_networks-pop-up a {
    color: black;
    transition: all 2s;
}

section.inscrivez-vous .content_networks-pop-up a:hover {
    opacity: .5;
}

section.inscrivez-vous .inscrivez-vous-description .email {
    display: grid;
    grid-template-columns: auto 130px;
    gap: 10px;
    width: 73%;
    margin-bottom: 25px;
}

section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
    height: 40px;
    border: 1px solid #000;
    padding: 9px;
    outline: none;
    color: #7f7f7f;
}

section.inscrivez-vous .inscrivez-vous-description .email input[type="email"]::placeholder {
    font-size: 13px;
}

section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 13px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
}

section.inscrivez-vous .inscrivez-vous-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content-inscrivez-vous {
    display: grid;
    grid-template-columns: 70% 30%;
    background: white;
    position: relative;
    gap: 1px;
    max-width: 930px;
}

.content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
    position: absolute;
    top: -19px;
    right: -16px;
    padding: 10px;
    background: black;
    color: white;
    transition: opacity 2s;
    cursor: pointer;
    z-index: 1;
}

.content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark:hover {
    opacity: .5;
}


/* ================== end section inscrivez-vous */


/* ============================================
                 start page fond de teint
============================================ */


/* start navigayions links */

.navigation-links {
    text-align: center;
    padding: 0 50px;
}

.navigation-links .container-fluid {
    padding: 166px 0;
    height: 100%;
    background: #00000020;
}

.header-marketing .header-marketing-desc h2 {
    font-family: var(--Brand_title_fonts);
    letter-spacing: 0.15rem;
    font-weight: 700;
}

.navigation-links h1 {
    font-size: 32px;
    font-weight: 700;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    letter-spacing: 0.15rem;
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    color: #fff;
}

.navigation-links .breadcrumb {
    justify-content: center;
    margin: 0;
}

.navigation-links nav {
    border: none;
    color: #505050;
}

.navigation-links li.breadcrumb-item,
.navigation-links li.breadcrumb-item a {
    font-family: var(--Brand_title_fonts);
    height: 100%;
    font-weight: 300;
    text-decoration: none;
    white-space: nowrap;
    color: #505050;
    font-size: 15px;
    font-weight: 500;
}

.navigation-links li.breadcrumb-item {
    font-size: 14px;
}

.navigation-links li.breadcrumb-item a {
    font-size: 14px;
}

.navigation-links li.breadcrumb-item a {
    text-decoration: underline;
    text-transform: none
}


/* end navigayions links */


/* start section fond-de-tient-details */

section.fond-de-tient-details {
    padding: 50px 33px 50px;
}

section.fond-de-tient-details .content-img {
    display: flex;
    gap: 20px;
    width: 100%;
}

section.fond-de-tient-details .contents-img {
    display: flex;
    gap: 20px;
    width: 100%;
    justify-content: center;
}

.same-height {
    display: flex;
    align-items: stretch;
}

.same-height-img {
    height: 100%;
    object-fit: cover;
    width: auto;
}

.img-fluid-categorie {
    max-width: 100%;

}

section.fond-de-tient-details .content-img .content-one {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* width: -webkit-fill-available; */
}

section.fond-de-tient-details .contents-img .content-one {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* width: -webkit-fill-available; */
}


section.fond-de-tient-details .content-img .content-one .content-one-img {
    position: relative;
    height: 400px;
}

section.fond-de-tient-details .contents-img .content-one .content-one-img {
    position: relative;
    height: 400px;
}

section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: inherit;
    left: inherit;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}


section.fond-de-tient-details .contents-img .content-one .content-one-img .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: inherit;
    left: inherit;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}

section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.fond-de-tient-details .contents-img .content-one .content-one-img .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.fond-de-tient-details .content-img .content-one .content-one-img:hover .fa-regular.fa-heart {
    display: block;
}

section.fond-de-tient-details .contents-img .content-one .content-one-img:hover .fa-regular.fa-heart {
    display: block;
}

section.fond-de-tient-details .content-img .content-one-img a.fancybox img {
    width: 100%;
    object-fit: cover;
    height: 100%;
}


section.fond-de-tient-details .contents-img .content-one-img a.fancybox img {
    width: 100%;
    object-fit: cover;
    height: 100%;
}


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





.select_wrap select {
    border: none;
    border-radius: 0;
    padding: 8px 15px;
    margin-right: 10px;
    background: #f7f7f7;
}

.select_wrap {
    margin: 20px 0;
}

.select_wrap select:focus-visible {
    outline: none;
}

.select_wrap ul {
    list-style: none;
    padding: 0;
}

.select_wrap .default_option {
    background: #fff;
    border-radius: 5px;
    position: relative;
    cursor: pointer;
    border: 1px solid #e4e3e3;
}

.select_wrap .default_option:before {
    content: "";
    position: absolute;
    top: 18px;
    right: 18px;
    width: 16px;
    height: 16px;
    border: 2px solid;
    border-color: transparent transparent #555555 #555555;
    transform: rotate(-45deg);
}

.select_wrap .select_ul {
    position: absolute;
    top: 56px;
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 5px;
    display: none;
    -webkit-box-shadow: 3px 3px 26px -6px rgb(165 160 160);
    -moz-box-shadow: 3px 3px 26px -6px rgba(165, 160, 160, 1);
    box-shadow: 3px 3px 26px -6px rgb(165 160 160);
}

.select_wrap .select_ul li {
    cursor: pointer;
}

.select_wrap .select_ul li:first-child:hover {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.select_wrap .select_ul li:last-child:hover {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.select_wrap .option {
    display: flex;
    align-items: center;
    height: 54px;
    box-sizing: border-box;
    padding: 0 15px 0 20px;
}

.select_wrap .option p {
    margin: 0;
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: #454545;
}

.select_wrap .option .icon {
    background: url('../images/teinte-plan.png') no-repeat 0 0;
    width: 32px;
    height: 32px;
    margin-right: 15px;
}

.select_wrap .option.teinte-num0 .icon {
    background-position: 0 -10px;
}

.select_wrap .option.teinte-num1 .icon {
    background-position: 0 -64px;
}

.select_wrap .option.teinte-num2 .icon {
    background-position: 0 -120px;
}

.select_wrap .option.teinte-num3 .icon {
    background-position: 0 -173px;
}

.select_wrap .option.teinte-num4 .icon {
    background-position: 0 -227px;
}

.select_wrap .option.teinte-num5 .icon {
    background-position: 0 -282px;
}

.select_wrap .option.teinte-num6 .icon {
    background-position: 0 -335px;
}

.select_wrap.active .select_ul {
    display: block;
    z-index: 1;
}

.select_wrap.active .default_option:before {
    top: 25px;
    transform: rotate(-225deg);
}


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

.fond-de-tient-description .avis {
    margin-top: 15px;
}


/* .fond-de-tient-description {
    padding-left: 65px;
} */

.fond-de-tient-description h2 {
    margin-bottom: 15px;
    text-transform: uppercase;
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
}



.fond-de-tient-description h3 {
    color: #f33f38;
    font-size: 20px;
    /* font-weight: 600; */
    margin-bottom: 7px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
}

.select_wrap label {
    font-size: 14px;
}

.fond-de-tient-description .content-img-fond-de-tient img {
    width: 300px;
}

.fond-de-tient-description .contents-img-fond-de-tient img {
    width: 300px;
}


.avis img {
    width: 17px;
}

.fond-de-tient-description p {
    font-size: 14.5px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 0;
    text-align: justify;
}

.fond-de-tient-description h5,
.fond-de-tient-description h5 span {
    color: #f33f38;
    font-size: 16px;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    margin-top: 9px;
}

.fond-de-tient-description span.all-avis {
    color: #737373;
    display: inline-block;
    margin: 0 20px 0 10px;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
}

.fond-de-tient-description span.rediger-avis {
    color: #737373;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
}

.fond-de-tient-description .content-img-fond-de-tient {
    margin-bottom: 30px;
}

.fond-de-tient-description .contents-img-fond-de-tient {
    margin-bottom: 30px;
}

.fond-de-tient-description button.btn-ajouter {
    height: 41px;
    width: 100%;
    outline: none;
    background: #1e1e1e;
    color: white;
    margin-bottom: 30px;
    text-transform: uppercase;
    outline: none;
    border: none;
    font-size: 14px;
}

.fond-de-tient-description button.btn-ajouter.ajouter {
    max-width: 100%;
}


/* start section slick */

.content-fond-de-tient {
    padding: 40px 50px 20px;
}

.content-fond-de-tient .item a .item-icons {
    position: absolute;
    bottom: 28px;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    display: none;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}

.content-fond-de-tient .item a:hover .item-icons {
    display: block;
}

.content-fond-de-tient .item a .item-icons {
    padding: 7px 2px;
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 13px;
    transition: all 2s;
    width: 143px;
}

.content-fond-de-tient h3 {
    text-align: center;
    font-size: 21px;
    margin-bottom: 21px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    color: #000;
}

.content-fond-de-tient .item-descc {
    padding-top: 12px;
}

.content-fond-de-tient .item-descc p {
    font-size: 15px;
    text-align: center;
}

.content-fond-de-tient h5 {
    font-size: 15px;
    margin-top: 5px;
}

.content-fond-de-tient .item-desc p {
    font-size: 15px;
    text-align: center;
}

.content-fond-de-tient .slick-initialized .slick-slide {
    display: block;
    margin: 0 15px;
}

.fond-de-tient-description .product-item {
    margin: 0 auto 0;
}

.fond-de-tient-description .product-item img {
    width: 100%;
    /* height: 307px; */
}

.fond-de-tient-description .item a {
    text-align: center;
    text-decoration: none;
}

.fond-de-tient button.slick-prev.slick-arrow,
.fond-de-tient button.slick-next.slick-arrow {
    display: none !important;
}


/* end section click */


/* end section fond-de-tient-details */


/* start page coupe */

.fond-de-tient-description.coupe {
    height: 100%;
    padding-left: 20px;
    padding-top: 11px;
}

.fond-de-tient-description .grid-avis {
    display: flex;
    gap: 11px;
    margin-top: 22px;
    justify-content: space-evenly;
}

.fond-de-tient-description .grid-avis .btn-increment {
    display: flex;
    height: 41px;
    width: 100%;
    justify-content: space-between;
}

.fond-de-tient-description .grid-avis .btn-increment button.btn-increment-btn {
    width: 42px;
    outline: none;
    border: 1px solid #dad7d7;
    background: #f8f8f8;
    font-size: 23px;
    color: #6f6f6f;
}

.fond-de-tient-description .grid-avis .btn-increment input[type="text"] {
    border: 1px solid #dad7d7;
    border-left: none;
    border-right: none;
    text-align: center;
    width: 100%;
}

.fond-de-tient-description.coupe .grid-avis .btn-increment input[type="text"] {
    width: 100%;
}

.fond-de-tient-description .avis .grid-btn {
    display: grid;
    gap: 11px;
    grid-template-columns: repeat(2, 1fr);
    padding-bottom: 16px;
}

.fond-de-tient-description .avis .grid-btn button {
    outline: none;
    border: none;
    background: #000000;
    color: white;
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 23PX;
    transition: all 2s;
    width: 100%;
}

.fond-de-tient-description .avis .grid-btn button:hover {
    opacity: .5;
}

.fond-de-tient-description .avis .grid-btn button img {
    display: inline-block;
    margin-right: 7px;
    margin-top: -7px;
}

.fond-de-tient-description p.partager {
    color: #737373;
    font-family: var(--Brand_title_fonts);
}


/* end page coupe */


/* ============================================
                 end page fond de teint
============================================ */


/* ============================================
                 start page coiffure
============================================ */

section.nos-services-coiff {
    padding: 50px 35px;
}

section.nos-services-coiff .grid-nos-services-coiff {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff {
    position: relative;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff img {
    width: 100%;
    object-fit: cover;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff h4 {
    position: absolute;
    bottom: 0;
    text-align: center;
    left: 0;
    right: 0;
    font-size: 19px;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    text-transform: uppercase;
    background: #ffffffc7;
    margin: 0;
    padding: 16px 0;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff a.service-coiff-link {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
}

div#coiffureCarousel {
    height: 100%;
}

div#coiffureCarousel .carousel-inner {
    height: 100%;
}

div#coiffureCarousel .carousel-inner .carousel-item {
    height: 100%;
}

div#coiffureCarousel .carousel-inner img.d-block.w-100 {
    height: 100% !important;
    object-fit: cover;
}

section.bannierCoiff {
    padding: 50px 35px 0;
}

section.bannierCoiff div#coiffureCarousel2 {
    height: 280px;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner {
    height: 100%;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item {
    height: 100%;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item img.d-block.w-100 {
    height: 100%;
    object-fit: cover;
}

.content-img-service {
    max-width: 100%;
    height: auto;
}

.content-img-service img {
    /* width: 60px; */
    object-fit: cover;
    /* border-radius: 4px; */
    margin-right: 10px;
}

/* ============================================
                 end page coiffure
============================================ */


/* ============================================
                 responsive
============================================ */
section.collection .desc_collection a.decouvrir:hover,
section.autonome .content-autonome-desc a.decouvrir:hover,
section.maquillage .content-autonome-desc a.decouvrir:hover,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
section.avis-clients a.decouvrir:hover,
section.mahassen-lives .mahassen-live-desc a.decouvrir,
.cont-description a.decouvrir:hover {
    /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
    background-size: 145px !important;
    transition: 1s all ease-out;
}

@media screen and (min-width: 320px) {

    section.collection .desc_collection a.decouvrir:hover,
    section.autonome .content-autonome-desc a.decouvrir:hover,
    section.maquillage .content-autonome-desc a.decouvrir:hover,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
    section.avis-clients a.decouvrir:hover,
    section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
    .cont-description a.decouvrir:hover {
        /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
        background-size: 145px !important;
        transition: 1s all ease-out;
    }

    .content-img img {
        max-width: 100%;
    }

    .content-img-left img {
        max-width: 100%;
    }

    .header-marketing-brushing img {
        min-height: 250px;
    }

    section.content-tabs-brushing .tabsmahassen {
        font-size: 20px;
    }

    section.creation-coupe .creation-img img {
        width: 100%;
        height: auto;
        position: relative;
        bottom: -70px;
        right: 0;
    }

    /* page centreMahassen carroussel */
    .contentSlider {
        display: block;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {
        width: 100%;
        height: 100%;
    }

    .content-img-application-one {
        width: 100%;
        height: 100%;
    }

    .content-img-left {
        width: 100%;
        height: 100%;
    }

    .content-text2 {
        width: 100%;
    }

    section.mahassen-lives .mahassen-live-desc span.live img {
        width: 100%;
        object-fit: cover;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        left: 6%;
        font-size: 6rem;
        bottom: -105px;
        height: 324px;
        width: auto;
        z-index: -1;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: absolute;
        text-align: center;
        width: 100%;
        float: none;
    }

    .carousel-item.shine-two.active {
        min-height: 567px;
        padding: 0 10px;
    }

    .carousel-maquillage .carousel-item.shine {
        min-height: 432px;
        padding: 0 10px;
    }

    /* .carousel-maquillage{
        min-height: 582px;
        padding: 0 10px;
    } */

    /* .carousel-item.shine {
        height: 100%;
        min-height: 730px;
    } */

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 5%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        /* z-index: 999; */
        right: -50px;
    }

    .sliderTop .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        content: "";
        background: url(../images/btnleft.png)center no-repeat;
        height: 20px;
        width: 60px;
    }

    .sliderTop .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 58%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -50px;
    }

    .sliderTop .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png)center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }

    .carousel-innerMake .carousel-inner.item.shine {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: relative;
        text-align: center;
        width: 100%;
        float: left;
        z-index: 999;
        overflow: visible !important;
    }

    section.maquillage div#carouselExampleCaptions2 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 32%;
        display: block;
        width: auto;
        height: 10px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -6px;
    }

    .carousel-innerMake .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 52%;
        display: block;
        width: auto;
        height: auto;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: 0;
    }

    .carousel-innerMake .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 3px;
        left: 0;
        font-weight: 300;
        background: url(../images/btnleft.png)center no-repeat;
        height: 13px;
        width: 60px;
        content: "";
    }

    .carousel-innerMake .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png)center no-repeat;
        height: 33px;
        width: 60px;
        content: "";
    }

    .carousel-maquillage button.slick-prev.slick-arrow,
    .carousel-inner button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 98px;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }

    /* .carousel-maquillage  button.slick-next.slick-arrow, .carousel-inner   button.slick-next.slick-arrow{
        position: absolute;
        top: inherit;
        bottom: 0px;
        right: 35px;
        width: 50px;
        height: auto;
        left: inherit;
    } */

    .carousel-inner button.slick-next.slick-arrow {
        width: 60px;
        content: "";
        top: inherit;
        /* left: inherit; */
        position: absolute;
        bottom: auto;
        display: none;
        /* left: 300px; */
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -37px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -39px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }


    .carousel-inner button.slick-prev.slick-arrow {
        width: 60px;
        content: "";
        top: inherit;
        /* left: inherit; */
        position: absolute;
        bottom: auto;
        left: 295px;
    }
}


@media (max-width: 767px) {

    /* start header */
    .content_slider .carousel-item {
        height: 250px !important;
    }

    .content_slider .carousel-item img.d-block.w-100 {
        object-fit: cover;
    }

    /* end header */
    /* start header icon */
    .header_logo_icons .content_lang {
        margin-bottom: 5px;
        justify-content: space-between;
    }

    .header_logo_icons .header_icons {
        justify-content: center;
        margin-top: 33px;
    }

    /* end header icon */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc span.live {
        left: 2%;
        font-size: 12rem;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 227px;
        height: 227px;
        top: 142px;
        right: 50%;
        transform: translateX(50%);
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 50px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: 0;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 30px;
    }

    /* end section mahassen-lives */
    /* start section autonome */
    section.collection {
        padding-top: 40px;
    }

    section.autonome .content-autonome .picture {
        margin-top: 150px;
    }

    section.autonome .content-autonome {
        display: flex;
        /*grid-template-columns: auto;*/
        flex-direction: column;
    }

    section.autonome .content-autonome .picture {
        order: -1;
    }

    section.autonome .content-autonome .picture {
        margin-bottom: 15px;
        height: 565px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 0px;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 89px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        position: inherit;
        top: inherit;
        left: inherit;
        right: inherit;
        width: auto;
    }

    section.autonome .content-autonome-desc span {
        /*  color: var(--grayLighten_color);*/
        color: black;
    }

    section.autonome .content-autonome-desc p {
        padding-right: 0;
        margin-top: -85px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        position: absolute;
        top: inherit;
        right: 50%;
        transform: translateX(50%);
        flex-direction: row;
        gap: inherit;
        margin: 0;
        bottom: 0;
    }

    /* end section autonome */
    /* start section abonnez-vous */
    section.abonnez-vous {
        padding-top: 0px !important;
        padding-left: 50px;
        padding-right: 50px;
        padding-bottom: 10px;
    }

    section.abonnez-vous.marque,
    .marque-abonnez .abonnez-vous.instagram {
        padding: 10px 50px;
    }

    section.abonnez-vous .slick-slider {
        margin: 0;
    }

    /* end section abonnez-vous */
    /* start section newsletter */


    section.newsletter .email {
        max-width: 90%;
        grid-template-columns: auto 159px;
        gap: 5px;
    }

    /* end section newsletter */
    /* start section maquillage */
    section.maquillage {
        padding: 0px 0px 50px 0px;
        margin-top: 20px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 50px;
    }

    section.maquillage .content-carousel-maquillage {
        margin-top: 50px;
    }

    section.maquillage .video-container {
        height: 545px;
    }

    .maquillage .row .col-md-12.modify {
        padding-left: 0;
        padding-right: 0;
    }

    .maquillage .small-image {
        max-width: 100%;

    }

    .maquillage .small-image-right {
        max-width: 100%;

    }


    section.maquillage div#carouselExampleCaptions3,
    section.autonome div#carouselExampleCaptions2 {
        position: relative;
        top: 40px;
        width: 90%;
        top: inherit;
        left: inherit;
        margin: 0 auto;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -30px;
    }

    /* start section maquillage */
    /* start section nouveaute */
    section.nouveaute {
        padding: 0px
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        bottom: 250px;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
        font-size: 58px;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute {
        position: inherit;
        top: inherit;
        transform: inherit;
        left: inherit;
        margin-bottom: 50px;
        margin-top: 50px;
    }

    /* end section nouveaute */
    /* start section nouveaute */


    /* end section nouveaute */
    /* start section avis */
    section.avis-clients img {
        top: 184px;
    }

    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        padding: 115px 0;
    }

    section.avis-clients h2 {
        font-size: 58px;
        margin-bottom: 130px;
    }

    section.avis-clients .avis-slider .item .author-avis {
        margin-top: 80px;
    }

    section.avis-clients .avis-slider .item .author-avis:after {
        height: 32px;
    }

    section.avis-clients .slick-next:before {
        right: -22px;
        width: 35px;
    }

    section.avis-clients .slick-prev:before {
        left: -22px;
        width: 35px;
    }

    span.slick-prev-index {
        left: -23px;
    }

    span.slick-next-index {
        right: -23px;
    }

    /* end section avis */
    /* start page collection */
    section.collection .desc_collection {
        padding: 252px 0 0;
        gap: 50px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 100%;
        height: 750px;
        margin-left: 0;
        margin-right: 0;
        min-height: auto;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-inner {
        height: 100%;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: -338px;
        left: 33px;
        width: 353px;
        height: 425px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        justify-content: end;
        margin: 0;
    }

    section.collection .collection_hiver .content-img_collection img {
        width: 65%;
        height: auto;
        object-fit: cover;
    }

    /* end page collection */
    /* start section carte-mahassen */
    .slick-next {
        right: 0;
    }

    .slick-prev {
        left: 0;
    }

    section.carte-mahassen {
        padding: 50px 0 100px;
    }

    /* .fidelite-mahassen .carte-mahassen.centre-m {
        padding: 50px 0 !important;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        max-width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 30px auto 95px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 89px;
        margin-left: -10px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 30px;
    }

    /* end section carte-mahassen */
    /* start produit cosmetique */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    section.product-cosmetique .item .item-desc {
        padding: 26px 15px;
    }

    section.product-cosmetique button.slick-next.slick-arrow {
        right: 0;
    }

    section.product-cosmetique .slick-slider {
        margin: inherit;
    }

    section.product-cosmetique .item .product-item .item-icons i {
        padding: 10px;
    }

    /* section p {
        font-size: 18px !important;
    } */

    /* start produit cosmetique */
    /* start section abonnez vous */
    section.abonnez-vous {
        margin-top: 20px;
    }

    /* start section abonnez vous */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 20px;
    }

    /* end footer */
    /* ===========================================
            start page centre mahassen
    =========================================== */
    /* start section collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
        height: 500px;
        padding-bottom: 40px;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        right: inherit;
        transform: inherit;
        bottom: 0;
        max-width: 100%;
        width: 100%;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -37px;
        left: 0;
    }

    /* end section collection.mah-nouveaute */
    /* start section hamam */
    section.hamam {
        margin: 102px 0 0;
    }

    section.hamam .hamam-img {
        position: relative;
        top: inherit;
        right: inherit;
        bottom: inherit;
        left: inherit;
        height: 400px;
    }

    section.hamam .hamam-img .content-img {
        left: 0;
        bottom: 0;
    }

    /* start section hamam */
    /* start section esthetique-home */
    section.esthetique-home {
        padding: 75px 0 100px;
    }

    section.esthetique-home h2 {
        font-size: 60px;
        margin-bottom: 40px;
    }

    section.esthetique-home .content-slider-home {
        padding-left: 0;
    }

    section.esthetique-home .content-img {
        height: 550px;
        margin-bottom: 50px;
    }

    section.esthetique-home .content-img-abs img {
        bottom: -31px;
        right: 7px;
        width: 215px;
        height: 215px;
    }

    section.esthetique-home .slick-next {
        right: 0;
        left: inherit;
    }

    section.esthetique-home .slick-prev {
        right: 180px;
        left: inherit;
    }

    section.esthetique-home span.count-slide-position {
        left: inherit;
        right: 95px;
    }

    /* start section esthetique-home */
    /* start section massage */
    section.massage {
        padding: 103px 0;
    }

    section.massage .content-img {
        margin-bottom: 35px;
    }

    section.massage .content-img-la-marque {
        margin-bottom: 35px;
    }

    section.massage.coiffure::before,
    section.massage:after {
        height: 643px;
        top: 60px;
    }



    .cont-description {
        width: 100%;
        margin-top: 35px;
    }

    /* end section massage */
    /* start section collection */
    section.collection .desc_collection {
        padding: 201px 0 0;
    }

    /* end section collection */
    /* start  section esthetique-home */
    section.esthetique-home {
        margin-top: 0;
    }

    section.esthetique-home.mah-Centre {
        margin-top: 30px;
    }

    /* end  section esthetique-home */
    /* start section lamarque */
    .live-slider.slick-initialized.slick-slider .item {
        height: 494px;
    }

    section.lamarque:after {
        width: 50%;
        top: inherit;
        right: 50%;
        bottom: 10px;
        height: 620px;
    }

    /* end section lamarque */
    /* ===========================================
            end page centre mahassen
    =========================================== */
    /* ==============================================
                 start page maquillage
    ============================================== */
    /* start header-marketing */
    .header-marketing .header-marketing-desc.meilleur p {
        width: 90%;
    }

    /* end header-marketing */

    /* start fiche Brushing */
    .header-marketing-brushing img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .header-marketing-brushing {
        height: 533px;
        position: relative;
    }

    .header-marketing-brushing .header-marketing-desc h1 {
        font-size: var(--Brand_title_size_level_five);
        font-weight: 700;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        letter-spacing: 0.15rem;
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing-brushing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing-brushing {
        height: 100%;
        position: relative;
        min-height: 100%;
    }

    section.content-tabs-brushing {
        padding: 50px;
        height: 100%;
        max-width: 1330px;
        margin: 0 auto;
        padding-bottom: 0;
    }

    section.content-tabs-brushing p {

        font-size: 16px;
        line-height: 40px;
    }

    section.product-cosmetique.fiche h2 {
        padding-bottom: 60px;
    }

    section.product-cosmetique.fiche .item .product-item {
        height: 100%;
        position: relative;
    }

    /* start marketing */


    .header-marketing:after {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background: #00000020;
        z-index: 0;
    }



    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
        display: flex;
        flex-direction: column;
        transform: translateY(-50%);
        overflow: hidden;
        width: auto;
    }

    .header-marketing .header-marketing-icons a {
        display: flex;
        background: var(--Heading_color);
        text-transform: uppercase;
        font-size: var(--Brand_title_size_level_seven);
        font-weight: 400;
        width: auto;
        padding: 15px;
        color: var(--white-color);
        text-decoration: none;
        align-items: center;
        position: relative;
        right: -131px;
        transition: right 2s;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons a i {
        font-size: 18px;
    }

    .header-marketing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-desc.meilleur {
        width: 100%;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: var(--Brand_title_size_level_five);
        font-weight: 700;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        letter-spacing: 0.15rem;
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing .header-marketing-desc p {
        font-size: 24px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
    }

    a.decouvre {
        font-size: 16px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        text-decoration: none;
        color: white;
        background: black;
        padding: 20px;
        width: 240px;
        height: 60px;
        clear: both;
        display: table;
        margin: 30px auto 0;
        text-transform: uppercase;
        transition: opacity 2s;
    }

    a.decouvre:hover {
        opacity: .5;
    }


    /* end marketing */
    /* start section idees */
    section.idees .slick-slider {
        margin: inherit;
    }

    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* start section collection.mahassen */
    section.collection.mahassen {
        margin-top: 0;
    }

    section.collection.mahassen .item {
        padding: 0px 5px;
    }

    section.collection.mahassen .slick-slider {
        margin: inherit;
    }

    /* end section collection.mahassen */
    /* start section mahassen-lives */
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end section mahassen-lives */
    /* start collection.mah-nouveaute.maquillage */
    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 30px 0 0 0;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        max-width: 100%;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        transform: inherit;
        bottom: inherit;
        max-width: inherit;
        z-index: 1;
        margin-bottom: 73px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        right: 0;
        left: 0;
        bottom: -22px;
        position: absolute;
    }

    /* end collection.mah-nouveaute.maquillage */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez-vous */
    /* ==============================================
                 end page maquillage
    ============================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */
    .content-inscrivez-vous {
        grid-template-columns: auto;
        width: 80%;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        order: 1;
        padding: 20px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        grid-template-columns: auto;
        width: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
        height: 40px;
    }

    .inscrivez-vous-img {
        order: 0;
        height: 241px;
        padding-top: 0;
    }

    section.inscrivez-vous .inscrivez-vous-img img {
        object-fit: cover;
    }


    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        width: 100%;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links {
        padding: 0 10px;
    }

    section.fond-de-tient-details {
        padding: 50px 0 0;
    }

    section.fond-de-tient-details {
        padding: 50px 0;
    }

    section.fond-de-tient-details .content-img {
        margin-bottom: 45px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px 18px;
        -webkit-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
        -moz-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
        box-shadow: 3px 8px 26px -21px rgb(165 160 160);
    }

    /* end page fond de tient */
    /* start page coupe */
    .fond-de-tient-description .grid-avis {
        flex-direction: column;
    }

    .fond-de-tient-description .avis .grid-btn {
        grid-template-columns: repeat(1, 1fr);
    }

    section.fond-de-tient-details .content-img .content-one {
        gap: 15px;
    }

    /* coupe page coupe */
    /* start page coiffure */
    div#coiffureCarousel {
        padding-bottom: 40px;
    }

    section.bannierCoiff {
        padding: 40px 35px;
    }

    section.nos-services-coiff {
        padding: 50px 35px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        grid-template-columns: repeat(2, 1fr);
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 15px;
    }

    /* end page coiffure */

    /*Start page home*/

    section.icons {
        padding: 20px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 50px;
        padding-left: 65px;
        padding-top: 1px;
    }


    section.autonome .content-autonome-desc p {
        padding-top: 20px;
    }

    .video-wrapper {
        display: flex;
    }

    .maquillage .content-video .small-image {
        margin-top: 0px;
    }

    .maquillage .content-video .small-image-right {
        margin-top: 0px;
    }



    .maquillage .content-video {
        display: flex;
        justify-content: center;
    }

    .maquillage .content-video .small-image {
        width: 100%;
        object-fit: cover;
    }

    .maquillage .content-video .small-image-right {
        width: 100%;
        object-fit: cover;
    }

    .nouveaute .container-fluid .row .order-2 {
        order: -1 !important;
    }

    .nouveaute .container-fluid {
        flex-direction: column;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(50% - 20px) !important;
        transform: translateX(100%);
    }

    /* .avis-clients {
        margin-top: 30px;
    } */

    .carte-mahassen.centre-m .content-carte-mahassen .content-carte-one div span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 14px !important;
        text-align: justify;
        line-height: 29px;
    }



    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 14px ;
    }

    section.autonome .content-autonome-desc p {
        text-align: justify;
    }

    /*end page home*/
}

@media (max-width: 480px) {

    /* start header */
    .header_logo_icons {
        padding: 30px 0 19px;
    }

    .header_logo_icons img {
        width: auto;
    }

    .header_logo_icons .content_lang {
        /* display: inherit; */
        text-align: center;
    }

    .header_logo_icons .lang-menu .selected-lang {
        margin-bottom: 20px;
    }

    .header_logo_icons .lang-menu ul.languages_uses {
        right: inherit;
    }

    /* end header */
    /* start section carte-mahassen */
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 30px auto 56px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        grid-template-columns: auto 50px;
        padding-left: 65px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one button {
        font-size: 13px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 37px;
        margin: 0;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: auto;
        height: 100%;
        text-align: left;
        padding-bottom: 108px;
        margin-left: 0;
        font-size: var(--Brand_para_size);
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-top: 35px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0;
    }

    section.carte-mahassen .content-carte-mahassen span.profiter {
        font-size: 14px;
    }

    /* end section carte-mahassen */
    /* start section collection */
    section.collection .desc_collection {
        padding: 50px 0 0;
    }

    section.collection .desc_collection .spa {
        height: 100px;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 170px;
        left: 0px;
        width: 91%;
        height: 270px;
        position: relative;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: 345px !important;
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: 0;
    }

    section.collection .desc_collection a.decouvrir,
    section.autonome .content-autonome-desc a.decouvrir,
    section.maquillage .content-autonome-desc a.decouvrir,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
    section.avis-clients a.decouvrir,
    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        font-size: 15px;
    }

    section.collection .collection_hiver .carousel-indicators {
        gap: 8px;
    }

    .carousel-caption {
        right: 15px;
        bottom: 60px;
        left: 15px;
    }

    /* end section collection */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc span.live {
        left: 6%;
        font-size: 6rem;
        bottom: -105px;
    }

    section.mahassen-lives {
        padding: 60px 0;
    }

    /* end section mahassen-lives */
    /* start section maquillage */
    section.maquillage .content-autonome-desc h2 {
        font-size: 27px !important;
    }

    section.maquillage .video-container {
        height: 445px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner img {
        height: 450px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        bottom: 63px;
    }

    section.maquillage .direction-sm {
        flex-direction: column;
    }

    /* end section maquillage */
    /* start section avis */
    section.newsletter .email {
        grid-template-columns: auto;
    }

    section.newsletter .email .inscrire {
        padding: 10px;
    }



    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        padding: 97px 0 65px;
        width: 100%;
    }

    section.avis-clients img {
        top: 133px;
    }

    section.avis-clients .slick-next:before {
        right: -26px;
    }

    section.avis-clients .slick-prev:before {
        left: -26px;
    }

    /* end section avis */
    /* start section autonome */
    section.autonome .content-autonome .picture {
        height: 365px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        bottom: 133px;
        width: 100%;
        transform: inherit;
        left: 0;
        right: 0;
    }

    section.maquillage div#carouselExampleCaptions3 {
        height: 650px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 450px;
    }

    .carousel-innerMake .slick-prev {
        top: 10%;
    }

    .carousel-innerMake .slick-next {
        right: 5px;
        top: 35%;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 35px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        bottom: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        height: 300px !important;
        object-fit: cover;
    }

    /* end section autonome */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end footer */
    /* ===========================================
            start page centre mahassen
    =========================================== */
    /* start section header-marketing */
    .header-marketing .header-marketing-desc h1 {
        font-size: 27px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: var(--Brand_para_size);
    }

    /* start section header-marketing */
    /* start section hamam */
    section.hamam {
        padding: 50px 0;
        margin: 0;
    }

    section.hamam .hamam-img .content-img {
        width: 100%;
        height: 100%;
    }

    /* end section hamam */
    /* start section massage */
    section.massage {
        padding: 0 0 50px;
    }

    section.massage .content-img {
        width: 100%;
        height: 355px;
    }

    section.massage.coiffure.marque .content-img-la-marque {
        width: 100%;
        height: auto !important;
    }

    section.massage .content-img-la-marque {
        width: 100%;
        /* height: 355px; */
    }

    section.massage.coiffure::before,
    section.massage:after {
        height: 441px;
        top: 60px;
    }

    .content-box-actualité {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 16px;
        line-height: 25px;
        text-align: justify;
    }

    /* end section massage */
    /* start section lamarque */
    section.lamarque {
        padding: 0 35px 50px;
    }

    /* end section lamarque */
    /* ===========================================
            end page centre mahassen
    =========================================== */
    /* ===========================================
            start page Maquillage
    =========================================== */
    /* start header */
    div.nos_offres a {
        display: block;
        margin-left: 0;
    }

    .header_logo_icons .content_lang {
        margin-top: 0;
    }

    .content_lang.p-maquillage {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .header_logo_icons .monnais {
        float: right;
        margin-right: 20px;
    }

    .header_logo_icons .lang-menu .mon_uses {
        right: 20px;
    }

    .content_lang.p-maquillage .mahassen-live {
        grid-column: 1 / 3;
    }

    .header_logo_icons .monnais span {
        width: auto;
    }

    .header_logo_icons .lang-menu,
    .header_logo_icons .monnais {
        position: relative;
        display: table;
        text-align: left;
    }

    a.decouvre {
        width: auto;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 22px;
    }

    /* end header */
    /* start marketing */
    .header-marketing .header-marketing-desc h1 {
        font-size: 17px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 15px;
    }

    /* end marketing */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0;
    }

    /* end section abonnez-vous */
    /* start section abonnez-vous */
    section.abonnez-vous h5 {
        font-size: 15px;
    }

    /* end section abonnez-vous */
    /* start section collection.mah-nouveaute.maquillage */
    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        margin-bottom: 65px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -50px;
    }

    /* end section collection.mah-nouveaute.maquillage */
    /* ===========================================
           end page Maquillage
    =========================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */


    section.inscrivez-vous p {
        font-size: 12px !important;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 15px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        margin: 0 0 25px;
    }

    .inscrivez-vous-img {
        padding-top: 0;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
        top: -7px;
        right: -7px;
        padding: 5px;
        opacity: 1;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        font-size: 11px;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links h1 {
        font-size: 24px;
    }

    section.fond-de-tient-details .content-img {
        flex-direction: column;
    }

    .fond-de-tient-description .content-img-fond-de-tient img {
        width: 100%;
    }

    .content-fond-de-tient h3 {
        font-size: 20px;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img {
        height: 300px;
    }

    /* end page fond de tient */
    /* start page coupe */
    .fond-de-tient-description.coupe {
        display: inherit;
    }

    .fond-de-tient-description .avis .grid-btn button {
        font-size: 15px;
    }

    /* end page coupe */
    /* start page coiffure */
    section.nos-services-coiff .grid-nos-services-coiff {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end page coiffure */
}

@media (min-width: 768px) and (max-width: 991px) {
    .carousel-maquillage.slick-initialized.slick-slider {
        position: relative;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 130px;
        right: 0;
        transform: inherit;
        bottom: 0;
        max-width: 462px;
    }

    section.collection.mah-nouveaute .carousel-item.shine {
        min-height: 510px;
        width: 100% !important;
        /* background: white; */
        padding: 10px;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 42%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -50px;
    }

    .sliderTop .slick-slide img {
        display: block;
        min-height: 520px;
        object-fit: cover;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0;
    }

    .massage.coiffure.mah-Centre .carousel.slide .slick-prev:before {
        left: 20px;
    }

    .massage.coiffure.mah-Centre .carousel.slide .slick-next:before {
        right: 35px !important;
    }

    .massage.coiffure.mah-Centre button.slick-prev.slick-arrow {
        bottom: -10px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -230px !important;
    }

    /* about slider Homme esthetique  */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {
        width: 100%;
    }

    .content-text2 {
        width: 100%;
    }

    .carousel-item.shine {
        min-height: 0px;
    }

    /* start nav  */
    /* nav:not(.nav-breadcrumb) {
        display: none;
    } */
    /* end nav */
    /* start slider */
    .content_slider .carousel-caption h1 {
        font-size: 50px;
    }

    /* end slider */
    /* start header_logo_icons */
    .header_logo_icons .content_lang {
        justify-content: space-between;
        margin-bottom: 15px;
    }

    .header_logo_icons .header_icons {
        margin-top: 24px;
        justify-content: center;
    }

    /* end header_logo_icons */
    /* start section collection */
    section.collection {
        padding: 70px 0 0px;
    }

    section.collection .desc_collection {
        padding: 20px 0 0;
        gap: 20px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: -80px;
        justify-content: end;
        margin: 0;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        margin-left: 13px;
        margin-right: 0;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 0;
        right: inherit;
        left: 20px;
        width: 195px;
        height: 195px;
    }

    section.autonome .content-autonome-desc h2 {
        position: inherit;
    }

    section.autonome .content-autonome-desc span {
        color: #dadada;
    }

    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }

    /* end section collection */
    /* start section autonome */
    section.autonome .content-autonome {
        grid-template-columns: auto;
        gap: 0;
        margin-bottom: 40px;
        display: flex;
    }

    /* end section autonome */
    /* start section maquillage */
    section.maquillage div#carouselExampleCaptions3 {
        position: inherit;
        top: inherit;
        width: 90%;
        left: inherit;
        margin: 0 auto;
        height: 465px;
    }

    section.maquillage .video-container {
        margin-bottom: 40px;
        height: 745px;
    }

    /* end section maquillage */
    /* start carte-mahassen */
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        margin-left: 7.5rem;
        font-size: 110px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }


    .fidelite-one-acceuil {
        height: 1375px !important;
    }

    .fidelite-two-acceuil {
        margin-top: -285px !important;
    }

    /* start carte-mahassen */
    /* start section avis */
    section.avis-clients h2 {
        font-size: var(--Brand_title_size_level_three);
    }

    span.slick-prev-index {
        left: -36px;
    }

    span.slick-next-index {
        right: -36px;
    }

    /* end section avis */
    /* start section newsletter */


    section.newsletter .email {
        max-width: 80%;
    }

    /* end section newsletter */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 50px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: inherit;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 40px;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 291px;
        height: 593px;
        top: 0;
        right: 0;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        left: 2%;
        font-size: 17rem;
    }

    section.avis-clients .slick-next:before {
        right: -11px;
        width: 48px;
    }

    section.avis-clients .slick-prev:before {
        left: -11px;
        width: 48px;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }

    /* end section mahassen-lives */
    /* start section abonnez vous */

    /* end section abonnez vous */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(2, 1fr);
    }

    /* end footer */
    /* ==============================================
                 start page centre mahassen
    ============================================== */
    /* start collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        right: inherit;
        transform: inherit;
        bottom: 0;
        margin: 50px auto;
        max-width: 90%;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -34px;
        gap: 30px;
        left: 0;
        align-items: center;
        margin: 0;
    }

    /* end collection.mah-nouveaute */
    /* start esthetique-home */
    section.esthetique-home h2 {
        font-size: 100px;
    }

    section.esthetique-home .content-slider-home {
        padding-left: 0;
    }

    section.esthetique-home .content-img-abs img {
        bottom: 36px;
        width: 215px;
        height: 275px;
    }

    /* end esthetique-home */
    /* start massage */
    section.massage .content-img {
        width: 100%;
        height: 555px;
    }

    /* end massage */
    /* start section hamam */
    section.hamam .hamam-img .content-img {
        width: 50%;
        height: 50%;
        left: auto;
        bottom: -15%;
    }

    /* start section hamam */
    /* ==============================================
                 end page centre mahassen
    ============================================== */
    /* ==============================================
                 start page maquillage
    ============================================== */
    /* start section header */
    /* start section collection.mah-nouveaute.maquillage */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    section.collection.mah-nouveaute.maquillage {
        padding: 20px 37px 0px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        transform: inherit;
        bottom: inherit;
        max-width: 100%;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0 0;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        right: 0;
        left: 0;
        bottom: -22px;
        position: absolute;
    }

    section.collection.mahassen .item {
        padding: 0 5px;
    }

    section.collection.mahassen {
        padding: 85px 37px 105px;
        margin-top: 20px;
        background: #f5f5f5;
    }

    /* end section collection.mah-nouveaute.maquillage */
    /* start section mahassen-lives */
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end section mahassen-lives */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez-vous */
    /* start section idees */
    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* ==============================================
                 end page maquillage
    ============================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */
    .content-inscrivez-vous {
        grid-template-columns: 60% 40%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        grid-template-columns: 65% 35%;
        width: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        font-size: 11px;
    }

    section.fond-de-tient-details .contents-img .content-one {
        display: flex;
        gap: 20px;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links {
        padding: 0 10px;
    }

    section.fond-de-tient-details {
        padding: 50px 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px 10px;
        -webkit-box-shadow: -3px -1px 22px -15px rgba(165, 160, 160, 1);
        -moz-box-shadow: -3px -1px 22px -15px rgba(165, 160, 160, 1);
        box-shadow: -3px -1px 22px -15px rgb(165 160 160);
    }

    section.fond-de-tient-details .content-img {
        margin-bottom: 40px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    /* end page fond de tient */
    /* start page coiffure */
    div#coiffureCarousel {
        padding-bottom: 40px;
    }

    section.nos-services-coiff {
        padding: 50px 35px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 15px;
    }

    section.bannierCoiff div#coiffureCarousel2 {
        padding-bottom: 40px;
    }



    /* end page coiffure */
}

@media (min-width: 992px) and (max-width: 1199px) {
    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 40%;
        right: 52%;
        transform: inherit;
        bottom: 0;
        max-width: 282px;
        /* background: white; */
    }

    /* ============================================
                    start page centre mahassen
    ============================================ */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {}

    .content-text2 {}

    .carousel-item.shine {
        min-height: auto;
        max-height: fit-content;
    }

    section.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: 40px;
        width: 480px;
        height: 725px;
        top: 60px;
        left: -59px;
        z-index: 0;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 45%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        z-index: 999;
        right: -50px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption p,
    section.maquillage .content-carousel-maquillage .carousel-caption p,
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
        font-size: 22px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption h4,
    section.maquillage .content-carousel-maquillage .carousel-caption h4,
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption h4 {
        font-size: 18px;
    }

    /* ============================================
                    start page home
    ============================================ */
    /* start navbar */
    /* nav:not(.nav-breadcrumb) {
        display: none;
    } */
    /* end navbar */
    /* start header */
    .header_logo_icons .content_lang {
        gap: 45px;
    }

    .sliderTop .slick-slide img {
        display: block;
        min-height: 520px;
        object-fit: cover;
    }

    /* end header */


    /* header-marketing */
    .header-marketing .header-marketing-desc h1 {
        padding: 0 20px;
        font-size: 32px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
        font-size: 19px;
    }

    /* header-marketing */
    /* start header logo icons */
    .header_logo_icons .mahassen-live span:first-of-type {
        font-size: 16px;
    }

    /* end header logo icons */
    /* start section collection */
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 100%;
        /* height: 790px; */
        margin-left: 20px;
    }

    /* end section collection */
    /* start section autonome */
    section.autonome div#carouselExampleCaptions2 {
        margin-top: 50px;
    }

    /* start section maquillage */
    section.maquillage .content-autonome-desc {
        margin-top: 170px;
    }

    /* end section maquillage */
    /* start carte-mahassen */
    section.carte-mahassen .content-carte-mahassen.carte-two {
        grid-template-columns: auto 59px;
        padding-left: 40px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 480px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        display: grid;
        grid-template-columns: 60px auto 42px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 116px;
        margin-left: -9px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 28px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        max-width: 100%;
    }

    /* start carte-mahassen */
    /* start mahassen-lives */
    section.mahassen-lives {
        padding: 30px 50px 0px 30px;
        /* top: 109px; */
    }

    section.mahassen-lives .mahassen-live-desc h2 {
        font-size: 35px;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 326px;
        height: 378px;
        top: 142px;
        right: -173px;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        bottom: 241px;
        left: 35%;
        font-size: 14rem;
        line-height: initial;
        bottom: -66px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: inherit;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 30px;
    }

    /* end mahassen-lives */
    /* start product-cosmetique */
    section.product-cosmetique .item .item-desc {
        padding: 26px 15px;
    }

    /* end product-cosmetique */
    /* start abonnez-vous */
    section.abonnez-vous {
        margin-top: 50px;
    }

    /* end abonnez-vous */
    /* start newsletter */
    section.newsletter .email {
        max-width: 90%;
    }

    /* end newsletter */
    /* START page CentreMahassen  */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {}

    .content-text2 {}

    /* end  page CentreMahassen  */

    /* start section collection */
    section.collection .collection_hiver .content-img_collection {
        width: 50%;
        height: auto;
        bottom: 0px;
    }

    section.collection .carousel-indicators {
        justify-content: end;
        margin-right: 0;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        margin-right: 0;
    }

    /* end section collection */
    /* start section avis */
    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        padding: 80px 0;
    }

    section.avis-clients img {
        top: 214px;
    }

    /* end section avis */
    /* start footer */


    /* end footer */
    section.collection .maps {
        right: 36px;
    }

    i.first-icon {
        right: 35px;
    }

    /* ============================================
                    end page home
    ============================================ */
    /* ============================================
                    start page centre mahassen
    ============================================ */
    /* start page hamam */
    section.hamam .hamam-img .content-img {
        width: 292px;
        height: 292px;
        bottom: -20%;
        right: 8%;
    }

    /* end page hamam */
    /* start page collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -60px;
        gap: 30px;
        left: inherit;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    /* end page collection.mah-nouveaute */
    /* start section esthetique-home */
    section.esthetique-home .content-img-abs img {
        width: 315px;
        height: 275px;
    }


    .description-detail-actualite {
        width: 100%;
        max-width: 100%;
        margin: 40px auto;
        text-align: justify;
        padding: 0 10%;
    }


    section.content-bloc1-collection {
        padding: 20px 0;
        position: relative;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }


    /* end section esthetique-home */
    /* ============================================
                    end page centre mahassen
    ============================================ */
    /* ============================================
                    start page maquillage
    ============================================ */
    /* start mahassen-lives*/
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end mahassen-lives*/
    /* start section abonnez vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez vous */
    /* start product-cosmetique */
    section.collection.mahassen .item {
        padding: 0 5px;
    }

    /* end product-cosmetique */
    /* start product-cosmetique */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    /* end product-cosmetique */
    /* start section idees */
    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* ============================================
                    end page maquillage
    ============================================ */
    /* start page fond de tient */
    section.fond-de-tient-details {
        padding: 50px 35px;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px;
        -webkit-box-shadow: -4px 0px 9px -7px rgba(165, 160, 160, 1);
        -moz-box-shadow: -4px 0px 9px -7px rgba(165, 160, 160, 1);
        box-shadow: -4px 0px 9px -7px rgb(165 160 160);
    }

    /* end page fond de tient */
    /* start section coupe */
    .fond-de-tient-description .grid-avis {
        flex-direction: column;
    }

    .fond-de-tient-description .avis .grid-btn {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end section coupe */
    /* start page coiffure */
    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 10px;
    }

    /* start page coiffure */
}


@media (min-width: 1200px) and (max-width: 1308px) {
    .footer-qrq {
        padding-left: 1px;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 60px 25px 35px;
        padding-left: 48px;
        justify-items: center;
        padding-right: 30px;
        padding-left: 90px;
        border-bottom: 2px solid #2e2e2e;
    }

}

@media (min-width: 1025px) and (max-width: 1676px) {

    /* ============================================
                    start page centre mahassen
    ============================================ */

    /* end section carte-mahassen */
    /* start footer */
    section.footer .footer-content {
        gap: 15px;
    }

    /* ============================================
                    end page home
    ============================================ */
    /* ============================================
                    start page centre mahassen
    ============================================ */
    /* start section header-marketing */
    .header-marketing .header-marketing-icons a {
        width: 176px;
    }

    /* end section header-marketing */
    /* start esthetique-home */
    section.esthetique-home .content-img-abs img {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 315px;
        height: 275px;
        object-fit: cover;
    }

    /* end esthetique-home */
    /* start collection.mah-nouveaute */
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -44px;
        left: 0;
        justify-content: center;
        margin: 0;
    }

    /* end collection.mah-nouveaute */


    @import url('https://fonts.googleapis.com/css2?family=Allura&family=Bebas+Neue&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital@0;1&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Sassy+Frass&display=swap');

    @font-face {
        font-family: "Century-Gothic-Std";
        src: url("../fonts/Century-Gothic-Std-Regular.woff") format("woff");
    }

    /* info global */


    body {
        min-height: 100vh;
    }


    /* start hover shine */

    .shine {
        position: relative;
        overflow: hidden;
    }


    /* end hover shine */




    /* start nos offres */

    div.nos_offres {
        background: var(--Heading_color);
        text-align: center;
    }

    div.nos_offres span,
    div.nos_offres a {
        color: var(--white-color);
        font-family: var(--Brand_title_fonts);
        font-weight: 300;
        font-size: 13px;
    }

    div.nos_offres a {
        text-decoration: underline;
        display: inline-block;
        margin-left: 28px;
    }

    div.nos_offres a i {
        color: var(--white-color);
    }


    /* end nos offres */


    /* start header logo and icons */



    .header_logo_icons .content_lang {
        display: flex;
        gap: 41px;
        margin-top: 10px;
    }

    .header_logo_icons .lang-menu,
    .header_logo_icons .monnais,
    .header_logo_icons .laguages {
        position: relative;
    }

    .header_logo_icons .lang-menu ul.languages_uses {
        padding: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 20px;
        display: none;
        right: inherit;
        z-index: 2;
        transition: .7s;
        list-style: none;
        margin-top: 5px;
    }

    .header_logo_icons .lang-menu .mon_uses,
    .header_logo_icons .lang-menu .laguages_uses {
        padding: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 20px;
        display: none;
        /* right: 11px; */
        z-index: 2;
        transition: .7s;
        list-style: none;
        margin-top: 5px;
    }

    .header_logo_icons .lang-menu ul.active,
    .header_logo_icons .lang-menu .mon_uses.active,
    .header_logo_icons .lang-menu .laguages_uses.active {
        display: block;
        background: white;
    }

    .header_logo_icons .lang-menu .selected-lang {
        position: relative;
        display: table;
        cursor: pointer;
    }

    .header_logo_icons .monnais span {
        display: inline-block;
        width: 45px;
    }

    /*.header_logo_icons .lang-menu .selected-lang:after,
    .header_logo_icons .monnais:after,
    .header_logo_icons .laguages:after {
        position: absolute;
        content: "\f107";
        font-family: "Font Awesome 5 Pro";
        top: 50%;
        transform: translateY(-50%);
        right: -23px;
    }

    .header_logo_icons .lang-menu .selected-lang.active:after,
    .header_logo_icons .monnais.active:after,
    .header_logo_icons .laguages.active:after {
        content: "\f106";
    }*/


    .header_logo_icons .mahassen-live span.live {
        top: -15px;
    }

    .header_logo_icons .mahassen-live span.live:after {
        position: absolute;
        content: "";
        top: -17px;
        right: -17px;
        width: 17px;
        height: 17px;
        background-image: url(../images/live.png);
    }

    .header_logo_icons .header_icons {
        display: flex;
        gap: 6px;
        margin-top: 7px;
        justify-content: end;
    }

    .fav_number {
        top: 61px;
        right: 61px;
    }


    /* end header logo and icons */


    /* start slider */

    .content_slider {
        position: relative;
        padding: 0 33px;
    }

    .content_slider .content_networks {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        top: 50%;
        left: 14px;
        gap: 25px;
        transform: translateY(-50%);
    }

    .content_slider .content_networks.maquillage {
        justify-content: end;
        align-items: center;
        position: absolute;
        top: 40%;
        bottom: inherit;
        transform: inherit;
        padding-bottom: 33px;
    }

    .content_slider .carousel-indicators {
        position: absolute;
        right: -29px !important;
        bottom: inherit;
        left: inherit;
        z-index: 2;
        display: flex;
        flex-direction: column !important;
        justify-content: center !important;
        padding: 0;
        margin-right: 0px !important;
        margin-bottom: inherit !important;
        margin-left: inherit !important;
        list-style: none;
        /* top: 50% !important; */
        /* transform: translateY(-50%) !important; */
    }

    .content_slider button.carousel-control-prev,
    .content_slider button.carousel-control-next {
        display: none;
    }

    /*.content_slider .carousel-indicators [data-bs-target] {
    box-sizing: content-box;
    flex: auto;
    width: 13px !important;
    height: 60px !important;
    padding: 10px;
    margin-right: 0px;
    margin-left: 0px;
    text-indent: -999px;
    cursor: pointer;
    border-radius: 50% !important;
    background-color: transparent !important;
    background-clip: padding-box;
    border: 0;
    /* border-top: 10px solid transparent; */
    /* border-bottom: 10px solid transparent;
    opacity: .1;
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
}*/

    .content_slider .carousel-indicators button.active {
        opacity: 1;
        position: relative;
    }

    .content_slider .carousel-indicators button.active:after {
        position: absolute;
        content: "";
        width: auto;
        transform: translateY(-50%);
        left: 0;
    }

    .content_slider .carousel-indicators button {
        opacity: 1;
    }

    .content_slider .content_networks a {
        color: var(--Heading_color);
    }

    .content_slider .content_networks a i {
        transition: all 1s;
    }

    .content_slider .content_networks a:hover i {
        transform: scale(1.2);
    }

    .content_slider {
        /* position: relative; */
        /* padding: 0 33px; */
    }

    .content_slider .carousel-item {
        height: 650px !important;
    }

    .content_slider .carousel-item img.d-block.w-100 {
        height: 100% !important;
        width: 100% !important;
        object-fit: cover;
    }

    .content_slider .carousel-caption {
        position: absolute;
        right: inherit !important;
        left: 50px !important;
        padding-top: 1.25rem;
        padding-bottom: 1.25rem;
        color: var(--Heading_color) !important;
        text-align: left !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }

    .content_slider .carousel-caption span.collection {
        font-size: 24px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        display: inline-block;
        margin-bottom: 15px;
        letter-spacing: 5px;
    }


    .content_slider .carousel-caption button {
        font-size: var(--Brand_title_size_level_seven);
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-weight: 400;
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 16px 88px;
        text-transform: uppercase;
        margin-top: 50px;
        transition: opacity 2s;
    }

    .content_slider .carousel-caption button:hover {
        opacity: .5;
    }


    /* end slider */

    nav:not(.nav-breadcrumb) {
        border-top: 1px solid #e2e2e2;
        z-index: 99;
    }

    nav .navbar {
        /* height: 100%; */
        /* max-width: 1250px; */
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: auto;
        padding: 0 50px;
    }

    nav .navbar .logo {
        display: none;
    }

    .navbar .logo a {
        font-size: 30px;
        text-decoration: none;
        font-weight: 600;
    }

    nav .navbar .nav-links {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    nav .navbar .links {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0;
        padding: 0;
    }

    nav .navbar .links li {
        /* position: relative; */
        display: flex;
        align-items: center;
        justify-content: space-between;
        list-style: none;
        padding: 0 14px;
    }

    nav .navbar .links li a {
        height: 100%;
        font-weight: 300;
        text-decoration: none;
        white-space: nowrap;
        color: var(--Heading_color);
        font-size: 11.5px;
        font-weight: lighter;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std";
    }

    .links li:hover i.fa-caret-down,
    .links li:hover .fa-caret-down {
        transform: rotate(180deg);
    }

    nav .navbar .links li .fa-caret-right,
    nav .navbar .links li .fa-caret-down {
        height: 100%;
        width: 22px;
        text-align: center;
        display: inline-block;
        transition: all 0.3s ease;
        font-size: 12px;
    }

    nav .navbar .links li .sub-menu {
        position: absolute;
        top: 35px;
        left: 0;
        right: 0;
        line-height: 40px;
        background: var(--white-color);
        border-radius: 0 0 4px 4px;
        display: none;
        z-index: 20;
        padding: 20px 40px;
        box-shadow: 0 0px 3px 0 rgb(0 0 0 / 15%);
    }

    nav .navbar .links li .sub-menu .nav-n1 {
        display: flex;
        justify-content: space-between;
        gap: 20px;
    }

    nav .navbar .links li .sub-menu .nav-n1 h4 {
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: bold;
        font-size: 13px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 {
        padding: 0;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.li-mariee a.mariee {
        padding: 5px;
        background: #fde2e1;
        text-transform: uppercase;
        text-align: inherit;
        font-style: italic;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1>li {
        padding: 0;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child {
        position: relative;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child.active .ul-nav-n2 {
        display: block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li {
        position: relative;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child.active .ul-nav-n3 {
        display: block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n3 {
        position: absolute;
        right: -100%;
        position: absolute;
        /* right: -127%; */
        padding: 0;
        top: 0;
        -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
        box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        display: none;
        z-index: 1;
        background: white;
    }


    /* nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a:after,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a:after {
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    content: "\f054";
    width: 10px;
    height: 10px;
    font-size: 10px;
    right: -17px;
} */

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child .nav-n1-has-child-flex,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 .nav-n2-has-child-flex {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
        width: 100%;
        height: 100%;
        position: relative;
        display: inline-block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a.active,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a:hover {
        color: red;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
        padding: 11px;
        font-size: 10px;
        line-height: 19px;
        cursor: pointer;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
        position: absolute;
        right: calc(-100% - 48px);
        padding: 0;
        top: 7px;
        -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
        box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        display: none;
        z-index: 1;
        background: white;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a {
        position: relative;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
        max-width: 200px;
        height: 100px;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image:last-of-type {
        margin-bottom: 41px !important;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image.no-list {
        margin-top: 20px;
        align-items: end;
        justify-content: start;
        gap: 20px;
    }

    .navbar .links li .sub-menu li {
        padding: 0 22px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .navbar .links li .sub-menu a {
        font-size: 12.5px;
        font-weight: 500;
        font-family: var(--Brand_title_fonts);
        text-transform: capitalize;
    }

    .navbar .links li .sub-menu .fa-caret-right {
        line-height: 40px;
    }

    .navbar .links li .sub-menu .more-sub-menu {
        position: absolute;
        top: 0;
        left: 100%;
        border-radius: 0 4px 4px 4px;
        z-index: 1;
        display: none;
    }

    .links li .sub-menu .more:hover .more-sub-menu {
        display: block;
    }

    .navbar .search-box {
        position: relative;
        height: 40px;
        width: 40px;
        display: none;
    }

    .navbar .search-box i {
        position: absolute;
        height: 100%;
        width: 100%;
        line-height: 40px;
        text-align: center;
        font-size: 22px;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .navbar .search-box .input-box {
        position: absolute;
        right: calc(100% - 40px);
        top: 80px;
        height: 60px;
        width: 300px;
        border-radius: 6px;
        opacity: 0;
        pointer-events: none;
        transition: all 0.4s ease;
    }

    .navbar.showInput .search-box .input-box {
        top: 65px;
        opacity: 1;
        pointer-events: auto;
        ;
    }

    .search-box .input-box::before {
        content: '';
        position: absolute;
        height: 20px;
        width: 20px;
        right: 10px;
        top: -6px;
        transform: rotate(45deg);
    }

    .search-box .input-box input {
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 4px;
        transform: translate(-50%, -50%);
        height: 35px;
        width: 280px;
        outline: none;
        padding: 0 15px;
        font-size: var(--Brand_title_size_level_seven);
        border: none;
    }

    .navbar .nav-links .sidebar-logo {
        display: none;
    }

    .navbar .bx-menu {
        display: none;
    }

    @media (max-width:920px) {
        nav .navbar {
            max-width: 100%;
            padding: 0 25px;
        }

        nav .navbar .logo a {
            font-size: 27px;
        }

        nav .navbar .links li {
            padding: 0 10px;
            white-space: nowrap;
        }

        nav .navbar .links li a {
            font-size: 15px;
        }
    }

    @media (max-width:992px) {
        nav .navbar .logo {
            display: none;
        }

        .navbar .bx-menu {
            display: block;
        }

        nav .navbar .nav-links {
            position: fixed;
            top: 0;
            left: -100%;
            display: block;
            max-width: 270px;
            width: 100%;
            line-height: 40px;
            padding: 20px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
            transition: all 0.5s ease;
            z-index: 1000;
            background: white;
        }

        .navbar .nav-links .sidebar-logo {
            display: grid;
            grid-template-columns: auto 25px;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .sidebar-logo .logo-name img {
            width: 100%;
        }

        /* .sidebar-logo .logo-name {
        font-size: 25px;
    } */
        .sidebar-logo i,
        .navbar .bx-menu {
            font-size: 25px;
        }

        nav .navbar .links {
            display: block;
            margin-top: 20px;
            padding: 0;
        }

        nav .navbar .links li .arrow {
            line-height: 40px;
        }

        nav .navbar .links li {
            display: block;
        }

        nav .navbar .links li .sub-menu {
            position: relative;
            top: 0;
            box-shadow: none;
            display: none;
            padding: 0;
        }

        nav .navbar .links li .sub-menu li {
            border-bottom: none;
        }

        .navbar .links li .sub-menu .more-sub-menu {
            display: none;
            position: relative;
            left: 0;
        }

        .navbar .links li .sub-menu .more-sub-menu li {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .links li:hover i.fa-caret-down,
        .links li:hover .fa-caret-down {
            transform: rotate(0deg);
        }

        .navbar .links li .sub-menu .more-sub-menu {
            display: none;
        }

        .navbar .links li .sub-menu .more span {
            display: flex;
            align-items: center;
        }

        .links li .sub-menu .more:hover .more-sub-menu {
            display: none;
        }

        nav .navbar .links li:hover .htmlCss-sub-menu,
        nav .navbar .links li:hover .js-sub-menu {
            display: none;
        }

        .navbar .nav-links.show1 .links .htmlCss-sub-menu,
        .navbar .nav-links.show3 .links .js-sub-menu,
        .navbar .nav-links.show2 .links .more .more-sub-menu {
            display: block;
        }

        .navbar .nav-links.show1 .links i.fa-caret-down,
        .navbar .nav-links.show3 .links .fa-caret-down {
            transform: rotate(180deg);
        }

        .navbar .nav-links.show2 .links .fa-caret-right {
            transform: rotate(90deg);
        }
    }

    @media (max-width:370px) {
        nav .navbar .nav-links {
            max-width: 100%;
            background: var(--white-color);
        }
    }


    /* start section collection */

    section.collection {
        /* padding-bottom: 70px; */
        padding-top: 2px;
    }

    section.collection .maps {
        padding: 25px 0 !important;
        position: fixed;
        bottom: 11px;
        margin-right: 20px;
        z-index: 3;
    }

    section.collection .collection_hiver {
        position: relative;
    }

    section.collection .desc_collection {
        padding: 70px 40px 0 40px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 40px;
    }

    /* @media (min-width: 1024px) and (max-width: 1199px) {
         section.autonome .content-autonome-desc p {
            padding-top: 45px;
        }

    } */

    @keyframes change {
        0% {
            background-image: url(../images/bg-btn.jpg);
        }

        100% {
            background-image: url(../images/bg-red.jpg);
        }
    }

    section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.maquillage .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.avis-clients a.decouvrir i.fa-solid.fa-arrow-right-long {
        margin-left: 12px;
    }

    section.collection .desc_collection a.decouvrir:after,
    section.autonome .content-autonome-desc a.decouvrir:after,
    section.maquillage .content-autonome-desc a.decouvrir:after,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:after {
        content: "";
        position: absolute;
        bottom: 13px;
        width: 113px;
        height: 1px;
        left: 0;
        right: inherit;
        top: inherit;
        background: white;
    }

    @keyframes animate {
        0% {
            background-position: left;
        }

        50% {
            background-position: center;
        }

        100% {
            background-position: right;
        }
    }

    section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long {
        margin-left: 10px;
    }

    section.collection .desc_collection .collection_networks,
    section.autonome .content-autonome .collection_networks,
    .cont-description .collection_networks,
    .fond-de-tient-description .collection_networks {
        display: flex;
        gap: 35px;
        margin-top: 20px;
    }

    section.collection .desc_collection .collection_networks a,
    section.autonome .content-autonome .collection_networks a,
    .cont-description .collection_networks a,
    .fond-de-tient-description .collection_networks a {
        padding: 7px 10px;
        border-radius: 50%;
        width: 35px;
        height: 35px;
        text-align: center;
        line-height: inherit;
        display: inline-block;
        border: 1px solid var(--Heading_color);
        color: var(--Heading_color);
        transition: all 2s;
        position: relative;
    }

    section.collection .desc_collection .collection_networks a:hover,
    .content-autonome .collection_networks a:hover,
    .fond-de-tient-description .collection_networks a:hover {
        opacity: .5;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 725px;
        /* height: 100%; */
        margin-left: 220px;
        margin-right: 0;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: -30px;
        gap: 20px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-next,
    section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-prev,
    section.autonome div#carouselExampleCaptions2 button.carousel-control-prev,
    section.autonome div#carouselExampleCaptions2 button.carousel-control-next,
    section.maquillage div#carouselExampleCaptions3 button.carousel-control-next,
    section.maquillage div#carouselExampleCaptions3 button.carousel-control-prev {
        display: none;
    }

    section.collection .collection_hiver .content-img_collection {
        position: absolute;
        bottom: 60px;
        right: inherit;
        left: 33px;
        width: 375px;
        /* height: 425px; */
    }

    button.slick-next.slick-arrow {
        padding-bottom: 70px;
    }

    button.slick-prev.slick-arrow {
        padding-bottom: 70px;
    }

    .desc_collection p {
        text-align: justify;
    }


    section.collection .collection_hiver .content-img_collection img {
        width: 100%;
        /* height: 82%; */
    }

    section.collection .desc_collection .spa.maquillage {
        height: 127px;
    }

    ol.breadcrumb {
        justify-content: center;
    }

    section.collection .desc_collection .spa img {
        width: 100%;
        height: 100%;
    }


    /* end section collection */


    /* start section autonome */

    section.autonome {
        padding: 0px 35px 0px 20px;
    }


    p.justified-text-modify {
        text-align: justify !important;
    }



    .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
        margin-left: 77px;
    }

    section.autonome .content-autonome {
        display: grid;
        grid-template-columns: 59% 63%;
        position: relative;
    }

    section.autonome {
        margin-right: 30px;
        margin-left: 30px;
        height: calc(50vh) !important;
        margin-bottom: 10px;
    }

    section.autonome.home {
        margin-right: 30px;
        margin-left: 30px;
        height: auto !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome .picture {
        /* height: 765px; */
        margin-top: 20px;
    }

    .video-wrapper {
        position: relative;
        padding-bottom: 56.25%;
        height: 0;
        overflow: hidden;
        max-width: 100%;
        background: #000;
    }

    .bloc1-application-mahassen {
        text-align: center;
    }

    .title-bloc1-application-mahassen {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .description-bloc1-application-mahassen {
        text-align: justify;
        /* margin: 0 auto;
    max-width: 600px; */
    }

    .img-bloc1-app-application-mahassen {
        margin-top: 20px;
        text-align: center;
    }


    .video-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


    section.autonome .content-autonome .picture img {
        /* height: 70%; */
        width: 100%;
        max-width: 84%;
        object-fit: cover;
    }




    section.autonome .content-autonome-desc span {
        color: var(--white-color);
    }

    section.autonome .content-autonome-desc {
        padding-top: 70px;
    }

    p.justified-text-mahaseen {
        padding-top: 100px;

    }

    .desc_collection p {
        text-align: justify !important;
        /* text-justify: inter-word !important; Add this line for content justification */
    }


    section.autonome .content-autonome-desc p {
        padding-right: 20px;
    }



    section.autonome .content-autonome .collection_networks a,
    .cont-description .collection_networks a {
        position: relative;
        display: inline-block;
    }



    section.autonome .content-autonome-desc a.decouvrir {
        margin-left: 40px;
        display: inline-block;
    }

    section.autonome .content-autonome .collection_networks {
        margin-left: 40px;
    }

    .content-autonome .collection_networks,
    .cont-description .collection_networks {
        margin-top: 50px;
    }

    .content-autonome .collection_networks a:not(:last-of-type):after,
    .cont-description .collection_networks a:not(:last-of-type):after,
    .fond-de-tient-description .collection_networks a:not(:last-of-type):after {
        position: absolute;
        content: "";
        height: 35px;
        width: 1px;
        background-color: #adadad;
        right: -20px;
        top: 0;
        bottom: 0;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 725px;
        position: relative;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item {
        /* height: 725px; */
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 200% !important; */
        width: 100% !important;
        background-size: cover;
        margin: 0 auto;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: absolute;
        bottom: 0;
        z-index: 5;
        /* background: var(--white-color); */
        width: 100%;
        transform: translateX(-4%);
    }





    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        position: absolute;
        top: -146px;
        right: -105px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        gap: 20px;
        align-items: flex-end;
        text-align: right;
        z-index: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators button:not(.active) {
        margin-right: 12px;
    }


    /* end section autonome */


    /* start section maquillage */

    section.maquillage.home {
        padding: 50px 37px 50px;
        background: #f5f5f5;
        margin-top: 100px;
        /* height: 55%; */
    }

    section.maquillage .video-container {
        height: 745px;
        width: 100%;
        position: relative;
    }

    section.maquillage .video-container img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }



    @keyframes scale {
        0% {
            box-shadow: -4px 2px 111px 1px rgba(5, 3, 3, 0.75);
        }

        100% {
            box-shadow: -4px 2px 111px 28px rgba(5, 3, 3, 0.75);
        }
    }

    section.maquillage .popup-video {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 100;
        background: rgba(0, 0, 0, .8);
        height: 100%;
        width: 100%;
    }

    section.maquillage .popup-video video {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 750px;
        height: 750px;
        border-radius: 5px;
        border: 2px solid var(--white-color);
        object-fit: cover;
    }

    section.maquillage .popup-video span {
        position: absolute;
        top: 5px;
        right: 20px;
        font-size: 50px;
        color: var(--white-color);
        font-weight: 700;
        z-index: 100;
        cursor: pointer;
    }

    section.maquillage video {
        height: 100%;
        width: 100%;
    }

    section.maquillage .content-autonome-desc {
        /* margin-top: 30px; */
        padding-right: 6px;
        margin-left: 80px;
        padding-left: 93px;
        margin-top: 0px;
    }


    @media (min-width: 1400px) {
        .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
            flex: 0 0 auto;
            width: 2%;
        }

        .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
            padding-left: 86px;
        }


        .content-image.shine {
            max-width: 681px;
            max-height: 486px;
        }

        .product-item.shine {
            margin-left: 20px;
            margin-bottom: 20px;
        }

        a.fancybox {
            max-width: 100px;
            max-height: 100px;
        }



    }

    section.maquillage .content-autonome-desc a.decouvrir {
        background-image: url(../images/bg-red.jpg);
    }

    section.maquillage .content-carousel-maquillage {
        position: relative;
    }

    section.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 85px;
        gap: 30px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner {
        height: 100%;
        position: relative;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        bottom: 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
        height: 645px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        position: absolute;
        bottom: -26px;
        left: -10px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner img,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner img {
        height: 500px;
        box-shadow: 4px 6px 15px -4px rgb(0 0 0 / 10%);
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .new,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .new {
        position: absolute;
        top: 10px;
        left: 10px;
        color: #f33f38;
        padding: 6px 25px;
        font-size: 13.5px;
        background: var(--white-color);
        box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
        font-family: var(--Brand_title_fonts);
        text-align: center;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise,
    .carousel-maquillage .carousel-inner .remise {
        position: absolute;
        top: 23px;
        right: 27px;
        overflow: hidden;
        height: 50px;
        width: 50px;
        line-height: 19px;
        padding: 15px 4px;
        text-align: center;
        /* background-image: url(../images/bg-remise.png); */
        background: red;
        /* background-position: center; */
        border-radius: 50%;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise span,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise span,
    .carousel-maquillage .carousel-inner .remise span {
        color: var(--white-color);
        font-family: var(--Brand_title_fonts);
        font-size: var(--Brand_para_size);
        font-weight: 700;
        /* margin-top: 23px; */
        /* padding: 3px 58px; */
        display: inline-block;
        /* transform: rotate(45deg); */
    }


    /* end section maquillage */


    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -120px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    /* start section nouveaute */

    section.nouveaute {
        padding: 50px 20px 50px 20px;
        /* margin-left: 30px;
        margin-right: 30px; */

    }

    section.nouveaute .content-image {
        /* height: 552px; */
    }

    section.nouveaute .content-image img {
        width: 100%;
        /* height: 100%; */
        object-fit: cover;
    }


    section.nouveaute .content-noveaute-desc {
        position: relative;
        height: 100%;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
    }




    /* end section nouveaute */


    /* start product-cosmetique */

    section.product-cosmetique {
        padding: 0 0 50px;
    }

    section.product-cosmetique .item {
        padding: 0px 28px;
        display: inline-block;
    }

    section.product-cosmetique .item .product-item {
        /* height: 450px; */
        position: relative;
    }

    section.product-cosmetique .item .product-item img {
        height: 100%;
        background-size: cover;
        width: 100%;
    }

    section.product-cosmetique .item .product-item .item-icons {
        position: absolute;
        bottom: 50px;
        right: 0;
        left: 50%;
        transform: translateX(-50%);
        justify-content: center;
        align-items: center;
        /* display: none; */
        animation: viewicons 0.2s linear;
        width: 100%;
        text-align: center;
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        position: absolute;
        bottom: 50px;
        right: 0;
        left: 2%;
        transform: translateX(-50%);
        justify-content: center;
        align-items: center;
        /* display: none; */
        animation: viewicons 0.2s linear;
        width: 100%;
        text-align: center;
    }

    @keyframes viewicons {
        0% {
            bottom: 0;
        }

        50% {
            bottom: 20px;
        }

        100% {
            bottom: 50px;
        }
    }

    section.product-cosmetique .item:hover .item-icons {
        display: block;
    }

    section.product-cosmetique .item .product-item .item-icons .item-icons-left i {
        padding: 20px 25px;
        background: var(--white-color);
        color: var(--Heading_color);
        font-size: 22px;
        transition: all 2s;
    }

    section.product-cosmetique .item .product-item .item-icons i:hover {
        color: #acacac;
    }

    section.product-cosmetique .slick-slider {
        margin: 0 13px;
    }

    section.product-cosmetique .item .item-desc {
        padding: 26px 32px;
        text-align: center;
    }

    section.product-cosmetique .item a {
        text-decoration: none;
    }

    section.product-cosmetique .item .item-desc p {
        font-size: 20px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
    }

    section.product-cosmetique .item .item-desc h5 {
        font-size: 20px;
    }

    section.product-cosmetique button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -40px;
        right: 35px;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -120px;
        font-weight: 300;
        top: 11px;
    }



    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        top: 11px;
    }


    /* end product-cosmetique */


    /* start section avis */

    section.avis-clients {
        padding: 0 0 50px 0;
        text-align: center;
        position: relative;
    }

    section.avis-clients img {
        position: absolute;
        top: 66px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1;
        background: var(--white-color);
        border-radius: 50%;
    }

    section.avis-clients .content-slider-avis {
        max-width: 80%;
        margin: 0 auto;
        position: relative;
    }

    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        background-color: #f5f5f5;
        padding: 106px 0 50px;
        position: relative;
    }

    section.avis-clients .avis-slider .item {
        color: var(--Heading_color);
        position: relative;
        text-decoration: none;
    }

    section.avis-clients .avis-slider .item p {
        font-size: 20px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
        max-width: 100%;
        padding: 0 30px;
        margin: 0 auto;
    }

    section.avis-clients .avis-slider .item .author-avis {
        font-size: 18px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
        text-transform: uppercase;
        display: inline-block;
        margin-top: 54px;
        position: relative;
    }

    section.avis-clients .avis-slider .item .author-avis:after {
        position: absolute;
        content: "";
        width: 2px;
        height: 32px;
        top: inherit;
        bottom: 30px;
        background: var(--Heading_color);
        left: 50%;
        transform: translateX(1px);
    }


    section.avis-clients .avis-slider .slick-dots {
        top: 50%;
        height: 5px;
    }

    section.avis-clients .slick-prev:before {
        content: "";
        background: var(--Heading_color);
        font-size: 51px;
        position: absolute;
        left: -69px;
        width: 115px;
        height: 2px;
    }

    section.avis-clients .slick-next:before {
        background: var(--Heading_color);
        content: "";
        font-size: 51px;
        position: absolute;
        right: -69px;
        width: 115px;
        height: 2px;
    }

    span.slick-prev-index {
        position: absolute;
        top: 43%;
        left: -94px;
    }

    span.slick-next-index {
        position: absolute;
        top: 43%;
        right: -94px;
    }



    /* end section avis */


    /* start section carte mahassen */

    section.carte-mahassen {
        padding: 50px 35px 20px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        display: grid;
        grid-template-columns: 60px auto 142px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 60px;
        padding-left: 65px;
        padding-top: 39px;
    }

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* height: 100%; */
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen span.profiter {
        writing-mode: tb-rl;
        text-orientation: mixed;
        transform: rotate(180deg);
        text-align: end;
        font-size: var(--Brand_para_size);
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 700;
        color: var(--Heading_color);
    }

    section.carte-mahassen .content-carte-mahassen span.profiter .remise {
        color: #f33f38;
    }

    /* section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 189px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: -41px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    } */

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        writing-mode: vertical-rl;
        font-size: 60px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }



    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }


    .nouveaute .content-image.shine {
        max-width: 100%;
        max-height: 100%;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 650px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 600px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 264px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        margin-top: 600px;
    }


    .content-carte-mahassen.carte-one {
        display: grid;
        grid-template-columns: auto 100px !important;
    }

    /* .content-carte-one {
        height: 1002.06px !important;
    } */


    section.carte-mahassen .content-carte-mahassen .content-carte-one button:hover {
        opacity: .5;
    }


    /* end section carte mahassen */


    /* start section mahassen live */

    section.mahassen-lives .item {
        position: relative;
        padding: 0 20px;
    }

    section.mahassen-lives .item a img {
        width: 100%;
        /* height: 100%; */
    }


    section.mahassen-lives button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -30px;
        padding-bottom: 75px;
        right: 44px;
    }

    .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
        flex: 0 0 auto;
        width: 2%;
    }

    .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
        padding-left: 86px;
    }

    p.justified-text-modify {
        margin-bottom: 0px;
        padding-top: 10px;
    }

    section.autonome .content-autonome-desc a.decouvrir {
        margin-top: 0px;
    }


    .product-item.shine {
        margin-left: 20px;
        margin-bottom: 20px;
    }


    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
    }

    section.mahassen-lives button.slick-prev.slick-arrow {
        position: absolute;
        bottom: -40px;
        left: inherit;
        right: 114px;
        padding-bottom: 75px;
        top: inherit;
    }

    .carousel-caption.custom-caption {
        text-align: center;
        padding-left: 70px;

    }

    section.mahassen-lives .mahassen-live-desc .diese {
        margin-top: 0;
        margin-bottom: 30px;
        text-align: center;
        position: relative;
        height: 116px;
    }

    section.mahassen-lives .mahassen-live-desc .diese img {
        height: 100%;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        position: absolute;
        content: "";
        width: 531px;
        height: 286px;
        background: #fbfaf8;
        top: 23px;
        right: -206px;
        z-index: -1;
    }


    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 90px;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        position: absolute;
        bottom: 76px;
        left: 8%;
        height: 324px;
        width: 624px;
        z-index: -1;
    }

    section.mahassen-lives .mahassen-live-desc span.live img {
        width: 100%;
        object-fit: cover;
    }


    /* end section mahassen live */


    /* start section abonnez vous */


    section.abonnez-vous.no-bg {
        background: #fff;
    }



    section.abonnez-vous h5 {
        font-size: 25px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        color: var(--Heading_color);
        margin-bottom: 60px;
    }

    section.abonnez-vous .item {
        padding: 0 10px;
        position: relative;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        position: absolute;
        content: "";
        width: 56px;
        height: 40px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url(../images/playyoutube.png);
        cursor: pointer;
        pointer-events: none;
    }

    section.abonnez-vous .item img {
        width: 100%;
        /* height: 100%; */
    }

    section.abonnez-vous .slick-slider {
        margin: 0 -15px;
    }


    /* end section abonnez vous */


    /* start section abonnez vous */

    section.newsletter {
        padding: 5px 0 45px;
        text-align: center;
    }



    section.newsletter .email {
        max-width: 1050px;
        margin: 35px auto 0;
        display: grid;
        grid-template-columns: auto 238px;
        gap: 20px
    }

    section.newsletter .email input[type="email"] {
        padding: 16px;
        border: 1px solid #382e2e;
        outline: none;
        font-family: "Century-Gothic-Std", "Century Gothic";
    }



    section.newsletter .email .inscrire:hover {
        opacity: 0.5;
    }


    /* end section abonnez vous */


    /* start section icons */

    section.icons {
        padding: 50px 0;
        text-align: center;
    }

    section.icons .container-fluid {
        position: relative;
    }

    section.icons .container-fluid:after {
        position: absolute;
        content: "";
        top: 0;
        right: 0;
        bottom: 0;
        width: 15px;
        height: 100%;
        background: var(--white-color);
    }

    section.icons .container-fluid::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        bottom: 0;
        width: 15px;
        height: 100%;
        background: var(--white-color);
    }

    section.icons .item-desc img {
        margin: 30px auto 30px;
    }

    section.icons .item {
        position: relative;
        padding: 0 10px;
    }

    /* section.icons .item:after {
        position: absolute;
        content: "";
        height: 100%;
        width: 1px;
        background: #e6e6e6;
        right: 0;
        top: 0;
        bottom: 0;
    } */


    /* e6e6e6 */




    /* end section icons */


    /* start footer */

    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 60px 25px 35px;
        padding-left: 51px !important;
        justify-items: center;
        padding-right: 53px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer-content {
        padding-left: 20px !important;
        padding-right: 20px;
    }



    section.footer .footer-content h3 span {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-transform: initial;
        display: block;
        margin-top: 10px;
    }

    section.footer .footer-content .adresse {
        padding-left: 25px;
        background-image: url(../images/icon-maps.png);
        background-position: top 3px left;
        background-repeat: no-repeat;
        margin-bottom: 20px;
    }

    section.footer .footer-content .telephone a,
    section.footer .footer-content .email a {
        font-size: 15px;
        font-family: var(--Brand_title_fonts);
        text-transform: initial;
        display: block;
        color: var(--white-color);
        text-decoration: none;
    }

    section.footer .footer-content .telephone a span,
    section.footer .footer-content .email a span {
        margin: 0;
    }

    section.footer .footer-content .telephone {
        padding-left: 25px;
        background-image: url(../images/icon-tel.png);
        background-position: top 4px left;
        background-repeat: no-repeat;
        margin-bottom: 20px;
    }

    section.footer .footer-content .email {
        padding-left: 25px;
        background-image: url(../images/icon-email.png);
        background-position: top 7px left;
        background-repeat: no-repeat;
    }

    .footer-networks {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 0 21px;
    }

    .footer-networks a {
        color: var(--white-color);
    }

    .footer-networks i {
        font-size: 14px;
        font-weight: bold;
        margin-right: 15px;
        cursor: pointer;
    }

    .footer-networks .carte-banck {
        display: flex;
        gap: 15px;
    }


    /* end footer */


    /* ===============================================
            start page centre mahassen
=============================================== */


    /* start marketing */

    .header-marketing {
        height: auto !important;
        position: relative;
    }

    .header-marketing:after {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background: #00000020;
        z-index: 0;
    }

    .header-marketing img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
        display: flex;
        flex-direction: column;
        gap: 20px;
        transform: translateY(-50%);
        overflow: hidden;
        width: auto;
    }

    .header-marketing .header-marketing-icons a {
        display: flex;
        background: var(--Heading_color);
        gap: 13px;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 400;
        width: auto;
        padding: 14px;
        color: var(--white-color);
        text-decoration: none;
        align-items: center;
        position: relative;
        right: -186px;
        transition: right 2s;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons a i {
        font-size: 18px;
    }

    .header-marketing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-desc.meilleur {
        width: 100%;
    }



    .header-marketing .header-marketing-desc h1 {
        font-size: 32px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
        font-size: 20px;
    }

    a.decouvre {
        font-size: 16px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        text-decoration: none;
        color: white;
        background: black;
        padding: 20px;
        width: 240px;
        height: 60px;
        clear: both;
        display: table;
        margin: 30px auto 0;
        text-transform: uppercase;
        transition: opacity 2s;
    }

    a.decouvre:hover {
        opacity: .5;
    }




    /* end marketing */


    /* start section nouveaute */
    .collection.mah-nouveaute.mah-Centre {
        margin-top: 50px;
    }

    section.collection.mah-nouveaute {
        position: relative;
        padding-left: 35px;
        padding-right: 35px;
    }


    .reseaux-all {
        padding-right: 20px;
    }


    .reseaux-mail {
        padding-bottom: 10px;
        padding-right: 6px;
    }

    section.collection.mah-nouveaute .content-img {
        padding-right: 168px;
        height: 702px;
    }


    section.collection.mah-nouveaute .content-img-collection {
        padding-right: 168px;
        height: 702px;
    }

    section.collection.mah-nouveaute .content-img-nouveaute {
        /* padding-right: 168px; */
    }

    section.collection.mah-nouveaute .content-img-nouveaute.shine-two-nouveaute {
        /* padding-right: 168px; */

    }

    section.collection.mah-nouveaute .content-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.collection.mah-nouveaute .content-img-nouveaute img {
        width: 100%;
        object-fit: cover;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 10%;
        right: 50%;
        transform: inherit;
        bottom: 90px;
        max-width: 352px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        display: none;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 170px;
        gap: 30px;
        left: -700px;
    }


    /* end section nouveaute */


    /* start section hamam */

    .cont-description {
        width: 93%;
        padding-left: 20px;
        /* margin-left: 33px; */
        margin-top: 50px;
    }

    .cont-description-right {
        width: 100%;
        margin-left: 11px;
        margin-top: 50px;
        padding-right: 70px;
    }

    .cont-description-categorie3 {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;

    }

    .description-content {
        max-height: 150px;
        /* Adjust this value to control how much content is shown initially */
        overflow: hidden;
        position: relative;
        transition: max-height 0.3s ease;
    }

    .description-expanded {
        max-height: none;
        /* Remove height limitation when expanded */
    }

    .read-more-btn {
        display: inline-block;
        margin-top: 10px;
        color: #007bff;
        cursor: pointer;
        text-decoration: none;
    }

    .read-more-btn:hover {
        text-decoration: underline;
    }



    .cont-description-categorie3 {
        width: 85%;

    }

    .cont-description-application {
        margin-top: 61px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 7px;
        text-align: justify;
    }

    .shine {
        position: relative;
        overflow: hidden;
    }

    .shine-esthetique {
        position: relative;
        overflow: hidden;
        max-width: 95%;
    }

    .nouveaute.Center-m .shine-esthetique {
        max-width: 100%;
    }

    section.hamam .cont-description {
        margin-top: 50px;
        padding-right: 53px;
        padding-left: 20px;
    }

    section.hamam {
        padding: 0 35px 0;
        position: relative;
        margin: 50px 0 50px;
    }

    section.hamam .hamam-img {
        background: url(../images/mahassen-centre1.jpg) left no-repeat;
        position: relative;
        top: 6%;
        right: 0;
        bottom: 0;
        left: -70px;
    }

    section.hamam .hamam-img .content-img-hammem {
        width: 250px;
        position: absolute;
        height: 250px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    section.hamam .hamam-img .content-img {
        width: 320px;
        position: absolute;
        height: 320px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    .adjustment-text-footer {
        margin-left: 20px;
        margin-right: 20px
    }


    section.hamam .hamam-img .content-img img {
        width: 100%;
    }


    /* end section hamam */


    /* start section massage */

    section.massage {
        padding: 35px 35px;
        padding: 60px 35px 35px 35px;
        position: relative;
    }

    section.massage.coiffure.marque {
        padding: 35px 35px;
        padding: 30px 35px 30px 35px;
        position: relative;
    }


    section.massage .hamam-img {
        position: relative;
        left: 13px;
        top: 43px;
    }

    .massage.coiffure.b2b-marque .hamam-img {
        left: 0;
        top: 0;
    }

    .massage.coiffure.b2b-marque .hamam-img {
        left: 0;
        top: 0;
    }

    section.massage .hamam-img-right {
        position: relative;
        /* right: 22px; */
    }


    section.massage:after {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: #f5f5f5;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: -1;
    }

    section.massage.coiffure:after {
        position: absolute;
        content: "";
        width: inherit;
        height: inherit;
        background-color: inherit;
        top: inherit;
        left: inherit;
        bottom: inherit;
        z-index: inherit;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }

    section.massage.coiffure::before {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: #f5f5f5;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }

    section.massage .content-img {
        text-align: center;
        width: 50%;
        /* margin: 0 auto; */
        width: 100%;
        /* height: 555px; */
        object-fit: cover;
        /* padding-right: 50px; */
    }

    section.massage.coiffure.b2b-marque .content-img {
        padding-right: 0;
        margin-right: 0;
    }

    section.massage.coiffure.b2b-marque .content-img {
        padding-right: 0;
        margin-right: 0;
    }

    section.massage .content-img img {
        width: 100%;
        /* height: 100%; */
        object-fit: contain;
    }

    button.slick-next.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }


    /* end section massage */


    /* start section la Marque */

    section.lamarque {
        position: relative;
        padding-right: 0px;
        padding-left: 0px;
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .live-slider.slick-initialized.slick-slider .item {
        /* height: 594px; */
    }

    .live-slider.slick-initialized.slick-slider img {
        width: 100%;
        /* height: 100%; */
        object-fit: cover;
    }

    section.lamarque:after {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: #f5f5f5;
        top: 0;
        right: 50%;
        bottom: 0;
        z-index: -1;
    }

    section.lamarque .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -80px;
    }

    section.lamarque .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }

    section.lamarque .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -80px;
    }

    section.lamarque .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }


    /* end section la Marque */


    /* start page esthetique-home */

    section.esthetique-home {
        padding: 50px 35px;
        margin-top: 50px;
        padding-top: 50px;

    }

    section.esthetique-home .content-slider-home {
        padding-left: 50px;
        position: relative;
    }

    section.esthetique-home span.count-slide-position {
        /* position: absolute; */
        /* bottom: -78px; */
        /* left: 145px; */
        font-size: 32px;
        font-family: var(--Brand_title_fonts);
        display: none;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -2px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;

    }


    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 102px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;

    }

    .content-img {
        flex: 0 0 auto;
        width: 100px;
        margin-right: 20px;
    }

    section.esthetique-home .content-img {
        height: 860px;
    }

    section.esthetique-home .content-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.esthetique-home h2 {
        font-size: 35px;
        text-align: center;
        margin-bottom: 50px;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    section.esthetique-home h3 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: 'Century-Gothic-Std';
        font-size: 25px;
    }

    section.esthetique-home p {
        font-size: 15px;
        line-height: 29px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        margin-bottom: 50px;
        color: black;
    }

    section.esthetique-home .homme-slider.slick-initialized.slick-slider .item {
        height: 100%;
    }

    section.esthetique-home .content-img-abs {
        position: relative;
        width: 100%;
        height: 100%;
    }

    section.esthetique-home .content-img-abs img {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 415px;
        height: 375px;
        object-fit: cover;
    }


    /* end page esthetique-home */


    /* ===============================================
            end page centre mahassen
=============================================== */


    /* ===============================================
            start page maquillage
=============================================== */


    /* start section collection.mah-nouveaute.maquillage */

    section.collection.mah-nouveaute.maquillage {
        background: white;
        padding: 50px 37px 50px;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: inherit;
        left: 37px;
        right: inherit;
        transform: inherit;
        bottom: 0;
        max-width: 472px;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: inherit;
        left: 37px;
        right: inherit;
        transform: inherit;
        bottom: -189px;
        max-width: 472px;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        padding-right: 0;
        height: 700px;
        max-width: 722px;
        margin-left: auto;
    }


    section.collection.mah-nouveaute.maquillage .content-img-collection {
        padding-right: 0;
        max-width: 722px;
        margin-left: auto;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0 20px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 170px;
        gap: 30px;
        right: -141%;
        left: inherit;
    }


    /* end section collection.mah-nouveaute.maquillage */


    /* start collection.mahassen */

    section.collection.mahassen {
        padding: 50px 37px 50px;
        margin-top: 120px;
        background: #f5f5f5;
    }

    section.collection.mahassen h2 {
        font-size: var(--Brand_title_size_level_forth);
        font-weight: 700;
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
        text-align: center;
        margin-bottom: 50px;
    }

    section.collection.mahassen .slick-slider {
        margin: 0 -22px;
    }

    section.collection.mahassen .item {
        padding: 0 22px;
    }

    section.collection.mahassen .item .product-item {
        height: 454px;
        margin-bottom: 25px;
    }

    section.collection.mahassen .item img {
        height: 100%;
        background-size: cover;
    }

    section.collection.mahassen .item a {
        text-decoration: none;
    }

    section.collection.mahassen .item h4 {
        text-align: center;
        text-decoration: none;
        font-size: 28px;
        margin: 15px 0 15px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
    }

    section.collection.mahassen .slick-dots {
        bottom: -39px;
    }

    section.collection.mahassen .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 10px;
        height: 10px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: 0;
        background: black !important;
        color: black !important;
        border-radius: 50%;
        margin: 0 auto;
    }

    section.collection.mahassen .slick-dots li.slick-active button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 25px;
        height: 25px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: 0;
        background: transparent !important;
        color: transparent !important;
        border-radius: 50%;
        margin: 0 auto;
        border: 2px solid #989898;
    }


    /* end collection.mahassen */


    /* start section product cosmetique maquillage */

    section.product-cosmetique.maquillage {
        padding: 0px 0 40px;
        background: white;
    }

    .collection.mah-nouveaute.maquillage img {
        /* height: 700px; */
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 38px;
        width: 60px;
        content: "";
    }

    section.product-cosmetique.maquillage.maquillage2 {
        padding: 20px 0 20px 0px !important;
        background: white !important;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: var(--Brand_title_size_level_forth);
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
        text-align: center;
        margin-bottom: 50px;
    }


    /* end section product cosmetique maquillage */


    /* start section idees */

    section.idees {
        padding: 50px 37px 50px;
        background: #f5f5f5;
    }

    section.idees .slick-slider {
        margin: 0 -24px;
    }

    section.idees .item-desc {
        text-align: center;
    }


    section.idees .item {
        padding: 0px 37px;
        display: inline-block;
    }

    /* section.idees .product-item {
        height: 685px !important;
    } */

    section.idees .item .product-item:nth-child(odd) {
        margin-bottom: 45px;
    }

    section.idees .item .product-item:nth-child(even) {
        margin-top: 45px;
    }

    section.idees .item .product-item img {
        height: auto;
        background-size: cover;
    }

    section.idees .item a {
        text-decoration: none;
    }


    /* end section idees */


    /* ===============================================
            end page maquillage
=============================================== */


    /* ================== start section inscrivez-vous */

    section.inscrivez-vous {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: #4c4c4ce3;
        z-index: 5;
        display: none;
    }

    section.inscrivez-vous .container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 45px 50px 45px 65px;
    }



    section.inscrivez-vous .content_networks-pop-up {
        display: flex;
        gap: 15px;
    }

    section.inscrivez-vous .content_networks-pop-up a {
        color: black;
        transition: all 2s;
    }

    section.inscrivez-vous .content_networks-pop-up a:hover {
        opacity: .5;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        display: grid;
        grid-template-columns: auto 130px;
        gap: 10px;
        width: 73%;
        margin-bottom: 25px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        height: 40px;
        border: 1px solid #000;
        padding: 9px;
        outline: none;
        color: #7f7f7f;
    }



    section.inscrivez-vous .inscrivez-vous-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .content-inscrivez-vous {
        display: grid;
        grid-template-columns: 70% 30%;
        background: white;
        position: relative;
        gap: 1px;
        max-width: 930px;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
        position: absolute;
        top: -19px;
        right: -16px;
        padding: 10px;
        background: black;
        color: white;
        transition: opacity 2s;
        cursor: pointer;
        z-index: 1;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark:hover {
        opacity: .5;
    }


    /* ================== end section inscrivez-vous */


    /* ============================================
                 start page fond de teint
============================================ */


    /* start navigayions links */

    .navigation-links {
        text-align: center;
        padding: 0 50px;
    }

    .navigation-links .container-fluid {
        padding: 166px 0;
        height: 100%;
        background: #00000020;
    }



    .navigation-links .breadcrumb {
        justify-content: center;
        margin: 0;
    }

    .navigation-links nav {
        border: none;
        color: #505050;
    }

    .navigation-links li.breadcrumb-item,
    .navigation-links li.breadcrumb-item a {
        font-family: "Century-Gothic-Std", "Century Gothic";
        height: 100%;
        font-weight: 300;
        text-decoration: none;
        white-space: nowrap;
        color: #fff;
        font-size: 14px;
        font-weight: 400;
    }

    .navigation-links li.breadcrumb-item a {
        text-decoration: none;
        text-transform: none;
    }




    /* end navigayions links */


    /* start section fond-de-tient-details */

    section.fond-de-tient-details {
        padding: 50px 33px 50px;
    }





    section.fond-de-tient-details .content-img .content-one .content-one-img {
        position: relative;
        height: 400px;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart {
        position: absolute;
        top: 20px;
        right: 20px;
        bottom: inherit;
        left: inherit;
        padding: 16px;
        color: #000;
        background: white;
        font-size: 18px;
        display: none;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart.active {
        color: red;
        display: block;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img:hover .fa-regular.fa-heart {
        display: block;
    }

    section.fond-de-tient-details .content-img .content-one-img a.fancybox img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }


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

    .select_wrap {
        margin: 40px auto 20px 0;
        position: relative;
        user-select: none;
        max-width: 573px;
    }

    .select_wrap ul {
        list-style: none;
        padding: 0;
    }

    .select_wrap .default_option {
        background: #fff;
        border-radius: 5px;
        position: relative;
        cursor: pointer;
        border: 1px solid #e4e3e3;
    }

    .select_wrap .default_option:before {
        content: "";
        position: absolute;
        top: 18px;
        right: 18px;
        width: 16px;
        height: 16px;
        border: 2px solid;
        border-color: transparent transparent #555555 #555555;
        transform: rotate(-45deg);
    }

    .select_wrap .select_ul {
        position: absolute;
        top: 56px;
        left: 0;
        width: 100%;
        background: #fff;
        border-radius: 5px;
        display: none;
        -webkit-box-shadow: 3px 3px 26px -6px rgb(165 160 160);
        -moz-box-shadow: 3px 3px 26px -6px rgba(165, 160, 160, 1);
        box-shadow: 3px 3px 26px -6px rgb(165 160 160);
    }

    .select_wrap .select_ul li {
        cursor: pointer;
    }

    .select_wrap .select_ul li:first-child:hover {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    .select_wrap .select_ul li:last-child:hover {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .select_wrap .option {
        display: flex;
        align-items: center;
        height: 54px;
        box-sizing: border-box;
        padding: 0 15px 0 20px;
    }

    .select_wrap .option p {
        margin: 0;
        font-size: var(--Brand_para_size);
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: #454545;
    }

    .select_wrap .option .icon {
        background: url('../images/teinte-plan.png') no-repeat 0 0;
        width: 32px;
        height: 32px;
        margin-right: 15px;
    }

    .select_wrap .option.teinte-num0 .icon {
        background-position: 0 -10px;
    }

    .select_wrap .option.teinte-num1 .icon {
        background-position: 0 -64px;
    }

    .select_wrap .option.teinte-num2 .icon {
        background-position: 0 -120px;
    }

    .select_wrap .option.teinte-num3 .icon {
        background-position: 0 -173px;
    }

    .select_wrap .option.teinte-num4 .icon {
        background-position: 0 -227px;
    }

    .select_wrap .option.teinte-num5 .icon {
        background-position: 0 -282px;
    }

    .select_wrap .option.teinte-num6 .icon {
        background-position: 0 -335px;
    }

    .select_wrap.active .select_ul {
        display: block;
        z-index: 1;
    }

    .select_wrap.active .default_option:before {
        top: 25px;
        transform: rotate(-225deg);
    }


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

    .fond-de-tient-description .avis {
        margin-top: 15px;
    }


    /* .fond-de-tient-description {
    padding-left: 65px;
} */





    .fond-de-tient-description p {
        font-family: 'Century-Gothic-Std';
        text-align: justify;
        font-size: 15px;
        color: var(--Heading_color);
        margin-bottom: 0;
    }



    .fond-de-tient-description h5,
    .fond-de-tient-description h5 span {
        font-size: 20px;
        margin-bottom: 15px;
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description span.all-avis {
        color: #737373;
        display: inline-block;
        margin: 0 20px 0 10px;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description span.rediger-avis {
        color: #737373;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description .content-img-fond-de-tient {
        margin-bottom: 30px;
    }






    /* start section slick */



    .fond-de-tient-description .product-item img {
        width: 100%;
    }

    .fond-de-tient-description .item a {
        text-align: center;
        text-decoration: none;
    }

    .fond-de-tient button.slick-prev.slick-arrow,
    .fond-de-tient button.slick-next.slick-arrow {
        display: none !important;
    }


    /* end section click */


    /* end section fond-de-tient-details */


    /* start page coupe */







    .fond-de-tient-description .grid-avis .btn-increment button.btn-increment-btn {
        width: 42px;
        outline: none;
        border: 1px solid #dad7d7;
        background: #f8f8f8;
        font-size: 23px;
        color: #6f6f6f;
    }

    .fond-de-tient-description .grid-avis .btn-increment input[type="text"] {
        width: 277px;
    }

    .fond-de-tient-description .avis .grid-btn button {
        outline: none;
        border: none;
        background: black;
        color: white;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-weight: 700;
        text-transform: uppercase;
        padding: 10px 14px;
        transition: all 2s;
        font-size: 15px;
    }

    .fond-de-tient-description .avis .grid-btn button:hover {
        opacity: .5;
    }

    .fond-de-tient-description .avis .grid-btn button img {
        display: inline-block;
        margin-right: 7px;
        margin-top: -7px;
    }

    .fond-de-tient-description p.partager {
        color: #737373;
        font-family: var(--Brand_title_fonts);
    }


    /* end page coupe */


    /* ============================================
                 end page fond de teint
============================================ */


    /* ============================================
                 start page coiffure
============================================ */

    section.nos-services-coiff {
        padding: 50px 35px;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff {
        position: relative;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff img {
        width: 100%;
        object-fit: cover;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff h4 {
        position: absolute;
        bottom: 0;
        text-align: center;
        left: 0;
        right: 0;
        font-size: 19px;
        font-family: var(--Brand_title_fonts);
        font-weight: 700;
        text-transform: uppercase;
        background: #ffffffc7;
        margin: 0;
        padding: 16px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff a.service-coiff-link {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: 1;
    }

    div#coiffureCarousel {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner .carousel-item {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner img.d-block.w-100 {
        height: 100% !important;
        object-fit: cover;
    }

    section.bannierCoiff {
        padding: 50px 35px 0;
    }

    section.bannierCoiff div#coiffureCarousel2 {
        height: 280px;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner {
        height: 100%;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item {
        height: 100%;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item img.d-block.w-100 {
        height: 100%;
        object-fit: cover;
    }


    /* ============================================
                 end page coiffure
============================================ */


    /* ============================================
                 responsive
============================================ */




    @media (min-width: 1200px) and (max-width:1676px) {

        /* start page fond de tien */
        /* section.fond-de-tient-details {
        padding: 50px 15px;
    } */
        .content-fond-de-tient {
            padding: 40px 50px 20px;
        }



        /* end page fond de tien */
    }

    @media (max-width: 767px) {

        /* start header */
        .content_slider .carousel-item {
            height: 250px !important;
        }

        .content_slider .carousel-item img.d-block.w-100 {
            object-fit: cover;
        }

        /* end header */
        /* start header icon */
        .header_logo_icons .content_lang {
            margin-bottom: 20px;
            justify-content: space-between;
        }

        .header_logo_icons .header_icons {
            justify-content: center;
            margin-top: 33px;
        }

        /* end header icon */
        /* start section mahassen-lives */
        section.mahassen-lives .mahassen-live-desc span.live {
            left: 2%;
            font-size: 12rem;
        }

        section.mahassen-lives .mahassen-live-desc .diese::after {
            width: 227px;
            height: 227px;
            top: 142px;
            right: 50%;
            transform: translateX(50%);
        }

        section.mahassen-lives .mahassen-live-desc {
            margin-bottom: 50px;
        }

        section.mahassen-lives .mahassen-live-desc p {
            margin-bottom: 0;
        }

        section.mahassen-lives .mahassen-live-desc a.decouvrir {
            margin-top: 30px;
        }

        /* end section mahassen-lives */
        /* start section autonome */
        section.collection {
            padding-bottom: 50px;
            padding-top: 40px;
        }

        section.autonome .content-autonome {
            display: grid;
            grid-template-columns: auto;
        }

        section.autonome .content-autonome .picture {
            margin-bottom: 15px;
            height: 565px;
        }

        section.autonome .content-autonome-desc {
            padding-top: 50px;
        }

        section.autonome .content-autonome-desc h2 {
            font-size: 89px;
            font-family: var(--Brand_title_fonts);
            text-transform: uppercase;
            position: inherit;
            top: inherit;
            left: inherit;
            right: inherit;
            width: auto;
        }

        section.autonome .content-autonome-desc span {
            color: var(--grayLighten_color);
        }

        section.autonome .content-autonome-desc p {
            padding-right: 0;
        }

        section.autonome div#carouselExampleCaptions2 .carousel-indicators {
            position: absolute;
            top: inherit;
            right: 50%;
            transform: translateX(50%);
            flex-direction: row;
            gap: inherit;
            margin: 0;
            bottom: 0;
        }

        /* end section autonome */
        /* start section abonnez-vous */
        section.abonnez-vous {
            padding: 50px;
        }

        section.abonnez-vous .slick-slider {
            margin: 0;
        }

        /* end section abonnez-vous */
        /* start section newsletter */
        section.newsletter {
            padding: 50px 0;
        }

        section.newsletter .email {
            max-width: 90%;
            grid-template-columns: auto 159px;
            gap: 5px;
        }

        /* end section newsletter */
        /* start section maquillage */
        section.maquillage {
            padding: 50px 0;
        }

        section.maquillage .content-autonome-desc {
            margin-top: 50px;
        }

        section.maquillage .content-carousel-maquillage {
            margin-top: 50px;
        }

        section.maquillage .video-container {
            height: 545px;
        }

        section.maquillage div#carouselExampleCaptions3,
        section.autonome div#carouselExampleCaptions2 {
            position: relative;
            top: 40px;
            width: 90%;
            top: inherit;
            left: inherit;
            margin: 0 auto;
        }

        section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
            bottom: -30px;
        }

        /* start section maquillage */
        /* start section nouveaute */
        section.nouveaute {
            padding: 50px 0;
        }

        section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
            font-size: 58px;
        }

        section.nouveaute .content-noveaute-desc .contnet-nouveaute {
            position: inherit;
            top: inherit;
            transform: inherit;
            left: inherit;
            margin-bottom: 50px;
        }

        /* end section nouveaute */
        /* start section nouveaute */
        section.nouveaute .content-image {
            height: 265px;
        }

        section.nouveaute .content-image img {
            width: 100%;
            height: 265px;
            object-fit: cover;
        }

        /* end section nouveaute */
        /* start section avis */
        section {
            padding-right: 0 !important;
            padding-left: 0 !important;
        }

        section.avis-clients img {
            top: 184px;
        }

        section.avis-clients .avis-slider.slick-initialized.slick-slider {
            padding: 115px 0;
        }

        section.avis-clients h2 {
            font-size: 58px;
            margin-bottom: 130px;
        }

        section.avis-clients .avis-slider .item .author-avis {
            margin-top: 80px;
        }

        section.avis-clients .avis-slider .item .author-avis:after {
            height: 32px;
        }

        section.avis-clients .slick-next:before {
            right: -22px;
            width: 35px;
        }

        section.avis-clients .slick-prev:before {
            left: -22px;
            width: 35px;
        }

        span.slick-prev-index {
            left: -23px;
        }

        span.slick-next-index {
            right: -23px;
        }

        /* end section avis */
        /* start page collection */
        section.collection .desc_collection {
            padding: 252px 0 0;
            gap: 50px;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 {
            max-width: 100%;
            height: 750px;
            margin-left: 0;
            margin-right: 0;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-inner {
            height: 100%;
        }

        section.collection .collection_hiver .content-img_collection {
            bottom: -338px;
            left: 33px;
            width: 353px;
            height: 425px;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
            width: 100%;
        }

        section.collection .collection_hiver .carousel-indicators {
            justify-content: end;
            margin: 0;
        }

        section.collection .collection_hiver .content-img_collection img {
            width: 70%;
            height: 250px;
            object-fit: cover;
        }

        /* end page collection */
        /* start section carte-mahassen */
        .slick-next {
            right: 0;
        }

        .slick-prev {
            left: 0;
        }

        section.carte-mahassen {
            padding: 50px 0 166px;
        }

        section.carte-mahassen.centre-m {
            padding: 50px 0;
        }

        section.carte-mahassen .content-carte-mahassen .content-carte-one p {
            max-width: 100%;
        }

        section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
            grid-template-columns: 30px auto 95px;
        }

        section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
            font-size: 100px;
            margin-left: -34px;
        }

        section.carte-mahassen .content-carte-mahassen.carte-two {
            padding-left: 30px;
        }

        /* end section carte-mahassen */
        /* start produit cosmetique */
        section.product-cosmetique .item {
            padding: 0px 5px;
        }

        section.product-cosmetique .item .item-desc {
            padding: 26px 15px;
        }

        section.product-cosmetique button.slick-next.slick-arrow {
            right: 0;
        }

        section.product-cosmetique .slick-slider {
            margin: inherit;
        }

        section.product-cosmetique .item .product-item .item-icons i {
            padding: 10px;
        }

        section p {
            font-size: 14px;
        }

        /* start produit cosmetique */
        /* start section abonnez vous */
        section.abonnez-vous {
            margin-top: 20px;
        }

        /* start section abonnez vous */
        /* start footer */
        section.footer .footer-content {
            grid-template-columns: repeat(2, 1fr);
            gap: 30px 20px;
        }

        /* end footer */
        /* ===========================================
            start page centre mahassen
    =========================================== */
        /* start section collection.mah-nouveaute */
        section.collection.mah-nouveaute .content-img {
            padding-right: 0;
            height: 500px;
            padding-bottom: 40px;
        }

        section.collection.mah-nouveaute div#carouselExampleCaptions3 {
            position: relative;
            top: inherit;
            right: inherit;
            transform: inherit;
            bottom: 0;
            max-width: 100%;
            width: 100%;
        }

        section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
            bottom: -37px;
            left: 0;
        }

        /* end section collection.mah-nouveaute */
        /* start section hamam */
        section.hamam {
            margin: 102px 0 0;
        }

        section.hamam .hamam-img {
            position: relative;
            top: inherit;
            right: inherit;
            bottom: inherit;
            left: inherit;
            height: 400px;
        }

        section.hamam .hamam-img .content-img {
            left: 0;
            bottom: 0;
        }

        /* start section hamam */
        /* start section esthetique-home */
        section.esthetique-home {
            padding: 75px 0 100px;
        }

        section.esthetique-home h2 {
            font-size: 60px;
            margin-bottom: 40px;
        }

        section.esthetique-home .content-slider-home {
            padding-left: 0;
        }

        section.esthetique-home .content-img {
            height: 550px;
            margin-bottom: 50px;
        }

        section.esthetique-home .content-img-abs img {
            bottom: -31px;
            right: 7px;
            width: 215px;
            height: 215px;
        }

        section.esthetique-home .slick-next {
            right: 0;
            left: inherit;
        }

        section.esthetique-home .slick-prev {
            right: 180px;
            left: inherit;
        }

        section.esthetique-home span.count-slide-position {
            left: inherit;
            right: 95px;
        }

        /* start section esthetique-home */
        /* start section massage */
        section.massage {
            padding: 103px 0;
        }

        section.massage .content-img {
            margin-bottom: 35px;
        }

        section.massage.coiffure::before,
        section.massage:after {
            height: 643px;
            top: 60px;
        }

        .cont-description {
            width: 100%;
            margin-top: 35px;
        }

        /* end section massage */
        /* start section collection */
        section.collection .desc_collection {
            padding: 100px 0 0;
        }

        /* end section collection */
        /* start  section esthetique-home */
        section.esthetique-home {
            margin-top: 0;
        }

        /* end  section esthetique-home */
        /* start section lamarque */
        .live-slider.slick-initialized.slick-slider .item {
            height: 494px;
        }

        section.lamarque:after {
            width: 50%;
            top: inherit;
            right: 50%;
            bottom: 10px;
            height: 620px;
        }

        /* end section lamarque */
        /* ===========================================
            end page centre mahassen
    =========================================== */
        /* ==============================================
                 start page maquillage
    ============================================== */
        /* start header-marketing */
        .header-marketing .header-marketing-desc.meilleur p {
            width: 90%;
        }

        /* end header-marketing */
        /* start section idees */
        section.idees .slick-slider {
            margin: inherit;
        }

        section.idees .item {
            padding: 0px 5px;
        }

        /* end section idees */
        /* start section collection.mahassen */
        section.collection.mahassen {
            margin-top: 0;
        }

        section.collection.mahassen .item {
            padding: 0px 5px;
        }

        section.collection.mahassen .slick-slider {
            margin: inherit;
        }

        /* end section collection.mahassen */
        /* start section mahassen-lives */
        section.mahassen-lives .item {
            padding: 0 5px;
        }

        /* end section mahassen-lives */
        /* start collection.mah-nouveaute.maquillage */
        section.collection.mah-nouveaute.maquillage .desc_collection {
            padding: 55px 0 0 0;
        }

        section.collection.mah-nouveaute.maquillage .content-img {
            max-width: 100%;
        }

        section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
            position: relative;
            top: inherit;
            left: inherit;
            right: inherit;
            transform: inherit;
            bottom: inherit;
            max-width: inherit;
            z-index: 1;
            margin-bottom: 30px;
        }

        section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
            right: 0;
            left: 0;
            bottom: -22px;
            position: absolute;
        }

        /* end collection.mah-nouveaute.maquillage */
        /* start section abonnez-vous */
        section.abonnez-vous .item {
            padding: 0 5px;
        }

        /* end section abonnez-vous */
        /* ==============================================
                 end page maquillage
    ============================================== */
        /* ==============================================
                start pop up maquillage
    ============================================== */
        .content-inscrivez-vous {
            grid-template-columns: auto;
            width: 80%;
        }

        section.inscrivez-vous .inscrivez-vous-description {
            order: 1;
            padding: 20px;
        }

        section.inscrivez-vous .inscrivez-vous-description .email {
            grid-template-columns: auto;
            width: 100%;
        }

        section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
            height: 40px;
        }

        .inscrivez-vous-img {
            order: 0;
            height: 250px;
            padding-top: 20px;
        }

        section.inscrivez-vous .inscrivez-vous-img img {
            object-fit: scale-down;
        }

        section.inscrivez-vous h2 {
            font-size: 23px !important;
        }

        section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
            width: 100%;
        }

        /* ==============================================
                end pop up maquillage
    ============================================== */
        /* start page fond de tient */
        .navigation-links {
            padding: 0 10px;
        }

        section.fond-de-tient-details {
            padding: 50px 0 0;
        }

        section.fond-de-tient-details {
            padding: 50px 0;
        }

        section.fond-de-tient-details .content-img {
            margin-bottom: 45px;
        }

        .fond-de-tient-description {
            padding-left: 0;
        }

        .content-fond-de-tient {
            padding: 40px 22px 20px;
        }

        .fond-de-tient-description .product-item {
            margin: 0 5px 18px;
            -webkit-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
            -moz-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
            box-shadow: 3px 8px 26px -21px rgb(165 160 160);
        }

        /* end page fond de tient */
        /* start page coupe */
        .fond-de-tient-description .grid-avis {
            flex-direction: column;
        }

        .fond-de-tient-description .avis .grid-btn {
            grid-template-columns: repeat(1, 1fr);
        }

        section.fond-de-tient-details .content-img .content-one {
            gap: 15px;
        }

        /* coupe page coupe */
        /* start page coiffure */
        div#coiffureCarousel {
            padding-bottom: 40px;
        }

        section.bannierCoiff {
            padding: 40px 35px;
        }

        section.nos-services-coiff {
            padding: 50px 35px 0;
        }

        section.nos-services-coiff .grid-nos-services-coiff {
            grid-template-columns: repeat(2, 1fr);
        }

        section.nos-services-coiff .grid-nos-services-coiff {
            gap: 15px;
        }

        /* end page coiffure */
        .collection .container .col-md-6.col-lg-6 {
            height: 550px;
        }
    }

    /* ============================================
                    end page centre mahassen
    ============================================ */
}



@media (min-width: 1440px) and (max-width: 1476px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 50px;
    }


}

@media (min-width: 1441px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 50px;
    }


}

@media (min-width: 768px) and (max-width: 1024px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 1px;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 600px !important; */
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }

}

@media (max-width: 480px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    /*
    .footer-qrq {
        padding-left: 50px;
    }*/
}


@media (min-width: 481px) and (max-width: 767px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        display: block;
        text-align: center;
    }
}



/* @media (min-width: 1200px) and (max-width: 1676px)  */

@media screen and (min-width: 1024px) {

    section.collection .desc_collection a.decouvrir:hover,
    section.autonome .content-autonome-desc a.decouvrir:hover,
    section.maquillage .content-autonome-desc a.decouvrir:hover,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
    section.avis-clients a.decouvrir:hover,
    section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
    .cont-description a.decouvrir:hover {
        /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
        background-size: 145px !important;
        transition: 1s all ease-out;
    }


    .blog-slider .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 34px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 142px;
        width: 60px;
        content: "";
        top: 92px;
    }

    .blog-slider .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -527px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 142px;
        width: 60px;
        content: "";
        top: 92px;
    }

    /* .carousel-maquillage .slick-next:after, .carousel-inner .slick-next:after {

        top: -80px;
    } */

    .indicators .carousel-inner {
        position: relative;
        width: 100%;
        overflow: visible;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 43%;
        display: block;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        /* z-index: 999; */
        right: -76px;
    }

    .col-xs-12.col-md-6.px-5.nouveau-client {
        padding-top: 45px;
    }

    .sliderTop .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        background: url(../images/btnleft.png)center no-repeat;
        height: 20px;
        width: 60px;
    }

    .sliderTop .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 58%;
        display: block;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -76px;
    }

    .sliderTop .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
    }

    .carousel-innerMake .carousel-inner.item.shine {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: relative;
        text-align: center;
        width: 100%;
        float: left;
        z-index: 999;
        overflow: visible !important;
    }

    section.maquillage div#carouselExampleCaptions2 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    /* .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 35%;
        display: block;
        padding: 0;
        left: auto;
        right: -50px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        width: auto;
      } */

    .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 12%;
        display: block;
        width: auto;
        height: 19px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: -41px;
    }

    .carousel-innerMake .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 26%;
        display: block;
        width: auto;
        height: 50px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: -46px;
    }

    .carousel-innerMake .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-innerMake .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -20px;
        right: 160px;
        width: 50px;
        height: 50px;
        left: inherit;
        z-index: 2;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }


    .carousel-maquillage button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -20px;
        right: 93px;
        width: 50px;
        height: 50px;
        left: inherit;
        z-index: 2;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-maquillage .slick-prev:before {
        /* color: var(--Heading_color); */
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -20px;
        font-weight: 300;
        top: 35px;
    }

    .carousel-maquillage .slick-next:before {
        /* color: var(--Heading_color); */
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        top: 35px;
    }
}



@media screen and (min-width: 1600px) {
    section.hamam .hamam-img .content-img {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }

    section.hamam .hamam-img .content-img-left {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }

    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    section.collection.mah-nouveaute .content-img {
        padding-right: 210px;
        height: 742px;
        width: 100%;
    }

    .sliderTop .slick-prev {
        top: 48%;
    }

    .content-img {}

    .content-text2 {}

    .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -20px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -20px;
    }


}

/* tabs  page fond de tien */
section.content-tabs {
    padding: 15px 0 50px;
    height: 100%;
}

section.product-cosmetique h2 {
    font-size: 24px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 40px;
    letter-spacing: 0.02rem;
    text-align: center;
}

.tabsmahassen {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
    border-bottom: 2px solid #e7e7e7;
    gap: 40px;
}

.tabsmahassen li {
    padding: 10px;
    /* border-right: 1px solid white; */
    cursor: pointer;
    transition: 0.2s;
    border-bottom: 4px solid transparent;
    font-size: 17px;
    position: relative;
}

.tabsmahassen li:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: -6px;
    background: #f33f38;
    width: 0;
    height: 4px;
}

.tabsmahassen li.active:after,
.tabsmahassen li:hover:after {
    width: 100%;
}

.content {
    text-align: -webkit-center;
}

.content-tabs .content p {
    line-height: 30px;
    font-size: 14px;
    color: #000;
}

.content>div {
    padding: 45px 20px 20px;
}

.content>div:not(:first-child) {
    display: none;
}

p.descrip-product {
    padding: 22px 0 15px;
}

/*button.slid-next.slick-arrow {
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
}

button.slid-prev.slick-arrow {
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(188deg);
    background-size: 100%;
    width: 13px !important;
    height: 60px !important;
    padding: 10px;
    margin-right: 0px;
    margin-left: 0px;
    position: absolute;
    display: inline-block;
} */

/* carrousel avec fleche  */
.content_slider button.slid-next.slick-arrow:after {
    position: absolute;
    content: "";
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(270deg);
    background-size: 100%;
    opacity: 1 !important;
    width: 13px;
    height: 58px !important;
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0;
}

.content_slider button.slid-prev.slick-arrow:after {
    position: absolute;
    content: "";
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
    opacity: 1;
    width: 13px;
    height: 58px !important;
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 20px 0px;
}

.collection_hiver .slide-arrow-left:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/left.png)center no-repeat;
    /* transform: rotate(90deg); */
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 5px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

.collection_hiver .slide-arrow-right:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/right.png)center no-repeat;
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 58px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

div#carouselExampleCaptions3 .slide-arrow-left:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/left.png)center no-repeat;
    /* transform: rotate(90deg); */
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 5px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

div#carouselExampleCaptions3 .slide-arrow-right:after {
    position: absolute;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/right.png)center no-repeat;
    background-size: 100%;
    /* opacity: 1; */
    width: 12px;
    /* height: 58px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

.content-img2 img {
    position: absolute;
    right: 0;
    z-index: 9999;
    height: 290px;
    width: 290px;
    top: -210px;
    left: auto;
}

.content-img2 {
    position: relative;
    display: block;
    right: 0;
    left: auto;
    overflow: visible !important;
    top: 0;
    height: 120px;
}

.slider__counter {
    position: absolute;
    bottom: 0;
    left: 5rem;
    z-index: 1;
    font-size: 2.5rem;
    font-weight: 600;
    color: #ce1212;
}

@media screen and (min-width: 1920px) {
    section.hamam .hamam-img .content-img {
        width: 370px;
        height: 370px;
        position: absolute;
        bottom: -40%;
        right: 9%;
    }

    section.hamam .hamam-img .content-img-left {
        width: 370px;
        height: 370px;
        position: absolute;
        bottom: -40%;
        right: 9%;
    }

    .carousel-item.shine {
        height: 100%;
        min-height: 715px;
    }

    .carousel-maquillage button.slick-next.slick-arrow,
    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -40px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 725px;
        height: 790px;
        min-height: 740px;
    }

    .carousel-maquillage .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        color: #fff;
        text-align: center;
        padding-top: 14px;
        padding-bottom: 0;
    }

    .carousel-maquillage .carousel-item.shine {
        height: 100%;
        min-height: 735px;
        /* background: white; */
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 400px;
    }
}

/* START  brochure -homme */
section.brochure-homme {
    padding: 50px 30px 50px;
    text-align: center;
    background: #f5f5f5;
    margin-top: 10px;
}

.content-img.brochure img {
    top: 80px;
    position: relative;
    max-width: 70%;
    z-index: 1;
    left: 0;
}

.content-img.brochure {
    position: relative;
}

/* end brochure-homme */
/* START FORFAIT   */
.top-forfait {
    position: relative;
}

section.forfait-homme {
    padding: 50px 30px 50px;
    text-align: center;
    margin-top: 10px;
    position: relative;
}

span.btn-forfait {
    background: #f33f38;
    width: 90px;
    height: 32px;
    position: absolute;
    bottom: 0;
    z-index: 3;
    color: white;
    font-size: 17px;
    line-height: 30px;
    text-transform: uppercase;
}

section.forfait-homme h2 {
    font-size: var(--Brand_title_size_level_five);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 25px;
}

.cont-forfait {
    border: 1px solid #dbdbdb;
    padding: 25px 10px;
    max-width: 532px;
    margin: 0 auto;
    min-height: 300px;
}

.cont-forfait p {
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    line-height: 31px;
    margin-bottom: 30px;
}

.content-encart img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 532px;
    position: relative;
}




.price-container {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    align-content: stretch;
    justify-content: center;
}

.prixcentred {
    text-align: center;
}

.cont-forfait h4 {
    color: #1a2e35;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* start section forfait */
/* start section coiffure-hom */

section.coiffure-hom-blogs {
    padding-top: 20px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    position: relative;

}

.content-one-img img {
    width: 100%;
    height: auto;
}

.blog-slider img {
    width: 100%;
    height: auto;
}

.sliders-section {
    padding: 20px 0;
}

.sliders-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.sliders-wrapper.sliders {
    margin-right: 20px;
}

.slider-container {
    flex: 1;
}

.blog-slider {
    width: 100%;
}



.blog-slider img {
    width: 100%;
    height: auto;
}

.shine-partenaire {
    max-width: 150px;
    margin: auto;
}

.image-partenaire {
    width: 100%;
    height: auto;
    max-width: 150px;
}





/* .bloc3-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
} */

section.coiffure-hom .hamam-img {
    position: relative;
}

section.bloc5-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 10px;
    padding-right: 22px;
}

section.bloc5-app .content-img-left img {
    min-width: 100%;
}

/*start bloc-2 page applcation */

section.bloc2-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc2-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc2-app {
    padding: 35px 35px;
    padding: 35px 35px 10px 35px;
    position: relative;
}

section.bloc2-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc2-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-2 page applcation */

/*start bloc-7 page applcation */

section.bloc7-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 10px;
}

section.bloc7-app .content-img-left img {
    min-width: 100%;
}

/*end bloc-7 page applcation */

/*start bloc-4 page applcation */

section.bloc4-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc4-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc4-app {
    padding: 10px 35px 35px 35px;
    position: relative;
}

section.bloc4-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc4-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-4 page applcation */


/*start bloc2-app-btb page applcation */

section.bloc2-app-btb.content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc2-app-btb {
    padding: 50px 35px;
    position: relative;
}

section.bloc2-app-btb {
    padding: 35px 35px;
    padding: 35px 35px 35px 35px;
    position: relative;
}

section.bloc2-app-btb .application-img-btb {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc2-app-btb .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc2-app-btb page applcation */


/*start bloc-6 page applcation */

section.bloc6-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc6-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc6-app {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc6-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc6-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-6 page applcation */

/*start bloc-8 page applcation */

section.bloc8-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc8-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc8-app {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc8-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc8-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-8 page applcation */

/*start bloc3-app-btb page applcation */

section.bloc3-app-btb .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc3-app-btb {
    padding: 50px 35px;
    position: relative;
}

section.bloc3-app-btb {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc3-app-btb .application-img-btb {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc3-app-btb .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc3-app-btb page applcation */



section.bloc5-app .application-img {
    position: relative;
}

section.bloc3-app .img-bloc3-app {
    position: relative;
    padding-top: 18px;
}

section.coiffure-hom:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.coiffure-hom.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.coiffure-hom.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.nouveaux-produit-actualite {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    margin: 20px 0;
    padding-left: 30px;
}

.justify-content-center {
    justify-content: center !important;
}

section.coiffure-hom .content-img {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc2-app .content-img {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc3-app .content-img {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;

}

section.coiffure-hom .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;

}

section.application-img .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;
}

section.bloc3-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;

}

section.bloc2-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;

}

.content-img-left {
    flex: 0 0 auto;
}



section.coiffure-hom .content-img img {
    min-width: 100%;
    /* height: 100%; */
    /* object-fit: cover;
    min-height: 365px; */
}

section.application-img .content-img-left img {
    min-width: 100%;
}

section.application-img .content-img img {
    min-width: 100%;
}

section.bloc2-app .img-bloc2-app {
    position: relative;
    left: 13px;
    top: 43px;
}

section.coiffure-hom .content-img-left img {
    min-width: 100%;
    /* height: 100%; */
    /* object-fit: cover;
    min-height: 365px; */
}

section.bloc2-app .content-img img {
    min-width: 100%;
    height: 100%;
}

/* section.bloc4-app .content-img img {
    min-width: 100%;
    height: 100%;
} */

.img-bloc1-application-mahassen img {
    max-width: 100%;
}


section.img-bloc2-app .content-img-left img {
    min-width: 100% !important;
    height: 100% !important;
}

section.bloc2-app .content-img img {
    width: 100%;
    object-fit: contain;
}




.content-img-left img {
    max-width: 100%;
    height: auto;
}

.content-img-left img {
    width: 60px;
    object-fit: cover;
    margin-right: 10px;
}

/* end section coiffure-hom */
/* start section product cosmetique maquillage */

section.product-cosmetique.maquillage {
    padding: 50px 0 40px;
    background: white;
}



button.decouvrir {
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    padding: 8px 11px;
    background: var(--white-color);
    margin-top: 14px;
    transition: opacity 2s;
    text-transform: uppercase;
}

section.product-cosmetique.maquillage.maquillage2 {
    padding: 50px 0 20px;
    padding-bottom: 20px;
    background: white;
}

section.product-cosmetique.maquillage h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px
}


/* end section product cosmetique maquillage */
/* start product-cosmetique homme */
section.product-cosmetique.recomd {
    padding: 50px 20px 20px;
    margin-bottom: 40px;
}

section.product-cosmetique.recomd .item .product-item {
    height: 100%;
    position: relative;
}

section.product-cosmetique.recomd .slick-initialized .slick-slide {
    /* padding: 0 20px; */
}

/* END  product-cosmetique homme */
/* start product-cosmetique BRUSHING*/
section.product-cosmetique.brushing {
    padding: 50px 0 50px;
}

.price-container {
    display: flex;
    gap: 10px;
    align-items: center;
}

.initial-price {
    color: #838383;
    font-size: 14px;
    text-decoration: line-through;
}

.promo-price {
    color: #000;
    font-size: 16px;
    font-weight: bold;
}


section.product-cosmetique.brushing .item .product-item {
    height: 100%;
    position: relative;
    margin: 0 20px;
}

section.product-cosmetique.brushing button.btn-ajouter-brush.shine {
    outline: none;
    border: none;
    background: black;
    color: white;
    font-size: var(--Brand_para_size);
    font-family: "Century-Gothic-Std", "Century Gothic";

    font-weight: 300;
    text-transform: uppercase;
    padding: 6px 0;
    transition: all 2s;
    margin: 0 auto;
    width: 168px;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: auto;
    bottom: inherit;
    left: 15px;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}

/* section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart{position: absolute;
top: 2px;
left: 21px !important;
padding-right:11px;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 25px;
font-size: 13px;
box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
font-family: var(--Brand_title_fonts);
text-align: center;
flex-direction: column} */

section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.product-cosmetique.brushing .item .product-item:hover .fa-regular.fa-heart {
    display: block;
}

/* END product-cosmetique BRUSHING*/
/* start product-cosmetique */
section.product-cosmetique {
    padding: 0 0 20px;
}

section.product-cosmetique .item {
    padding: 0;
    display: table;
    margin: 0 auto;
}

section.product-cosmetique .item .product-item {
    /* height: 400px; */
    position: relative;
}

section.product-cosmetique .item .product-item img {
    height: 100%;
    background-size: cover;
    width: 100%;
}

section.product-cosmetique .item .product-item .item-icons {
    position: absolute;
    bottom: 50px;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    /* display: none; */
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}

section.product-cosmetique .item .product-item .item-icons-left {
    position: absolute;
    bottom: 294px;
    top: 20px;
    right: 0;
    left: 11%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}



section.product-cosmetique .item .product-item .item-icons-left-nouveaute {
    position: absolute;
    bottom: 294px;
    top: 20px;
    right: 0;
    left: 10%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}


@keyframes viewicons {
    0% {
        bottom: 0;
    }

    50% {
        bottom: 20px;
    }

    100% {
        bottom: 50px;
    }
}

section.abonnez-vous .container-fluid .abonnez-vous-slider .item .shine .item-icons {
    display: block;
}

section.abonnez-vous .container-fluid .abonnez-vous-slider .item .shine .item-icons i {
    padding: 20px 25px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}


section.product-cosmetique .item:hover .item-icons {
    display: block;
}

section.product-cosmetique .item:hover .item-icons-left {
    display: block;
}

section.product-cosmetique .item .product-item .item-icons-left-nouveaute i {
    padding: 8px 8px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons i {
    padding: 10px 12px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons-left i {
    padding: 10px 12px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
    margin-left: 10px;
}

section.product-cosmetique .item .product-item .item-icons i:hover {
    color: #acacac;
}

section.product-cosmetique .item .product-item .item-icons-left i:hover {
    color: #acacac;
}

section.product-cosmetique .slick-slider {
    margin: 0 13px;
}

section.product-cosmetique .item .item-desc {
    padding: 18px 32px 17px;
    text-align: center;
}

section.product-cosmetique .item a {
    text-decoration: none;
    color: var(--Heading_color);
}

section.product-cosmetique .item .item-desc h4 {
    font-size: 17px;
}

section.product-cosmetique .item .item-desc p {
    font-size: 17px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 10px;
}

section.product-cosmetique .item .item-desc h5 {
    font-size: 16px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    margin-bottom: 5px;
}

.cont-descriptionn h2 {
    font-size: 27px;
}


section.bloc2-app-btb .content-img img {
    min-width: 100% !important;

}

section.bloc3-app-btb .content-img-left img {
    min-width: 100% !important;

}

section.product-cosmetique .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0px;
    bottom: 0;
    font-weight: 300;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}




/* end product-cosmetique */
/* start section Note  */
section.note {
    padding: 10px 0 0;
    margin: 0 auto;
}


.contentnote {
    max-width: 1140px;
    margin: 0 auto;
    padding: 70px 0px 50px;
}

.contentnote img {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -45px;
    max-width: 85px;
}

.contentnote {
    position: relative;
}

.note_img {
    margin: 0 auto;
    background: #c8c7c7;
    width: 95%;
}

.img-taller {
    /* i should return the to 400px */
    /* height: 400px; */
    height: auto;
    width: auto;
    object-fit: cover;
}

.bloc {
    margin-bottom: 50px;
}

.img-shorter {
    /* height: 250px; */
    width: auto;
    object-fit: cover;
}


section.note h2 {
    font-size: 27px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 49px;
    padding-top: 25px;
    text-align: center;
}

section.note p {
    text-align: center;
    font-size: 14px;
    line-height: 35px;
}

/* END section Note  */
section.creation-coupe .content-img img {
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    min-height: 100%;

}

section.creation-coupe .content-img-guide img {
    z-index: -1;
    position: relative;
    top: inherit;
    max-width: 100%;
    bottom: -60px;
    right: 0;
    display: block;
}

section.creation-coupe .content-img-guide {
    position: relative;
    top: -33px;
}

/* section.creation-coupe .cont-description {
    margin-top: 50px;
} */

section.creation-coupe {
    padding: 10px 20px 10px;
    position: relative;

}

section.creation-coupe .creation-img {
    background: url(../images/coupe-top.jpg) left no-repeat;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    bottom: 10px;
    left: 45%;
    max-width: 870px;
    min-height: 430px;
}

section.creation-coupe .creation-img .content-img {
    width: 310px;
    height: 290px;
    position: absolute;
    bottom: -90px;
    right: 10%;
}

section.creation-coupe .creation-img .content-img img {
    width: 100%;
    height: 100%;
}

.content-encart a.decouvrir {
    font-size: 17px;
    text-decoration: none;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    padding: 15px 15px 15px 0;
    letter-spacing: 0.02rem;
    background: transparent !important;
    background-position: center;
    animation: change 3s linear infinite;
    position: relative;
    font-family: var(--Brand_title_fonts);
    background: transparent !important;
}

.shop_number {
    background: red;
    color: #fff;
    border-radius: 50%;
    width: 13px;
    height: 13px;
    font-size: 9px;
    text-align: center;
    line-height: 14px;
    position: absolute;
    bottom: 9px;
    right: -5px;
}

.fav_number {
    position: absolute;
    top: 2px;
    right: -6px;
    width: 12px;
    height: 12px;
    background: red;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 8px;
    line-height: 18px;
}

.menu_scrol.sticky .fav_number {
    top: 2px;
}

.shop {
    position: relative;
}

.shop_cart {
    max-height: 60vh;
    overflow-y: auto;
    position: absolute;
    background: var(--white-color);
    width: 267px;
    border-radius: 2px;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.13);
    text-align: left;
    z-index: 1;
    right: 0;
    padding: 13px;
    display: none;
    top: 41px;
    right: 0;
    z-index: 9999;
}

/* Pour Chrome, Edge, Safari */
.shop_cart::-webkit-scrollbar {
  width: 8px; /* largeur de la scrollbar */
}

.shop_cart::-webkit-scrollbar-track {
  background: #f1f1f1;  /* fond */
  border-radius: 10px;
}

.shop_cart::-webkit-scrollbar-thumb {
  background: #888;       /* couleur du curseur */
  border-radius: 10px;
}

.shop_cart::-webkit-scrollbar-thumb:hover {
  background: #555;       /* couleur au hover */
}

/* .sticky .shop:hover + .shop_cart {
    top: 60px !important;

}

.shop:hover + .shop_cart {
    top: 99px !important;
    opacity: 1;
    display: block;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
} */

.Cart-Container {
    background-color: #ffffff;
}

.Header {
    display: flex;
    justify-content: space-between;
    align-items: self-start;
}

.Heading {
    font-size: 16px;
    font-weight: 700;
    color: #2F3841;
    margin-bottom: 12px;
}

.ActionRemoveAll {
    font-size: 14px;
    font-weight: 600;
    color: #E44C4C;
    cursor: pointer;
    border-bottom: 1px solid #E44C4C;
}

.Cart-Items {
    margin-top: 8px;
    display: grid;
    grid-column-gap: 13px;
    padding-bottom: 8px;
    grid-template-columns: 50px auto auto;
}

.image-box img {
    max-width: 100%;
}

.image-box {
    margin-right: 8px;
    width: 100%;
}

.title {
    padding-top: 0;
    font-size: 13px;
    font-weight: 600;
    color: #202020;
    margin-bottom: 4px;
}

.counter {
    font-size: 15px;
}

.subtitle {

    font-size: 18px;
    font-family: ‘Open Sans’;
    font-weight: 600;
    color: #909090;
}

hr {
    width: 90%;
    float: right;
    margin-right: 5%;
}

.total {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.Subtotal {
    font-size: 16px;
    font-weight: 700;
    color: #202020;
}

.cart-items {
    font-size: 14px;
    font-weight: 500;
    color: #909090;
}

.total-amount {
    font-size: 17px;
    font-weight: 900;
    color: #202020;
}

.Checkout-button {
    margin-top: 5px;
    width: 75%;
    height: 39px;
    border: none;
    background: black;
    /* border-radius: 20px; */
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    display: table;
    margin: 17px auto 0;
}

.Checkout_delete {
    color: red;
    margin-left: 2px;
}

.counter span {
    margin-right: 2px;
    margin-left: 2px;
}

.counter {
    font-size: 14px;
    font-weight: 600;
    color: #202020;
}

h1.titre-cart {
    font-size: 32px;
    margin-bottom: 50px;
}

h3.titre-2-cart {
    font-size: 25px;
    padding-top: 21px;
}

.btn-2-cart {
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 0;
}

.btn-1-cart {
    padding: 8px 20px;
    font-size: 15px;
    line-height: 19px;
}

.btn-1-cart {
    padding: 8px 20px;
    font-size: 15px;
    line-height: 19px;
}

.img-product-carte {
    max-width: 100px;
}

a.title-product-carte {
    color: #000000;
    text-decoration: none;
    font-size: 17px;
    display: table-cell;
    /* height: 38px; */
    vertical-align: bottom;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

a.close-carte {
    color: #a7a7a7;
    vertical-align: middle;
    height: 39px;
    padding: 5px 10px;
    font-size: 16px;
}

.button-space {
    margin-right: 10px;
}

td {
    padding: 29px 20px !important;
}

td:first-child {
    padding: 29px 0 !important;
}


th.product-name {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-price {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-quantity {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-subtotal {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-remove {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}




.price-product-carte {
    display: table-cell;
    vertical-align: middle;
    /* height: 50px; */
    font-size: 17px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.btn-carte {
    justify-content: space-between;
}

th {
    font-family: "Century-Gothic-Std", "Century Gothic";
}

input#subscribeSrEmailExample1 {
    /* border-top-left-radius: 20px;
    border-bottom-left-radius: 20px; */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 5px 20px;
}

button#subscribeButtonExample2 {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-radius: 0;
    /* border-top-right-radius: 20px;
    border-bottom-right-radius: 20px; */
}

button#subscribeButtoncheckout {
    /* border-radius: 20px; */
}

.total-product-carte {
    display: table-cell;
    vertical-align: middle;
    font-size: 17px;
    height: 50px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.quant-td {
    width: 17%;
}

td.cart_td {
    padding: 29px 30px 28px 0px !important;
}

.th-Subtotal {
    padding: 30px 30px 30px 30px !important;
}

.rounded-lg {
    border-radius: 0.4375rem !important;
}

.bg-gray-1 {
    background-color: #f5f5f5 !important;
}


/* ===============================================
start page nos magasins
=============================================== */
.search-magasin h2 {
    font-size: 20px !important;
    padding-bottom: 0 !important;
    line-height: 15px !important;
    margin-top: 25px;
    margin-left: 0;
    font-family: "grafik";
    font-weight: 700 !important;
}

.form-group {
    margin-bottom: 1rem;
}

select.form-control:not([size]):not([multiple]) {
    /* height: calc(1.25rem + 2px); */
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    color: var(--bs-body-color) !important;
    line-height: 25px;
    padding-bottom: 3px;
    /* margin-bottom: 15px; */
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.informations {
    background: #f3f3f3;
    padding: 15px 30px;
    font-family: "grafik";
}

/* ===============================================
END  page nos magasins


/* ----------------------- START form nos magasins ---------*/
/* ----------------------- -------------------------*/
@-webkit-keyframes slide-in-blurred-left {
    0% {
        -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        -webkit-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0) scaleY(1) scaleX(1);
        transform: translateX(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

@keyframes slide-in-blurred-left {
    0% {
        -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        -webkit-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0) scaleY(1) scaleX(1);
        transform: translateX(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

.custom-checkbox-grey [type=checkbox]:checked~label,
.custom-checkbox-grey [type=checkbox]:checked~span+label,
.custom-checkbox-grey [type=checkbox]:not(:checked)~label,
.custom-checkbox-grey [type=checkbox]:not(:checked)~span+label,
.custom-checkbox-white [type=checkbox]:checked~label,
.custom-checkbox-white [type=checkbox]:checked~span+label,
.custom-checkbox-white [type=checkbox]:not(:checked)~label,
.custom-checkbox-white [type=checkbox]:not(:checked)~span+label {
    font-weight: 400;
    font-style: normal;
    color: #4b4b4b;
    cursor: pointer;
    letter-spacing: .4px;
    font-variant-ligatures: none;
    padding-left: 26px;
    position: relative;
    display: inline-block;
    line-height: 20px;
}

#store-locator .department-filters .options label {
    display: inline-block;
    line-height: 17px;
}

#store-locator .department-filters .options {
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    font-size: 12px;
    display: none;
    border-top: 1px solid #e7e7e7;
}

#store-locator fieldset.search-simple {
    background: #e7e7e7;
    width: 100%;
    padding: 25px 25px;
}

#store-locator label.label {
    font-weight: 600;
    font-style: normal;
    color: #3a3a3a;
    font-size: 13px;
    letter-spacing: 2px;
    font-variant-ligatures: none;

}

#store-locator .department-filters .options>li {
    width: 50%;
}

#store-locator .department-filters .options>li:nth-child(odd) {
    float: left;
    clear: left;
}

#store-locator .icon-toggle:after,
#store-locator .icon-toggle:after {
    font-size: 5px;
    color: #999;
    display: inline-block;
    margin-left: 4px;
    position: relative;
    top: -2px;
    content: "\f10b";
}

.filter-check {
    height: 16px;
    position: absolute;
    opacity: 0;
    pointer-events: none;
    right: 20px;
    top: 16px;
    width: 16px;
    z-index: 10;
}

#store-locator .department-filters .toggle {
    cursor: pointer;
    display: inline-block;
    color: #999;
    background-color: transparent;
    border: 0;

    font-size: 14px;
}

#store-locator .department-filters .close,
#store-locator .department-filters .reset,
#store-locator .department-filters .toggle {
    padding: 20px 15px;
    font-weight: 400;
    font-style: normal;
}

#store-locator .department-filters .close,
#store-locator .department-filters .reset {
    cursor: pointer;
    display: none;
    color: #1b1b1b;
}

.icon-toggle:after,
.icon-toggle:after {
    font-size: 5px;
    color: #999;
    display: inline-block;
    margin-left: 4px;
    position: relative;
    top: -2px;
}

#store-locator .department-filters .active-filters {
    display: none;
}

#store-locator .department-filters.active .options {
    display: block;
}

#store-locator .department-filters .options {
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    font-size: 12px;
    display: none;
    border-top: 1px solid #e7e7e7;
}

#store-locator .department-filters .options {
    background: #fff;
    /* position: relative; */
    left: 0;
    right: 0;
    font-size: 12px;
    /* display: block; */
    border-top: 1px solid #e7e7e7;
}

#store-locator .department-filters .options li {
    display: block;
    padding: 10px 2px;
    border-bottom: 1px solid #e7e7e7;
    min-height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
}

.filter-check {
    height: 16px;
    position: absolute;
    opacity: 0;
    pointer-events: none;
    right: 20px;
    top: 16px;
    width: 16px;
    z-index: 10;
}

.custom-checkbox-grey [type=checkbox]:checked,
.custom-checkbox-grey [type=checkbox]:not(:checked),
.custom-checkbox-white [type=checkbox]:checked,
.custom-checkbox-white [type=checkbox]:not(:checked) {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    pointer-events: none;
}

.custom-checkbox-grey [type=checkbox]:checked~label:before,
.custom-checkbox-grey [type=checkbox]:checked~span~label:before,
.custom-checkbox-grey [type=checkbox]:not(:checked)~label:before,
.custom-checkbox-grey [type=checkbox]:not(:checked)~span~label:before,
.custom-checkbox-white [type=checkbox]:checked~label:before,
.custom-checkbox-white [type=checkbox]:checked~span~label:before,
.custom-checkbox-white [type=checkbox]:not(:checked)~label:before,
.custom-checkbox-white [type=checkbox]:not(:checked)~span~label:before {
    content: "";
    display: block;
    position: absolute;
    background: #f5f5f5;
    height: 16px;
    left: 1px;
    top: 2px;
    width: 16px;
}

h4.content-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-title);
    text-transform: capitalize;
    text-align: left;
    margin-bottom: 12px;
}


p.pera.line-clamp-2 {
    font-size: 14px;
    font-weight: 500;
    color: var(--tertiary-title);
    text-transform: capitalize;
    text-align: left;
}

span.stock-status {
    color: red;
}

fieldset.search-filters-department {
    padding-left: 25px;
}

a.btn.btn-top.btn-border.connexion-card:hover {
    border-color: black;
}

fieldset.search-filters-department span.icon-toggle i {
    font-size: 8px;
}

/* STORE  location nos magasins */
.search-results {
    background: #e7e7e7;
    padding: 25px 25px;
}

.search-results li.store-item {
    background: #f4f4f4;
    padding: 20px;
    margin: 15px 0px;
}

.search-results .store-infos {
    margin-top: -10px;
}

.scroll {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100vh;
    scroll-behavior: auto;
}

ol#stores {
    list-style-type: none;
    padding: 20px;
    margin-bottom: 0;
}

store-item-bg {
    background: #f5f5f5;
    padding: 30px 20px 20px;
}

.store-item .store-item-content,
.store-item .store-item-content {
    padding: 0 0 30px 60px;
    position: relative;
}

.store-item .store-item-content .store-infos .name a,
.store-item .store-item-content .store-infos .name a {
    color: #3a3a3a;
    font-weight: bold;
    font-style: normal;
    font-size: 13px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-item-content .store-position,
.store-item .store-item-content .store-position {
    width: 50px;
    float: left;
    margin: 0 10px 0 0;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
}

.store-item p.address {
    color: #565656;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-item-content .store-infos .email a,
.store-item .store-item-content .store-infos .phone a,
.store-item .store-item-content .store-infos .email a,
.store-item .store-item-content .store-infos .phone a {
    margin: 5px 0 0;
    color: #565656;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-details-toggle,
.store-item .store-details-toggle a {
    border-top: 1px solid #dbd8d6;
    font-style: normal;
    color: #999;
    line-height: 18px;
    font-size: 12px;
    position: relative;
    padding-top: 15px;
    text-decoration: none;
    display: flex;
    justify-content: space-between;

}

.t-hasfindinstore .icon-plus:before,
.t-solrstorefinder .icon-plus:before,
.t-storedetail .icon-plus:before {
    content: '';
    width: 2px;
    height: 10px;
    background-color: #999;
    position: absolute;
    top: 0;
    left: 4px;
}

.t-hasfindinstore .icon-plus:after,
.t-solrstorefinder .icon-plus:after,
.t-storedetail .icon-plus:after {
    content: '';
    width: 10px;
    height: 2px;
    background-color: #999;
    position: absolute;
    left: 0;
    top: 4px;
}

.store-item .store-details,
.store-item .store-details {
    display: none;
}

.store-item .store-item-content:after,
.store-item .store-item-content:before,
.store-item .store-item-content:after,
.store-item .store-item-content:before {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden;
}

/* ----------------------- ENDDD form nos magasins ---------*/

iframe.myMap {
    height: 100%;
    min-height: 102vh;
}

.map {
    position: relative;
    height: 100%;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

a.new_compte {
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 27px 0 0;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
}

a.new_compte:hover {
    border-color: #000;
}

button.connexion {
    text-align: left;
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 44px 0 0;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

button.register {
    text-align: left;
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 2px 0px 20px 0px;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

button.swal2-confirm.swal2-styled {
    background-color: #000 !important;
}

button.swal2-confirm.swal2-styled:hover {
    background-color: #000 !important;
}

button.register:hover {
    border-color: #000;
}

button.connexion:hover {
    border-color: #000;
}

.checkout a {
    text-decoration: none;
}

input.checkout_radio {
    float: left;
    width: 25px;
    height: 25px;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    margin-right: 10px;
    position: relative;
    border: 2px solid #e6e6e6;
    transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

input.checkout_radio:checked {
    border-color: #ce0b2b;
    background-color: #ce0b2b;
}

input.checkout_radio:checked:before {
    opacity: 1;
}

input.checkout_radio:before {
    top: 50%;
    left: 50%;
    opacity: 0;
    color: #ffffff;
    font-size: 14px;
    /* content: ""; */
    font-weight: 400;
    position: absolute;
    transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transform: translate(-50%, -50%);
    font-family: "Font Awesome 5 Pro";
}

label.checkout_radio {
    display: contents !important;
}

button.btn.btn-primary-dark-w.btn-block.btn-pill.font-size-20.mb-3 {
    background: black;
    color: #ffffff;
}

/*************************************************************************************/
/* carrousel logo nos marques */
/* .logo-item {
    background: url(../images/bg-gucci.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-item.dior {
    background: url(../images/bg-dior.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-item.chanel {
    background: url(../images/bg-chanel.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-desc {
    background: #d5b665;
    color: white;
    max-width: 196px;
    text-align: center;
    height: 38px;
    align-items: center;
    padding: 6px 0px;
    margin: 0 auto;
    margin-top: -20px;
    z-index: 5;
    position: relative;
    font-size: 17px;
}
.content-img img {
    width: 100%;
}
.header-marketing-brushing img {
    min-height: 250px;
}
section.content-tabs-brushing .tabsmahassen {font-size: 20px;}
section.creation-coupe .creation-img img {
    width: 100%;
    height: auto;
    position: relative;
    bottom: -70px;
    right: 0;
}
section.collection .desc_collection a.decouvrir:hover,
section.autonome .content-autonome-desc a.decouvrir:hover,
section.maquillage .content-autonome-desc a.decouvrir:hover,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
section.avis-clients a.decouvrir:hover,
section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
.cont-description a.decouvrir:hover {
    background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important;
    background-size: 145px !important;
    transition: 1s all ease-out;
} */

/* Nos collabs */
/* @media screen and (min-width: 1600px)  {
    section.nos-collab {
        padding: 85px 20px 110px 18rem;
        }
    section.hamam .hamam-img .content-img {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }
    section.collection.mah-nouveaute .content-img {
        padding-right: 210px;
        height: 742px;
        width: 100%;
    }
    .sliderTop .slick-prev {

        top: 48%;
        right: -55px;
    }
    .content-img {}

    .content-text2 {}
    .carousel-maquillage button.slick-next.slick-arrow { bottom: -20px;}
    .carousel-maquillage button.slick-prev.slick-arrow { bottom: -20px;}

}

section.nos-collab {
    padding: 85px 20px 47px 140px;
    background: url(../images/bg-collab.jpg)left no-repeat;
    background-size: cover;
    color: white;
    text-align: center;
}
section.nos-collab h2 {
    font-size: var(--Brand_title_size_level_five);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 25px;
    letter-spacing: 0.02rem;
    text-align: center;
}
.collab-item img {
    object-fit: cover;
    max-width: 100%;
    height: 313px;
}
.bonplantarifs-item img {
    object-fit: cover;
    max-width: 100%;
    height: 472px;
    left: 0;
    right: auto;
} */

/* section page bon PLAN */
section.bonplan {
    padding: 50px 35px;
    position: relative;
    margin-right: 30px;
    margin-left: 20px;
    height: 550px;
}

.row.page-checkout {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
}

section.bonplan .fidelite span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: 0;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

section.bonplan .fidelite-bon-plan span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: -154px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

.bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: -154px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}


section.bonplan .content-img {
    width: 82%;
    float: left;
}

section.bonplan .contents-img {
    width: 78%;
    float: left;
}

section.bonPlan-img .content-bonplan h2.title-droite {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: rgb(0, 0, 0);
}


section.bonPlan-img .content-bonplan h2 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: white;
}

section.bonPlan-img .content-bonplan img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.bonPlan-img {
    padding: 50px 35px 50px;
}

section.bonplan .fidelite {
    width: 20%;
    float: right;
}

.bonplantarifs-item img {
    object-fit: cover;
    max-width: 100%;
    height: 272px;
    left: 0;
    right: auto;
    object-position: left;
}

section.bonPlan-img .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

section.bonplan .fidelite span {
    font-size: 30px;
}

section.bonplan .content-img img {
    width: 100%;
    /* min-height: 401px;
    min-width: 447px;
    object-fit: cover; */
}

section.bonplan .contents-img img {
    width: 100%;
    min-height: 470px;
    object-fit: cover;
}


section.bonPlan-img-section-bottom {
    padding: 10px 35px 10px 50px;
}

.bonPlan-img-section-bottom.centre .remise-bonplan {
    left: 45px;
}

.remise-bonplan {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgba(224, 43, 43, 0.8);
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 50%;
    font-weight: bold;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
}

.remise {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgb(99 89 89 / 21%);
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 50%;
    font-weight: bold;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
}

section.bonPlan-img {
    padding: 10px 35px 0px 50px;
}

.custom-row-spacing {
    margin-left: -5px;
    margin-right: -5px;
}

.description-categorie3 {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

.description-note-categorie3 {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

.custom-gap-reduction {
    gap: 5px;
}

.fidelite-one-acceuil {
    margin-top: -250px;
    margin-left: -8rem !important;
}

.fidelite-two-acceuil {
    margin-top: -10px;
    margin-left: -2rem !important;
    /* top: 50px; */
}

.fidelite-two-acceuil {
    font-size: 1.5rem;
    margin-left: 20px;
    display: flex;
    align-items: center;
}


.custom-row-spacing>[class*='col-'] {
    padding-left: 5px;
    padding-right: 5px;
}


section.bonPlan-img-section-bottom .content-bonplan h2 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: rgb(243, 243, 243);
}

section.bonplan .fidelite {
    width: 20%;
    float: right;
}

@media screen and (min-width: 320px) {


    .collab-item img {
        max-width: 100%;
        /* Ensure images do not exceed their container */
        display: block;
        padding-left: 50px;
        padding-right: 50px;
    }

    .content-bonplan {
        position: absolute;
        bottom: 30px;
        padding: 20px 20px;
        z-index: 3;
        display: block;
        width: 100%;
        max-width: 600px;
    }

    .nos-collab {
        text-align: center;
        /* Center align text within the section */
    }

    .collab-slider {
        display: flex;
        justify-content: center;
        /* Center the slider within the container */
    }

    .bonplantarifs-item img {
        object-fit: cover;
        max-width: 100%;
        height: 272px;
        left: 0;
        right: auto;
        object-position: left;
    }

    section.bonPlan-img .remise {
        position: absolute;
        top: 23px;
        right: 27px;
        overflow: hidden;
        height: 50px;
        width: 50px;
        line-height: 19px;
        padding: 15px 4px;
        text-align: center;
        background: red;
        border-radius: 50%;
        color: white;
    }

    section.bonplan .fidelite span {
        font-size: 62px;
    }


    section.bonplan .fidelite-bon-plan span {
        font-size: 62px;
    }


    /* section.bonplan .content-img img {
        width: 100%;
        min-height: 401px;
        object-fit: cover;
    } */

    section.bonplan .contents-img img {
        width: 100%;
        min-height: 470px;
        object-fit: cover;
    }
}

section.bonPlan-img button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    right: 35px;
    width: 50px;
    height: 50px;
    left: inherit;
    bottom: inherit;
    z-index: 2;
}

section.bonPlan-img button.slick-prev.slick-arrow {
    position: absolute;
    top: inherit;
    right: 95px;
    width: 50px;
    height: 50px;
    left: inherit;
    bottom: -50px;
    z-index: 2;
}

section.bonPlan-img .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    font-weight: 300;
    background: url(../images/btnleft.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}

section.bonPlan-img .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/**************END BONPLAN****************/

/********Catalogue****************/


section.catalogBloc {
    padding: 20px 0;
    position: relative;
    text-align: center;
}



section.catalogBloc:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.catalogBloc.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.catalogBloc.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.cont-descriptionn {
    width: 100%;
    margin-top: 40px;
    text-align: center;
}

section.product-cosmetique .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

/* .item .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
} */

section.autonome .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

/********popup search****************/
section.inscrivez-vous.recherche {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #4c4c4ce3;
    z-index: 55;
    display: none;
    padding-top: 47px;
}


.search-container {
    margin-top: 100px;
}

.recherche .content-inscrivez-vous {
    display: block;
    border-color: #eee;
    background-color: #eeeeee69;
    color: #495057;
    position: relative;
    max-width: 930px;
}

.card-forgot-password {
    margin-left: 50px;
    margin-right: 50px;
    margin-top: 100px;
}


section.inscrivez-vous.recherche .inscrivez-vous-description {
    padding: 45px 50px 45px 65px;
}

section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
    position: absolute;
    top: 100px;
    right: 100px;
    padding: 10px;
    background: white;
    color: #0e0e0e;
    transition: opacity 2s;
    cursor: pointer;
    z-index: 1;
}

section.inscrivez-vous.recherche .form-control {
    display: block;
    display: block;
    width: 600px;
    min-height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    height: 50px;
    background-color: #eeeeee69 !important;
    color: #495057;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}




section.inscrivez-vous.recherche .form-control:focus {
    color: #495057;
    border: 1px solid #ced4da;
    background-color: #eeeeee69;
    box-shadow: none;
    border-color: #eee;
    outline: 0;
    box-shadow: none;
    border-bottom: 1px solid #fff;
}

section.inscrivez-vous.recherche input#article_name::placeholder {
    color: #495057;
    text-transform: none;
    font-size: 18px;
}

section.inscrivez-vous.recherche .form-group {
    margin-bottom: 1rem;
    display: flex;
    justify-content: end;
}

section.inscrivez-vous.recherche .has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 22px;
    height: 12px;
    line-height: 59px;
    text-align: right;
    pointer-events: none;
    color: #495057;
    font-size: 21px;
}

section.inscrivez-vous.recherche div#article_list h3 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#historique h5 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#cat_list h3 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#article_list {
    margin-bottom: 8px;
    /* border-bottom: 1px solid #d9d9d9; */
    padding-bottom: 13px;
    margin-right: 26px;
}

section.inscrivez-vous.recherche div#cat_list {
    margin-bottom: 8px;
    /* border-bottom: 1px solid #d9d9d9; */
    padding-bottom: 13px;
    margin-right: 26px;
    padding-right: 58px;
}


section.inscrivez-vous.recherche li.list-group-item a {
    color: var(--bs-list-group-color);
}

/* section.inscrivez-vous.recherche .results {
    background: #fff;
    padding: 0px 20px 30px 28px;
} */
.header-marketing-desc .results {
    background: #fff;
    padding: 30px 20px 30px 28px;
}

/* section.inscrivez-vous.recherche .result-search {
    height: 148px;
    overflow-x: scroll;
} */

.list {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: flex-start;
    align-content: space-around;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: flex-end;
}

h2.main-title {
    color: red;
    padding-bottom: 20px;
}

.result-search::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.result-search::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.result-search::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

section.inscrivez-vous.recherche .list-group-item {
    position: relative;
    /* display: block; */
    padding: 0 0 20 10px;
    color: var(--bs-list-group-color);
    text-decoration: none;
    background-color: transparent;
    border: none;
}

.list-group-item {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
}

section.inscrivez-vous.recherche li.list-group-item a:hover {
    color: #969696;
    transition: 1s all ease-in;
}

.list {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
}

.login-container {
    display: none;
    /* Other styles */
}

/********popup search****************/

/********popup avis****************/

.avis .content-inscrivez-vous {
    display: block;
    /* grid-template-columns: 70% 30%; */
    background: white;
    position: relative;
    gap: 1px;
    width: 600px;
}

.avis .inscrivez-vous-description {
    padding: 43px 31px 35px 35px;
}

.avis textarea#avisdesc {
    width: 333px;
    border: 1px solid #d9d9d9;
    padding: 2px 24px 2px;
    line-height: 24px;
}

.avis textarea#avisdesc::placeholder {
    color: #a6a6a6;
    padding-top: 10px;
    font-size: 15px;
}

section.inscrivez-vous.avis .inscrivez-vous-description h2 {
    font-size: 25px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
    margin-bottom: 28px;
    letter-spacing: 0.02rem;
}

.avis button#send-avis {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 0 17px 0 17px;
    text-align: center;
}

.avis button#send-avis:hover {
    opacity: 0.5;
}

/********popup avis****************/

/********filtre catégorie****************/

.filter fieldset {
    border: none;
}

.filter fieldset>.filter label {
    display: inline-block;
    width: 100px;
    font-weight: bold;
    vertical-align: top;
    font-size: 1rem;
    line-height: 28px;
}

/* .filter fieldset > .filter label::after {
    content: ":";
} */
.filter select,
.filter details {
    display: inline-block;
    width: 250px;
    background-color: white;
    cursor: pointer;
}

.filter select,
.filter summary {
    border: 1px solid var(--lt-gray);
    border-collapse: collapse;
    border-radius: 0;
    padding: 8px 4px 7px;
    width: 220px;
    background-color: #f7f7f7;
    cursor: pointer;
    color: var(--bs-body-color);
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}

.filter summary i {
    font-size: 15px;
    padding-left: 11px;
}

/* .filter details[open] > .filter summary::marker {
    color: var(--blue);
} */

.filter select:focus,
.filter summary:focus,
.filter summary:active {
    box-shadow: 0 0 5px 1px var(--blue);
}

.filter ul {
    list-style: none;
    margin: 0px;
    padding: 14px;
    margin-top: 12px;
    border: 1px solid var(--dk-gray);
    box-shadow: 0 0 5px 1px var(--lt-gray);
    border: 1px solid #e2e2e2;
    overflow-y: scroll;
    height: 200px;
    width: 220px;
    position: absolute;
    z-index: 1;
    background: #fff;
}

.filter ul::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.filter ul::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.filter ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

.filter li {
    margin: 0px;
    padding: 0px;
}

.filter li>.filter label {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

.filter li>.filter label:hover,
.filter li>.filter label:has(input:checked) {
    background-color: var(--dk-gray);
    color: white;
}

.filter input[type="checkbox"] {
    margin-right: 10px;
}

.filter .card {
    border: none;
    margin: 35px 205px 0;
}

.filter .card-footer {
    background: transparent;
    border: none;
    padding: 0;
}

.filter .card-footer button {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    border-radius: 0;
    padding: 8px 39px;
    width: 100%;
}

.filter .card-footer button:hover {
    opacity: 0.5;
}

.filter input[type="checkbox"]:checked {
    accent-color: #000;
}

/* filtre page b2b */
.product-cosmetique fieldset {
    border: none;
}

.product-cosmetique fieldset>.product-cosmetique label {
    display: inline-block;
    width: 100px;
    font-weight: bold;
    vertical-align: top;
    font-size: 1rem;
    line-height: 28px;
}

.product-cosmetique select,
.product-cosmetique details {
    display: inline-block;
    width: 250px;
    background-color: white;
    cursor: pointer;
}

.product-cosmetique select,
.product-cosmetique summary {
    border: 1px solid var(--lt-gray);
    border-collapse: collapse;
    border-radius: 0;
    padding: 8px 4px 7px;
    width: 220px;
    background-color: #f7f7f7;
    cursor: pointer;
    color: var(--bs-body-color);
    font-size: 16px;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}

.product-cosmetique summary i {
    font-size: 15px;
    padding-left: 11px;
}

/* .filter details[open] > .filter summary::marker {
    color: var(--blue);
} */

.product-cosmetique select:focus,
.product-cosmetique summary:focus,
.product-cosmetique summary:active {
    box-shadow: 0 0 5px 1px var(--blue);
}

.product-cosmetique ul {
    list-style: none;
    margin: 0px;
    padding: 14px;
    margin-top: 12px;
    border: 1px solid var(--dk-gray);
    box-shadow: 0 0 5px 1px var(--lt-gray);
    border: 1px solid #e2e2e2;
    overflow-y: scroll;
    height: 200px;
    width: 220px;
    position: absolute;
    z-index: 1;
    background: #fff;
}

.product-cosmetique ul::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.product-cosmetique ul::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.product-cosmetique ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

.product-cosmetique li {
    margin: 0px;
    padding: 0px;
}

.product-cosmetique li>.product-cosmetique label {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

.product-cosmetique li>.product-cosmetique label:hover,
.product-cosmetique li>.product-cosmetique label:has(input:checked) {
    background-color: var(--dk-gray);
    color: white;
}

.product-cosmetique input[type="checkbox"] {
    margin-right: 10px;
}

.product-cosmetique .card {
    border: none;
    margin: 0;
}

.product-cosmetique .card-body {
    margin: 0 39% 45px;
}

.product-cosmetique .card-footer {
    background: transparent;
    border: none;
    padding: 0;
}


.product-cosmetique .card-footer button {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    border-radius: 0;
    padding: 10px 39px;
}

.product-cosmetique .card-footer button:hover {
    opacity: 0.5;
}

.product-cosmetique input[type="checkbox"]:checked {
    accent-color: #000;
}

.item-desc button {
    border: none;
    padding: 7px 70px 5px;
    background: #f5f5f5;
    color: #000000;
    font-size: 17px;
}

.item-desc img {
    /* max-width: 100%; */
}

/* .detail-contact .icons-detail-contact a img {
    margin-right: 60px;
    width: 23px;
} */

.reseaux-mail.d-flex.align-items-center {
    width: 20px;
    margin-right: 16px;
}

.detail-contact {
    display: flex;
    align-items: center;
    margin-top: 20px;
    margin-left: 83px;
}

.bloc-right-contact {
    margin: 0 0 0 100px;
}

.cont-description p {
    margin-bottom: 28px;
}


.cont-description-right p {
    margin-bottom: 28px;
}

.item-descc img {
    padding-right: 10px;
    width: 37px;
}

.detail-socialmedia {
    margin-top: 30px;
    margin-left: 83px;
}

.icons-rs {
    padding: 0 45px;
}

.rs-contact a {
    padding-right: 9px;
}

/*  page no-marques */
section.nos-collab {
    padding: 60px 0 75px;
}

h2.title-collab {
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 28px;
}

section.nos-collab p {
    color: #fff;
    line-height: 35px;
    font-size: 18px;
    text-align: center;
    padding: 0 25%;
    line-height: 28px;
}

section.nos-collab h2 {
    text-align: center;
    color: #fff;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-size: 28px;
}

.logo-item:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffffdb;
    width: 100%;
    height: 100%;
}

.logo-item:after {
    position: absolute;
    content: "";
    left: 10px;
    right: 10px;
    bottom: 10px;
    top: 10px;
    border: 2px solid #000;
}

.logo-item {
    height: 350px;
    width: 350px;
    position: relative;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
}

.img-logo-item {
    position: relative;
}

.logo-desc {
    display: flex;
    margin: -35px 90px 0;
    background: #d5b665;
    z-index: 2;
    position: relative;
    color: #fff;
    text-transform: none;
    padding: 9px 10px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

.logo-desc p {
    margin: 0;
    font-size: 18px;
    line-height: 21px;
}


/* page collection */
.bloc-1-collection {
    padding: 60px 0;
    text-align: center;
    /* Center align the content */
}




.video-bloc2-collection img {
    display: table;
    margin: 0 auto;
    max-width: 100%;
}

.video-bloc2-collection::after {
    position: absolute;
    content: "";
    width: 120px;
    height: 120px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playlive.png);
    cursor: pointer;
    pointer-events: none;
    /* animation: scale 1s linear infinite; */
    border-radius: 50%;
}

.video-bloc2-collection {
    position: relative;
}


.grid-wrapper-colletion>div {
    display: flex;
    justify-content: center;
    align-items: center;
    /* max-width: 100%; */
}

.grid-wrapper-colletion>div>img {
    width: auto;
    height: 100%;
    object-fit: cover;
    border-radius: 0px;
}

.grid-wrapper-colletion {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
    grid-auto-rows: 471px;
    grid-auto-flow: dense;
    /* max-width: 100%; */
}

.grid-wrapper-colletion .wide {
    grid-column: span 2;
}

.grid-wrapper-colletion .tall {
    grid-row: span 2;
}

.grid-wrapper-colletion .big {
    grid-column: span 2;
    grid-row: span 2;
}

.bloc-3-collection {
    padding: 20px 24px;
    /* max-width: 2172px; */
}

.container.adjust-bloc-collection_hiver {
    max-width: 1271px;
}

.title-recommandation {
    text-align: center;
    margin-bottom: 35px;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.img-recommandation {
    display: table;
    margin: 0 auto;
}

.img-recommandation img {
    border: 1px solid #d4d4d4a1;
    padding: 15px;
    max-width: 100%;
}

.bloc-5-collection {
    padding: 40px 0;
    margin-right: 49px;
    margin-left: 20px;
    width: 100%;
}

.bloc-6-collection.actualité {
    padding: 40px 0;
}

.bloc-4-collection {
    padding: 20px 0;
}

.title-bloc5-collection {
    text-align: center;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.abonnez-vous-slider-inspirez-vous img {
    width: auto;
    height: auto;
    max-width: 100%;
    display: block;
}

.date-conseil {
    padding: 14px 0 9px;
    font-size: 14px;
    color: #b0b0b0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.date-conseil i {
    padding-right: 6px;
}


.actualité-blogs .box-blogs.Card .titre-conseil {
    font-size: 23px;
    line-height: 27px;
    text-align: center;
    font-family: Century-Gothic-Std, "Century Gothic";
    font-weight: 600;
}

.actualité-blogs.blogs .box-blogs.Card .titre-conseil {
    line-height: 35px;

}

.actualité-blogs .box-blogs.Card .titre-conseil {
    padding-top: 50px;
    padding-bottom: 30px;
}



.img-recommandation img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.content-conseil {
    font-family: Century-Gothic-Std, "Century Gothic";
    line-height: 31px;
    text-align: justify;
    font-size: 18px !important;
}

.actualité-blogs .box-actualité.Card .btn-box-blogs {
    text-align: center;
    margin-top: 20px;
}

.item-conseil {
    border: 1px solid #d4d4d4a1;
    padding: 20px;
}

.img-conseil img {
    max-width: 100%;
}

.title-anciennescoll {
    text-align: center;
    margin-bottom: 35px;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.title-anciennecoll {
    position: absolute;
    content: "";
    color: #fff;
    text-align: center;
    top: 0;
    margin: 30px auto 0;
    left: 0;
    right: 0;
    font-size: 22px;
    text-transform: uppercase;
    text-shadow: 0 0 30px #fff;
}

.item-anciennecoll {
    position: relative;
}

/* page espace-client */
.header-marketing-desc input.form-control {
    width: 800px;
    margin-top: 35px;
    border: none;
    border-radius: 19px;
    padding: 7px 38px;
    text-transform: none;
}

.page-espace-client {
    padding: 70px 0 40px;
}

.imgItem-espace-client img {
    max-width: 100%;
}

.item-espace-cleint {
    position: relative;
    margin-bottom: 23px;
}

.titleItem-espace-client {
    position: absolute;
    bottom: 0;
    padding: 0px 17px;
    height: 77px;
}

.titleItem-espace-client a {
    color: #fff;
    font-family: var(--Brand_title_fonts);
    font-weight: bold;
    text-transform: uppercase;
    font-size: 22px;
    line-height: 24px;
}

.imgItem-espace-client {
    position: relative;
}

.imgItem-espace-client:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    background: -moz-linear-gradient(left, #0000008c 0%, #ffffff0f 100%);
    background: -webkit-linear-gradient(left, #0000008c 0%, #ffffff0f 100%);
    background: linear-gradient(to right, #0000008c 0%, #ffffff0f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#ffffff', GradientType=1);
}

.sidebar-espace-client {
    border: 1px solid #f2f2f2;
}

.title-espace-client {
    background: #000;
    color: #fff;
    padding: 18px 25px 15px;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 600;
}

.nameprop-espace-client {
    border: 1px solid #f2f2f2;
    padding: 20.8px 23px;
    font-size: 18px;
    font-weight: 600;
}

.nameprop-espace-client a {
    color: var(--Heading_color);
}

.nameprop-espace-client a:hover {
    color: var(--red_color);
}

@media (max-width:1400px) {
    .titleItem-espace-client a {
        font-size: 20px;
        line-height: 21px;
    }

    .titleItem-espace-client {
        height: 90px;
    }
}

@media (max-width:991px) {
    .content-espace-client {
        margin-top: 55px;
    }
}


/* page suivi commande */
.form-suivi-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.form-suivi-commande input[type="number"],
.form-suivi-commande input[type="email"] {
    width: 100%;
    border: 1px solid #c1c1c1;
    padding: 4px 20px;
}

.title-suivi-commande {
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 25px;
}

.groupForm-suivi-commande {
    margin-bottom: 35px;
}

.groupForm-suivi-commande label {
    margin-bottom: 9px;
    color: #8e8e8e;
    text-transform: uppercase;
    font-size: 13px;
}

.btn-suivi-commande {
    display: table;
    margin: 0 auto;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
    color: #fff;
}

.btn-suivi-commande a {
    color: #fff;
}

.btn-suivi-commande:hover {
    /* opacity: 0.5; */
}

.imgmap-suivi-commande {
    width: 324px;
    height: 260px;
}

.position-suivi-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.imgmap-suivi-commande img {
    width: 100%;
    height: 260px;
}

.btn-suivi-commande {
    display: table;
    margin: 0 auto 12px;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
}


@media (max-width:991px) {
    .content-suivi-commande {
        margin-top: 72px;
    }
}

/* page prob commande */
.subtitle-prob-commande {
    text-align: center;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 16px;
}

.title-prob-commande {
    text-align: center;
    font-size: 23px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.form-prob-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.groupForm-prob-commande {
    display: grid;
}

.content-prob-commande input[type="text"],
.content-prob-commande input[type=number],
.content-prob-commande textarea,
.content-prob-commande select {
    width: 600px;
    border: 1px solid #c1c1c1;
    padding: 4px 10px;
}

.groupForm-prob-commande {
    display: grid;
    margin-bottom: 17px;
}

.content-prob-commande label {
    margin-bottom: 7px;
    color: #8e8e8e;
    text-transform: uppercase;
    font-size: 13px;
}

.content-prob-commande select {
    font-size: 15px;
}

.btn-prob-commande {
    display: table;
    margin: 37px auto 0;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
}

.btn-prob-commande a {
    color: #fff;
}

.btn-prob-commande:hover {
    opacity: 0.5;
}

.content-prob-commande input[type="text"]:focus-visible,
.content-prob-commande input[type=number]:focus-visible,
.content-prob-commande textarea:focus-visible,
.content-prob-commande select:focus-visible {
    outline: none;
    box-shadow: 0 0 10px #c1c1c17d;
}


/* page application beauté */
.header-marketing .ban-app {
    top: 50%;
    right: 25%;
}

.logo-app img {
    max-width: 100%;
    width: auto;
}

.name-app {
    color: var(--Heading_color);
    font-size: 16px;
    font-weight: lighter;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
    padding-top: 13px;
    margin-bottom: 48px;
    letter-spacing: 1.5px;
}

.color-content-app {
    color: var(--red_color);
    font-size: 50px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 60px;
}

.btn-app {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    margin: 35px auto 0;
    padding: 12px 0;
}

.btn-app a {
    color: #fff;
}

.btn-app:hover {
    opacity: 0.5;
}

.content-app {
    color: var(--Heading_color);
}

.page-app {
    padding: 50px 35px 20px;
}

.title-bloc1-app {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    text-align: center;
}

.content-bloc1-loyality p {
    font-family: 'Century-Gothic-Std';
    line-height: 26px;
    font-size: 17px;
    padding-left: 30px;
    padding-right: 30px;

}

.content-bloc1-app p {
    margin: 0 0 46px 0;
    font-family: 'Century-Gothic-Std';
    line-height: 26px;
    font-size: 17px;
}


.img-bloc1-app img {
    max-width: 100%;
}

.img-bloc1-application-mahassen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.bloc2-app {
    /* padding: 65px 0 30px; */
    padding: 60px 35px 35px 35px;
    position: relative;
}

.bloc3-app {
    padding: 60px 35px 35px 35px;
    position: relative;
}

.bloc2-app {
    padding: 60px 35px 35px 35px;
    position: relative;
}

.row.app-1 {
    display: flex;
    align-items: center;
}

/* .content-bloc2-app p {
    text-align: center;
} */

.description-detail-actualite {
    text-align: justify;
    padding-left: 50px;
    padding-right: 50px;
}

.title-bloc2-app {
    text-align: justify;
    font-weight: 700;

    font-size: 29px;
    margin-bottom: 17px;
}

.liste-bloc2-app li {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 4px;
}

.product-slider-idees .product-item img {
    /* width: 100%;
    height: auto; */
    /* max-width: 300px;
    max-height: 200%; */
    object-fit: cover;

}

.product-slider-idees .item {
    width: 33.33%;
    padding: 10px;
}

.product-slider-idees {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul.liste-bloc2-app {
    margin-left: 40px;
}

.img-bloc2-app {
    margin: 0 auto;
    display: table;
}



.title-bloc2-app {
    text-align: justify;
    font-weight: 700;
    font-family: 'Century-Gothic-Std';
    font-size: 29px;
    margin-bottom: 17px;
}

.content-bloc2-app {
    margin-left: 20px;
    width: 85%;
    font-family: 'Century-Gothic-Std';
}

.description {
    text-align: justify;
    font-family: 'Century-Gothic-Std' !important;
    font-size: 14px;
    margin-bottom: 17px;
}





.description-bloc1 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.content-bloc1-app {
    /* margin-left: 20px; */
    text-align: justify;
    /* margin-right: 20px; */
}

.custom-image {
    width: 100%;
    /* height: 300px; */
    height: 214px;
    object-fit: cover;
}

.description-bloc5 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

section.coiffure-hom {
    padding: 60px 35px 60px 35px;
    position: relative;
}

section.img-bloc3-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;
}

.bloc2-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc3-app {
    text-align: center;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
}

.content-bloc3-app p {
    text-align: center;
}

section.bloc3-app {
    position: relative;
    padding: 35px 35px 35px 35px;
}

section.bloc3-app .content-img-left img {
    min-width: 100%;
    height: 100%;
}

.bloc3-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.img-bloc4-app img {
    max-width: 100%;
}

.title-bloc8-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.title-bloc4-app {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
}

.description-bloc4 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}

.description_histoire_marque {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 15px;
    margin-bottom: 17px;
}

.description-bloc7 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


.description-bloc8 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


.content-bloc4-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc4-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc7-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc7-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc6-app {
    margin-left: 20px;
    width: 85%;
}


.actualité-blogs .box-blogs.Card .image-box-actualité img {
    max-width: 100%;
}



.btn-box-blogs {
    text-align: center;
    margin-top: 20px;
}

.actualité-blogs .box-blogs.Card {
    box-shadow: rgb(219, 219, 219) 0px 0px 10px;
    background: rgb(255, 255, 255);
    padding: 29px 35px 33px;
    margin: 0px 16px 51px;
}

.content-bloc6-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc8-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc8-app p {
    text-align: justify;
    width: 85%;
}

.btn-bloc4-app {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    display: table;
    margin: 38px auto 0;
    padding: 9px 31px;
}

.btn-bloc4-app a {
    color: #fff;
}

.btn-bloc4-app:hover {
    opacity: 0.5;
}

.bloc4-app {
    padding: 10px 35px 35px 35px !important;
    position: relative;
}

.bloc4-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc5-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}


.img-bloc5-app img {
    max-width: 100%;
}

.img-bloc6-app img {
    max-width: 100%;
}

.bloc5-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc5-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.img-bloc8-app img {
    max-width: 100%;
}

.title-bloc8-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.content-bloc8-app p {
    text-align: justify;
}

.title-bloc6-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.description-bloc8 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.description-bloc6 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.content-bloc8-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc6-app p {
    text-align: justify;
}

.img-bloc6-app {
    display: table;
    margin: 0 auto;
}

.content-bloc6-app {
    margin-left: 20px;
}

.bloc6-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc6-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc7-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.content-bloc7-app p {
    text-align: justify;
}

.content-bloc6-app p {
    text-align: justify;
}

.bloc7-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc7-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.bloc7-app {
    position: relative;
    padding: 33px 0 33px;
}

.img-bloc2-app img {
    max-width: 100%;
}

.content-bloc8-app p {
    margin: 0 20px 0 2px;
    text-align: justify;
}

.img-bloc3-app img {
    max-width: 100%;
}

.bloc8-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}


@media (max-width:991px) {
    .color-content-app {
        font-size: 37px;
    }

    .content-app {
        font-size: 13px;
    }

    .color-content-app {
        font-size: 37px;
    }

    .name-app {
        font-size: 13px;
    }

    .header-marketing .ban-app {
        right: 16%;
    }
}

@media (max-width:767px) {
    .content-bloc2-app {
        margin-left: 0;
    }

    .content-bloc4-app {
        margin-left: 0;
    }

    .content-bloc6-app {
        margin-left: 0;
    }

    .content-bloc8-app {
        margin: 0;
    }
}

.big-content-b2b {
    width: 100%;
}



/* page actualités */


section.actualité {
    padding: 70px 0;
}

.box-actualité {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
    /* height: 915px; */
}

.image-box-actualité {
    display: table;
    margin: 0 auto;
    max-width: 100%;
}

.image-box-actualité img {
    width: 100%;
    height: auto;
}

ol.breadcrumb {

    justify-content: center;
}

.title-box-actualité {
    text-align: justify;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
    font-weight: 500;
    color: #000;
    margin: 23px 0 7px;
    text-align: center;
}

.detail-box-actualité {
    display: flex;
    justify-content: center;
}



.user-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    font-weight: 400;
    margin-right: 31px;
    color: #f33f38;
}

.date-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    font-weight: 400;
    color: #f33f38;
}

.content-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 16px;
    text-align: center;
    padding: 28px 28px 0;
    line-height: 28px;
    font-weight: 400;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.btn-box-actualité a {
    display: table;
    margin: 17px auto 0;
    color: var(--Heading_color);
    font-family: "Century-Gothic-Std", "Century Gothic";
    letter-spacing: 0.02rem;
    position: relative;
    padding-bottom: 4px;
    transition: all .4s;
}

.btn-box-actualité a:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: var(--Heading_color);
    transition: all .4s;
}

.btn-box-actualité a:hover:after {
    background: #f33f38;
}

.btn-box-actualité a:hover {
    color: #f33f38;
}


@media (max-width:1199px) {
    .box-actualité {
        margin: 0 4px;
        padding: 18px 15px 29px;
    }

    .content-box-actualité {
        padding: 28px 17px 0;
    }
}

@media (max-width:991px) {
    .title-box-actualité {
        font-size: 24px;
        margin: 23px 0 13px;
        line-height: 30px;
    }

    .content-box-actualité {
        padding: 28px 10px 0;
    }

    .box-actualité {
        margin: 0 55px 35px;
        padding: 18px 15px 29px;
    }

    .live-slider .box-actualité {
        margin: 0 55px 35px;
        padding: 18px 15px 29px;
    }

    .banner-img {
        overflow: hidden;
        position: relative;
        margin: 0 auto;
        width: 100%;
    }

}

.div_slide_index {
    position: relative;
    height: 100vh;
    width: 100vw;
}

@media (max-width: 500px) {

    .sidebar-logo i,
    .navbar .bx-menu {
        margin-right: 0;
    }

    .slider-wrapper .content {
        position: absolute;
        top: auto;
        bottom: 150px;
        left: 0;
        width: 400px;
        color: #fff;
        right: 0;
        display: table;
        margin: 0 auto;
        text-align: center;
    }
}

@media (max-width: 500px) {
    .slider .slick-dots .animated-dot {
        left: 8%;
    }
}

@media (max-width: 482px) {
    .slider-progress {
        width: 300px;
    }

    .slider .slick-dots .animated-dot {
        left: 11%;
    }
}

.video-hero {
    /* height: 100vh; */
    height: calc(67vh - 48px);
    position: relative;
}

.small-image {
    max-width: 368px;
    max-height: 411px;
}


.small-image-right {
    max-width: 368px;
    max-height: 411px;
}

.maps img {
    width: 26px;
}

div#recherche_prod_cat img {
    width: 14px;
}

.heart {
    position: relative;
}

.user img {
    width: 12px;
}

.shop img {
    width: 12px;
}

.telheader img {
    width: 13px;
    margin-right: 5px;
    margin-top: -3px;
}

.telheader {
    margin-right: 9px;
}

.content-log img {
    width: 185px;
    padding-top: 5px;
}

.header_logo_icons .laguages span {
    font-size: 12px;
}

.item-desc p {
    font-size: 14px;
}

section.footer .footer-content h5 {
    font-size: 17px;
}

div#cart {
    position: relative;
}

.title-left,
.title-right {
    margin-bottom: 52px;
}

.bloc-left-form,
.bloc-right-form {
    padding: 0 60px;
    padding-top: 44px;
}

h1.title-top {
    margin-bottom: 45px;
}

.col-xs-12.col-md-6.px-5.nouveau-client {
    padding-top: 40px;
}

.form-label {
    font-size: 15px;
    padding-bottom: 0px;
}

@media (max-width:1600px) {
    .logo-desc {
        margin: -35px 50px 0;
    }
}

@media (max-width:1366px) {
    section.autonome .content-autonome-desc {
        padding-top: 120px;
    }
}

@media (min-width:1367px) and (max-width:1400px) {
    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }
}

@media (max-width:1400px) {
    section.autonome .content-autonome-desc h2 {
        top: 45px;
    }



    section.autonome .content-autonome-desc h3 {
        padding-left: 30px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 30px; */
    }

    section.collection .desc_collection h2 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 25px;
    }

    section.collection .desc_collection h4 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 25px;
    }
}

section.collection .desc_collection p,
section.autonome .content-autonome-desc p,
section.nouveaute .content-noveaute-desc .contnet-nouveaute p {
    font-size: 15px;
    line-height: 29px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-align: justify;
}

section.maquillage .content-autonome-desc h2 {
    font-size: 27px;
}

section.autonome div#carouselExampleCaptions2 .carousel-caption p,
section.maquillage .content-carousel-maquillage .carousel-caption p,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.maquillage .content-autonome-desc p {
    font-size: 15px;
    line-height: 29px;
}

img.small-image {
    margin-top: 34px;
}

img.small-image-right {
    margin-top: 34px;
}

.marque img.small-image {
    margin-top: 0px;
}

.marque img.small-image-right {
    margin-top: 0px;
}

.content-autonome-desc a.decouvrir {
    margin-top: 19px;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
    font-size: 25px;
}

section.product-cosmetique .item .item-desc p {
    font-size: 16px;
}

section.product-cosmetique .item .item-desc h5 {
    font-size: 16px;
}

section.product-cosmetique .item .item-desc h4 {
    font-size: 16px;
    line-height: 23px;
}

section.mahassen-lives .mahassen-live-desc p {
    margin-bottom: 0;
}

section.avis-clients h2 {
    font-size: 27px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
    font-size: 26px;
}

section.mahassen-lives .mahassen-live-desc h2,
.cont-description h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
}

section.mahassen-lives .mahassen-live-desc h2,
.cont-description-right h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one p {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-align: justify;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button {
    font-size: 13px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description p {

    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description-right p {

    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description-right p {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

section.abonnez-vous h2 {
    font-size: 25px;
}

section.abonnez-vous h5 {
    font-size: 23px;
}

section.newsletter h2 {
    font-size: 25px;
}

section.newsletter span {
    font-size: 23px;
}

section.icons .item-desc h5 {
    font-size: 14px;
}

.item-desc p {
    font-size: 13.5px;
}

section.footer .footer-content h3 {
    font-size: 15.5px;
}

section.maquillage .content-autonome-desc {
    padding-right: 6px;
    margin-left: 80px;
    padding-left: 93px;
    padding-top: 20px;
    margin-top: 0px;
}

/* .container-fluid.adjust-container-section-hammem-spa {
    margin-left: 80px;
} */

section.product-cosmetique .item .item-desc {
    padding: 10px 10px;
}

.item.shine {
    margin-bottom: 20px;
}

.product-cosmetique .card-body {
    margin: 0 34% 45px;
}

/*Bon plan b2b*/


.content-image-bonplan-b2c {
    position: relative !important;
}

.ontent-image-bonplan-b2c img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}


.bonplan-col8,
.bonplan-col4 {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    padding-top: 20px;
}

.content-image-bonplan-b2c-first,
.content-image-bonplan-b2c-second {
    position: relative !important;
    flex: 1 !important;
}

.content-image-bonplan-b2c-first img,
.content-image-bonplan-b2c-second img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
}

.content-bonplan {
    padding: 15px !important;
}



/*End Bon plan b2b*/

.item-desc button {
    font-size: 15px;
    padding: 7px 44px 5px;
}

section.product-cosmetique .item .product-item {
    height: auto;
}

section.product-cosmetique .item .product-item img {
    height: auto;
    background-size: cover;
    width: 100%;
    max-width: 100%;
}

section.product-cosmetique .item .product-item video {
    height: auto;
    background-size: cover;
    width: 100%;
    max-width: 100%;
}

.logo-desc {
    margin: -35px 32px 0;
}

.logo-item {
    height: 320px;
    width: 100%;
}


@media (max-width:1300px) {
    section.maquillage .content-autonome-desc h2 {
        font-size: 26px;
    }
}

@media (max-width:1200px) {
    section.autonome .content-autonome-desc h2 {
        padding-left: 150px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 80px;
        margin-left: 30px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 21px;
    }

    .bottom-desc-img img {
        max-width: 100%;
    }

    .title-right,
    .title-left {
        font-size: 20px;
        margin-bottom: 40px;
    }

    .form-label {
        font-size: 15px;
    }

    .title-top {
        font-size: 35px;
        margin-bottom: 50px;
    }

    .logo-item {
        height: 280px;
        width: 100%;
    }
}

@media (max-width:1199px) {
    .content_slider .carousel-caption h1 {
        font-size: 28px;
    }

    .content_slider .carousel-caption p {
        font-size: 15px;
        max-width: 600px;
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 270px;
    }

    .filter select,
    .filter summary {
        width: 136px;
        font-size: 15px;
    }

    section.product-cosmetique h2 {
        font-size: 26px;
    }

    .cont-description {
        width: 100%;
    }

    .form-label {
        font-size: 14px;
    }

    .title-right,
    .title-left {
        font-size: 19px;
        margin-bottom: 40px;
    }

    .logo-item {
        height: 280px;
        max-width: 350px;
    }

    .logo-desc {
        margin: -35px 50px 0;
    }

    .titre-conseil {
        font-size: 19px;
        line-height: 23px;
        height: 85px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item {
        padding: 0 15px;
    }

    .carousel-caption {
        bottom: 0;
        left: 0;
        position: relative;
    }

    .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -50px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -50px;
    }

    section.collection .desc_collection .spa.maquillage {
        height: 90px;
    }

    .mah-nouveaute .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: 35px;
    }

    .mah-nouveaute .carousel-maquillage button.slick-next.slick-arrow {
        bottom: 35px;
    }

    section.esthetique-home p {
        font-size: 15px;
    }

    section.esthetique-home h2 {
        font-size: 35px;
    }

    section.esthetique-home h3 {
        font-size: 29px;
    }

    td.cart_td {
        padding: 29px 10px 28px 0px !important;
    }
}

@media (max-width:991px) {
    section.inscrivez-vous .inscrivez-vous-description {
        padding: 45px 30px 45px 28px;
    }

    section.inscrivez-vous .inscrivez-vous-description h2 {
        font-size: 19px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        font-size: 15px;
        line-height: 22px;
    }


    section.maquillage .content-autonome-desc {
        margin-top: 132px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 637px !important;
    }

    .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -45px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -45px;
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 0;
    }

    .content_slider .carousel-caption p {
        max-width: 500px;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 35px;
    }

    nav .navbar .links li .sub-menu .nav-n1 {
        display: block;
        margin: 10px 0 0 20px;
    }

    nav .navbar .links li .sub-menu .nav-n1 h4 {
        font-size: 14.5px;
        margin-bottom: 7px;
        margin-top: 19px;
    }

    .navbar .links li .sub-menu a {
        font-size: 13.5px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
        padding: 11px 11px 8px;
        font-size: 10px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
        white-space: initial;
        line-height: 20px;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
        display: block;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
        max-width: 100%;
        height: auto;
        margin-bottom: 0;
        margin-top: 15px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
        position: relative;
        right: 0;
        top: 0;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 25px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 18px;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        margin: 145px auto 0;
    }

    section.collection.mah-nouveaute.maquillage .contents-img {
        margin: 145px auto 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner {
        overflow: visible;
    }

    section.product-cosmetique.maquillage {
        padding-top: 33px;
        padding-bottom: 10px;
        background: white;
        margin-top: 15px !important;
    }

    section.collection .desc_collection .spa img {
        width: 600px;
        height: auto;
        margin: 0 auto;
        display: table;
    }

    section.product-cosmetique .item .product-item {
        height: auto;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item {
        padding: 0 10px;
    }

    .carousel-maquillage.slick-initialized.slick-slider .carousel-caption {
        bottom: -12px;
        left: 0;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 15px;
    }

    .filter .card {
        margin: 35px 72px 0;
    }

    .collab-item {
        padding: 0 20px;
    }

    section.product-cosmetique h2 {
        font-size: 26px;
    }

    .content-img.brochure img {
        width: 400px;
        max-width: none;
    }

    .content-img img {
        width: 370px;
        max-width: none;
    }

    .massage.coiffure .row {
        display: flex;
        flex-direction: column-reverse;
    }

    .cont-description-right {
        margin-top: 50px;
    }

    .coiffure-hom .row {
        display: flex;
        flex-direction: column;
    }

    .coiffure-hom .col-md-6 {
        width: 100%;
        margin-top: 0;
    }

    .massage.coiffure .col-md-6 {
        width: 100%;
    }

    .massage.coiffure .col-md-6.order-md-2 {
        order: 1;
    }

    section.coiffure-hom {
        padding: 10px 35px 35px 35px;
        position: relative;
    }

    section.massage {
        padding: 35px 35px;
        position: relative;
    }

    .massage.coiffure .col-md-6.order-md-1 {
        order: 2;
    }

    section.forfait-homme h2 {
        font-size: 30px;
    }

    .content-encart a.decouvrir {
        font-size: 17px;
    }

    section.forfait-homme h2 {
        font-size: 35px;
    }

    .content-encart a.decouvrir {
        font-size: 17px;
    }

    .cont-forfait h4 {
        font-size: 20px;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 26px;
    }

    .bloc-right-contact {
        margin: 0 90px;
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 20px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        left: 48px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        /* top: 0px; */
    }

    .product-cosmetique .card-body {
        margin: 0 28% 45px;
    }

    .shop_cart {
        right: -125px;
    }

    .bloc-left-form,
    .bloc-right-form {
        padding: 40px 30px;
    }

    .fidelite-bon-plan {
        font-size: 1.5rem;
        margin-left: 20px;
        display: flex;
        align-items: center;
        height: 573.05px !important;
        /* top: 50px; */
    }

    .fidelite-bon-plan {
        /* margin-top: -138px; */
        margin-left: -8rem !important;
        top: 50px;
    }

    section.bonplan .fidelite-bon-plan {
        width: 20%;
        float: right;
    }

    .card-forgot-password {
        max-width: 75%;
    }

    .forgot-password-logo {
        padding: 40px;
    }

    .logo-desc {
        margin: -35px 101px 0;
    }

    .title-bloc1-collection {
        margin: 0 30px 10px;
        font-size: 17px;
    }

    .description-detail-actualite {
        text-align: justify;
        padding: 0px;
    }

    .title-recommandation {
        font-size: 28px;
    }

    .slider__counter {
        font-size: 2rem;
    }

    .logo-desc {
        margin: -35px 247px 0;
    }

    .item-anciennecoll {
        display: table;
        margin: 0 auto 20px;
    }

    .quant-td {
        width: 23%;
    }

}

@media (max-width:767px) {

    section.mahassen-lives button.slick-prev.slick-arrow,
    section.mahassen-lives button.slick-next.slick-arrow {
        bottom: 0px;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        margin: 0px auto 0;
    }

    section.collection.mah-nouveaute.maquillage {
        padding: 50px 37px 30px;
    }

    section.lamarque {
        padding: 0px 35px;
        /* margin-top: 65px; */
    }

    .filter li label {
        font-size: 14px;
    }

    .sliderTop .slick-prev:before {
        bottom: 0;
        left: 97px;
        width: 58px;
    }

    section.maquillage div#carouselExampleCaptions3 {
        height: 600px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        transform: translateX(0%);
    }

    section.avis-clients h2 {
        margin-bottom: 50px;
    }

    .slider__counter {
        bottom: -3px;
        left: auto;
        right: 5rem;
    }

    section.esthetique-home h3 {
        font-size: 27px;
    }

    section.collection.mah-nouveaute .desc_collection {
        padding: 50px 0 169px;
    }

    .content-img.brochure img {
        top: 35px;
    }

    .contents-img.brochure img {
        top: 35px;
    }

    .item-conseil {
        margin-bottom: 20px;
    }

    .product-cosmetique select,
    .product-cosmetique summary {
        width: 100%;
    }

    .product-cosmetique select,
    .product-cosmetique details {
        width: 100%;
        display: table;
        margin: 0 auto 10px;
    }

    .quant-td {
        width: 30%;
    }

    th.product-name {
        padding-bottom: 8px;
    }
}

@media (max-width:729px) {
    .sliderTop .slick-prev:before {
        left: 75px;
    }

    .logo-desc {
        margin: -35px 146px 0;
    }
}

@media (min-width:501px) and (max-width:767px) {
    .politique h3.titre-plitique {
        margin-bottom: 25px;
    }

}

@media (max-width:500px) {
    .header-marketing .header-marketing-desc h1 {
        font-size: 20px !important;
        padding-top: 10px;

    }

    .politique h3.titre-plitique {
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 25px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 16px;
        width: 80%;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 27px;
    }

    section.collection .desc_collection .spa img {
        width: 100%;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 26px;
    }

    section.product-cosmetique.recomd .product-slider.slick-initialized.slick-slider .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        left: -18px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }



    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        left: 6px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 6px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    .header_logo_icons .header_icons {
        margin-top: 18px;
    }

    section.collection .desc_collection h2 {
        font-size: 24px;
    }

    section.collection .desc_collection h4 {
        font-size: 24px;
    }

    section.idees .item .item-desc h4 {
        font-size: 21px;
    }

    section.idees .item .item-desc p {
        font-size: 15px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 64px;
        margin-left: 0px;
    }

    section.lamarque .slick-prev:before {
        bottom: 24px;
    }

    section.lamarque .slick-next:before {
        bottom: 24px;
    }

    section.abonnez-vous h2 {
        font-size: 22px;
        margin-bottom: 12px;
    }

    section.newsletter h2 {
        font-size: 22px;
    }

    section.newsletter span {
        font-size: 21px;
    }

    section.abonnez-vous h5 {
        font-size: 21px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 61px auto 89px;
        height: 520px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 24px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 30px;
        font-size: 45px;
    }

    .content-log img {
        width: 188px;
        padding-top: 0;
    }

    .sliderTop .slick-prev:before {
        left: 23px;
    }

    section.maquillage .content-autonome-desc h2 {
        font-size: 25px;
        margin-top: 50px;
        font-weight: 400;

    }

    section.product-cosmetique .item {
        padding: 0px 8px;
    }

    section.idees h2 {
        font-size: 27px;
        margin-bottom: 20px;
    }

    /* .fidelite-mahassen .carte-mahassen .content-carte-mahassen.carte-two {
        height: 650px;
    } */

    section.collection.mah-nouveaute .desc_collection {
        padding: 50px 0 0px;
    }

    .filter select,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter .card-footer button {
        padding: 8px 103px;
    }

    .filter select,
    .filter details {
        display: table;
        margin: 0 auto;
    }

    .logo-desc {
        margin: -35px 103px 0;
    }

    section.nos-collab p {
        padding: 0 4%;
        line-height: 25px;
        font-size: 16px;
    }

    .title-anciennescoll {
        margin-bottom: 24px;
        font-size: 26px;
        line-height: 30px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 15px;
    }

    .item-desc button {
        padding: 7px 33px 5px;
    }

    a.title-product-carte {
        font-size: 15px;
        line-height: 18px;
    }

    .price-product-carte {
        font-size: 15px;
    }

    .quant-td {
        width: 27%;
    }

    .rounded-circle.faplus {
        padding: 0;
    }

    .rounded-circle.faminus {
        padding: 5px;
    }


}

@media (max-width:482px) {
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 62px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        font-size: 47px;
    }

    section.newsletter h2 {
        font-size: 24px;
    }

    section.idees h2 {
        font-size: 26px;
    }

    section.massage {
        padding: 0 0 103px;
    }

    section.massage {
        padding: 0 0 0;
    }

    section.massage .content-img {
        margin-bottom: 0;
    }

    section.massage .content-img {
        height: 300px;
    }

    section.massage .contents-img {
        margin-bottom: 0;
    }

    section.massage .contents-img {
        height: 300px;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2 {
        font-size: 24px;
        line-height: 32px;

    }
}

@media (max-width:395px) {
    .header-marketing .header-marketing-desc h1 {
        font-size: 22px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 15px;
    }

    section.collection .desc_collection h2 {
        font-size: 25px;
    }

    section.collection .desc_collection h4 {
        font-size: 25px;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 21px;
    }

    .product-item .new {
        padding: 6px 13px;
    }

    section.product-cosmetique .remise {
        right: 14px;
        height: 44px;
        width: 44px;
    }

    section.idees h2 {
        font-size: 21px;
    }

    section.mahassen-lives .mahassen-live-desc h2 {
        font-size: 21px;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-top: 25px;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        font-size: 15px;
    }

    section.abonnez-vous h2 {
        font-size: 21px;
    }

    section.abonnez-vous h5 {
        font-size: 17px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        font-size: 32px;
    }

    .content-log img {
        width: 170px;
    }

    .header_logo_icons .mahassen-live span:first-of-type {
        font-size: 14px;
    }

    .content-log img {
        width: 165px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 46px;
    }

    section.newsletter span {
        font-size: 18px;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 30px 21px 30px 21px;
    }

    section.inscrivez-vous .inscrivez-vous-description h2 {
        font-size: 17px;
        margin-bottom: 12px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        line-height: 19px;
        margin: 0 0 18px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
        font-size: 13px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:last-of-type {
        margin: 0 0 10px;
        line-height: 20px;
    }

    .inscrivez-vous-img {
        padding-top: 0;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        margin-bottom: 19px;
    }

    .sliderTop .slick-prev:before {
        left: -7px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 25px !important;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 30px;
    }

    section.maquillage .content-autonome-desc h2 {
        font-size: 25px !important;
    }

    section.avis-clients h2 {
        font-size: 23px;
    }

    section.newsletter h2 {
        font-size: 20px;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2 {
        font-size: 24px;
    }

    section.esthetique-home h2 {
        font-size: 28px;
    }

    .filter .card {
        margin: 35px 0 0;
    }

    section.product-cosmetique h2 {
        font-size: 22px;
    }

    .select_wrap select {
        margin-bottom: 11px;
    }

    .fond-de-tient-description button.btn-ajouter.ajouter {
        max-width: 257px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 16px;
    }

    .logo-desc {
        margin: -26px 24px 0;
    }

    section.nos-collab p {
        padding: 0 10%;
    }

    .content-img.brochure img {
        width: 265px;
    }

    .contents-img.brochure img {
        width: 265px;
    }

    section.forfait-homme h2 {
        font-size: 30px;
    }

    .content-img img {
        width: 100%;
    }

    .contents-img img {
        width: 100%;
    }

    .box-actualité {
        margin: 0 0 35px;
    }

    .content-bloc1-collection {
        padding: 0 0 40px;
    }

    .grid-wrapper-colletion {
        display: block;
    }

    .grid-wrapper-colletion>div>img {
        margin-bottom: 10px;
    }

    .title-anciennescoll {
        font-size: 23px;
    }

    .img-anciennecoll img {
        max-width: 100%;
    }

    .title-bloc5-collection {
        font-size: 27px;
    }

    .title-recommandation {
        font-size: 27px;
    }

    .product-cosmetique .card-body {
        margin: 0 0px 45px;
    }

    .bloc-right-contact {
        margin: 0 25px;
    }

    .shop_cart {
        right: -58px;
    }

    .title-top {
        font-size: 32px;
    }

    h1.title-top {
        margin-bottom: 25px;
    }

    .title-right,
    .title-left {
        font-size: 17px;
    }

    section.inscrivez-vous.recherche .inscrivez-vous-description {
        padding: 45px 0px 45px 0;
    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        right: 36px;
    }

    #cart-block .input-group {
        width: 85%;
    }

    th.product-thumbnail {
        display: none;
    }

    .rounded-circle.faplus {
        padding: 0;
    }

    .rounded-circle.faminus {
        padding: 2px;
    }

    .quant-td {
        width: 32%;
    }
}





.select-box {
    position: relative;
    display: block;
    width: 13%;
    font-size: 15px;
    color: #60666d;
}

.select-box__current {
    position: relative;
    cursor: pointer;
    outline: none;
    width: 170px;
}

.select-box__current:focus+.select-box__list {
    opacity: 1;
    -webkit-animation-name: none;
    animation-name: none;
}

.select-box__current:focus+.select-box__list .select-box__option {
    cursor: pointer;
}

.select-box__current:focus .select-box__icon {
    transform: translateY(-50%) rotate(180deg);
}

.select-box__icon {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    width: 11px !important;
    opacity: 1;
    transition: 0.2s ease;
    color: #000;
}

.select-box__value {
    display: flex;
}

.select-box__input {
    display: none;
}

.select-box__input:checked+.select-box__input-text {
    display: block;
}

.select-box__input-text {
    display: none;
    width: 100%;
    margin: 0;
    padding: 6px 15px;
    background-color: #f8f8f8;
    font-size: 15px !important;
}

.select-box__list {
    position: absolute;
    width: 100%;
    padding: 0;
    list-style: none;
    opacity: 0;
    -webkit-animation-name: HideList;
    animation-name: HideList;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
}

.select-box__option {
    display: block;
    padding: 8px 15px;
    background-color: #fff;
    font-size: 14px;
    color: #000;
    position: relative;
    z-index: 3;
}

.select-box__option:hover,
.select-box__option:focus {
    color: #000;
    background-color: #f8f8f8;
}

@-webkit-keyframes HideList {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

@keyframes HideList {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

.couleur-select {
    display: flex;
    margin-bottom: 19px;
}

span.select-title {
    font-size: 14px;
    padding: 0 12px 0 0;
}


@media (max-width:1600px) {
    .select-box {
        width: 18%;
    }
}

@media (max-width: 1200px) {
    .select-box {
        width: 21%;
    }
}

@media (max-width: 1199px) {
    .fond-de-tient-description button.btn-ajouter.ajouter {
        max-width: 257px;
    }

    /*
    .small-image {
        max-width: 868px;
        max-height: 411px;
    } */

    img.small-image {
        margin-top: 120px;
    }

    img.small-image-right {
        margin-top: 120px;
    }

    .marque img.small-image {
        margin-top: 0px !important;
    }

    .marque img.small-image-right {
        margin-top: 0px !important;
    }

    .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
        display: none;
    }
}

@media (max-width: 991px) {
    .select-box {
        width: 12%;
    }
}

@media (max-width: 767px) {
    .select-box {
        width: 15%;
    }
}

@media (max-width: 600px) {
    .select-box {
        width: 19%;
    }
}

@media (max-width: 395px) {
    .select-box {
        width: 36%;
    }
}

div#cart-block form h4 {
    margin-bottom: 30px;
}

form label {
    padding-bottom: 7px;
    font-size: 15px;
}

h1.titre-chekout {
    font-size: 30px;
}

h3.titre-2-chekout {
    font-size: 24px;
}

/*****************************************************************/

/*****************Footer********************/
section.footer button {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 1em;
    background: #D80015;
    color: #ffffff;
    cursor: pointer;
    opacity: 1;
    outline: none;
    transition: opacity 0.35s ease-out, width 0.5s ease-out, background 0.25s ease-out;
    height: 40px;
    font-family: 'FoundersGrotesk';
    margin-top: 12px;
}

section.footer input::placeholder {
    font-size: 13px;
    padding-left: 4px;
}

section.footer form {
    position: relative;
    width: 282px;
}

section.footer input {
    height: 40px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0 7px;
    border: 1px solid #fff;
    color: #fff;
}

section.footer a {
    text-decoration: none;
    color: white;
}

.color-noir {
    color: black;
}


.footer-icons {
    position: fixed;
    bottom: 5%;
    right: 5px;
    z-index: 10;
    margin-bottom: 1px;
    margin-right: 0;
    display: block;
}

.footer-icons a {
    position: relative;
    margin-left: 0;
    display: block;
    color: #f33f38 !important;
    font-size: 24px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
}

.footer-icons a.messanger {

    color: #0e94c9 !important;
    margin-bottom: 2px;
}

.footer-icons a.whatsup {
    /* background: #25D366; */
    color: #25D366 !important;
}


/***********************************************************************************/

.nav-pageCategorie .active>.page-link,
.page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color) !important;
    background-color: #e2c7ca;
    border-color: transparent;
    border-radius: 0px;
    border: 1px solid #6f6f6f;
    color: black;
}

.nav-pageCategorie .page-item:last-child .page-link {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.nav-pageCategorie nav {
    margin: 0 auto;
    display: block;
    /* width: 168px; */
}

.nav-pageCategorie a.page-link {
    color: black;
    margin: 0 10px;
    background-color: transparent;
}

.nav-pageCategorie .page-item:first-child .page-link {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.nav-pageCategorie .page-link:focus {
    z-index: 3;
    color: var(--bs-pagination-focus-color);
    background-color: transparent;
    outline: 0;
    box-shadow: none;
}





.product-detail-color input[type=radio] {
    display: none;
}

.product-detail-color {
    margin-bottom: 16px;
}

.product-detail-color label {
    display: inline-block;
    width: 28px;
    height: 28px;
    margin-right: 5px;
    cursor: pointer;
    position: relative;
}

.product-detail-color label:after {
    position: absolute;
    content: "";
    left: -4px;
    right: 0;
    bottom: -4px;
    border: 2px solid transparent;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    line-height: 42px;
    margin: auto;
    opacity: 0;
}

.product-detail-color input[type="radio"]:checked+label:after {
    opacity: 1;
    border: 2px solid #000;
}

.product-detail-color label span {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: transform 0.2s ease-in-out;
}


/* start page nos marque */
.col-xl-3.col-lg-4.col-md-6.col-sm-12.nos-marque {
    padding-top: 25px;
    padding-bottom: 25px;
}

.row.nos-marque {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 50px;
    padding-right: 20px;
    padding-left: 20px;
}


.logo-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

/* End page nos marque */




.select-product-detail {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 11px;
}

div.selector-area {
    box-sizing: border-box;
    padding: 10px 0;
    position: relative;
}

label.selector {
    box-sizing: border-box;
    display: block;
    padding: 13px 11px;
    width: 100%;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.5px;
    border: 1px solid #f3f2f2;
    color: #6c6c6c;
}

.option-show-value:after {
    position: absolute;
    display: block;
    content: "";
    width: 7px;
    height: 7px;
    top: 64px;
    right: 5%;
    border-bottom: 2px solid #6c6c6c;
    border-right: 2px solid #6c6c6c;
    border-radius: 1px;
    transform: rotate(45deg) translateY(-50%);
    transition: all 0.3s ease-in-out;
    transition-delay: 0.1s;
    transform-origin: 50% 0;
}

input.selector:checked+label.selector>.option-show-value:after {
    transform: rotate(-135deg) translateY(-50%) !important;
}

input.selector,
input.selector~.option-list {
    display: none;
}

input.selector:checked~.option-list {
    width: 100%;
    position: absolute;
    display: block;
    margin-top: 5px;
    background: #fff;
    z-index: 2;
    border: 1px solid #f3f2f2;
}

ul.option-list,
li.option {
    list-style: none;
    padding: 0;
}

li.option>label {
    display: block;
    padding: 9px 11px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.5px;
    color: #6c6c6c;
}

li.option:hover>label {
    background: rgba(255, 255, 255, .7);
    color: #000;
}

input.option-value,
span.option-show-value {
    display: none;
}

input.option-value:checked+.option-show-value {
    display: initial;
    vertical-align: middle;
}

.rs-connexion {
    display: table;
    margin: 23px auto 0;
}

.btn-fcb {
    color: #3b5998;
    background-image: linear-gradient(to bottom, transparent 20%, white 20%, white 93%, transparent 93%);
    font-size: 30px;
    padding: 0;
    border: 1px solid #bcbbbb;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    line-height: 45px;
    margin-right: 20px;
}

.btn-fcb:hover {
    color: #3b5998;
    background-image: linear-gradient(to bottom, transparent 20%, white 20%, white 93%, transparent 93%);
    border: 1px solid #bcbbbb;
}

.btn-google {
    background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    font-size: 35px;
    padding: 0;
    /* border: 1px solid #bcbbbb; */
    border-radius: 50%;
    width: 45px;
    height: 45px;
    line-height: 45px;
}

/* .btn-google:hover {
    border: 1px solid #bcbbbb;
} */

a.btn.btn-top.btn-fcb {
    font-size: 37.5px !important;
    color: none;
}

.cart-vide {
    display: table;
    margin: 0 auto;
    padding: 50px 0;
    text-align: center;
}

.icon-cart-vide i {
    font-size: 30px;
    font-weight: 300;
    padding-bottom: 20px;
}

.cart-vide h3 {
    font-size: 30px;
    padding-bottom: 11px;
}

a.btn-panier-vide {
    background: #000;
    color: #fff;
    padding: 10px 30px;
    text-transform: uppercase;
    font-size: 13px;
    display: table;
    margin: 32px auto 0;
}

.shipping-cart {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-right: 25px;
    margin-top: 25px;
}

.shipping-cart-left {
    display: flex;
    gap: 20px;
}

.title-shipping-cart {
    font-size: 14px;
    text-transform: uppercase;
    color: #818181;
}

.contenu-shipping-cart p {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 11px;
}

.ref-shipping-cart {
    font-size: 14px;
    color: #b1b1b1;
}

.prix-shipping-cart span {
    display: block;
    color: #f00;
}

.prix-shipping-cart {
    font-size: 14px;
    font-weight: 500;
    text-align: right;
}

.btns-shipping-cart {
    text-align: right;
    margin-top: 12px;
    margin-right: 25px;
}

.btns-shipping-cart a {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    margin-left: 40px;
}

.selector-titre {
    padding-bottom: 8px;
    font-size: 15px;
}

.stars .fa-star {
    color: #c4c4c4;
    font-size: 13px;
}

.stars .fa-star.gold {
    color: #ffc200;
}

.border-top.chechkout {
    border-top: none !important;
}

.condition-utilisation {
    text-align: justify;
}

.email-container {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #dddddd;
}

.header {
    text-align: center;
}

.gift-card-image {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

.content {
    margin: 20px 0;
}

.footer {
    margin-top: 20px;
    font-size: 12px;
    color: #888888;
    text-align: left;
}


.border-bottom.chechkout {
    border-top: none !important;
}



.gal-img-2 img {
    width: 100% !important;
}

.gal-img2-two {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
}

.description-application {
    font-size: 15px;
    line-height: 29px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

p.MsoNormal {
    font-size: 15px;
    line-height: 29px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.bloc2-app .content-img-application-one {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc2-app .content-img-application-one {
    text-align: center;
    width: 100%;
    object-fit: cover;

}

.content-img-application-one {
    flex: 0 0 auto;
    width: 100px;
    margin-right: 20px;
}

.gal-img2-one {
    margin-bottom: 20px;
}

.gal-img2-three {
    margin-top: 20px;
}

.form-connexion .form-control {
    border: 1px solid #e2e2e2;
    padding: 8px 12px;
    margin-bottom: 14px !important;
}

div#cart-block .title-right {
    margin-bottom: 23px;
}

.field-mail {
    margin: 24px 0 29px;
}

section.footer p {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}




.img-app {
    margin-top: 16px;
    margin-bottom: 20px;
}

p.content-qrq {
    text-align: center;
}

.rating-review {
    display: inline-block;
    margin-bottom: 19px;
}

.star-review {
    float: left;
}

.star-review label {
    color: #c4c4c4;
    font-size: 7px;
    display: inline-block;
    float: right;
}

.form-avis {
    text-align: left;
    margin-top: 40px;
}

.star-review label:before {
    margin: 5px;
    font-size: 2em;
    font-family: FontAwesome;
    content: "\f005";
    display: inline-block;
}

.star-review input {
    display: none;
}

.star-review input:checked+label:hover,
.star-review input:checked~label:hover,
.star-review label:hover~input:checked~label,
.star-review input:checked~label:hover~label {
    color: #ffc200;
}

.star-review input:checked~label,
.star-review:not(:checked) label:hover,
.star-review:not(:checked) label:hover~label {
    color: #ffc200;
}

.rating-review span {
    display: block;
    font-size: 14px;
    padding-bottom: 3px;
}


.input_commentaire {
    border: 1px solid var(--c-grey-200);
    border-radius: 0 !important;
    height: 102px !important;
    padding: 7px 12px !important;
    width: 100%;
}

.btn-avis button {
    border: none;
    border-radius: 0;
    text-transform: uppercase;
    padding: 9px 23px;
    margin-top: 25px;
    font-size: 14px;
}

.title-avis {
    font-weight: 700;
    margin-bottom: 20px;
}

.comment-avis label {
    padding-bottom: 9px;
    font-size: 14px;
}

.input_commentaire:focus-visible {
    outline: none;
}

.timeline-item-wrapper {
    border: 1px solid var(--c-grey-200);
    padding: 25px;
    display: flex;
    gap: 14px;
}

.content-timeline {
    width: 100%;
}

.star-timeline i.gold {
    color: #ffc200;
}

.star-timeline i {
    font-size: 13px;
    color: #c4c4c4;
}

.descrp-timeline {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--c-grey-200);
    padding-bottom: 9px;
}

.img-qrq {
    display: table;
    margin: 0 auto 13px;
}

section.politique {
    padding: 100px 100px 20px;
}

h3.titre-plitique {
    font-weight: 400;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    font-size: 25px;
    text-align: center;
    margin-bottom: 50px;
}

section.politique p {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    line-height: 27px;
    text-align: justify;
    margin-bottom: 27px;
}

section.politique h5 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
    font-size: 21px;
    margin-bottom: 22px;
    margin-top: 40px;
    display: block;
}

section.politique ul {
    margin-bottom: 28px;
}

section.politique ul li {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    line-height: 27px;
    text-align: justify;
    margin-bottom: 8px;
}


@media(max-width: 1566px) {
    section.autonome .content-autonome-desc p {
        padding-top: 50px;
    }
}


/* blog section */
.blog-slider img {
    width: 100%;
    object-fit: cover;
    max-height: 300px;
}

.blog-section .slick-slide {
    margin: 0 10px;
}

.blog-section .slick-prev,
.blog-section .slick-next {
    color: #333;
    z-index: 1;
}

section.blog-section {
    margin-top: 50px;
    margin-left: 20px;
    margin-right: 20px;
}

.blog-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px;
}

.blog-section h2 {
    margin: 0;
    font-size: 2rem;
    font-weight: bold;
}

.Bon-plan-title {
    padding-bottom: 20px;
    font-family: 'Century-Gothic-Std';
    text-align: center;
    margin-top: 8px;
}

.brochure-image {
    max-width: 100%;
    height: auto;
    width: 50%;
    display: block;
    margin: 0 auto;
}


.collection_hiver {
    margin-top: 57px !important;
}

section.actualité-blogs {
    padding: 40px 0;
}



/* End section blog */


@media(max-width: 1366px) {
    section.autonome .content-autonome-desc h2 {
        top: 30px;
        margin-top: 20px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        top: 30px;
        margin-top: 20px;
        font-size: 26px;

    }



    section.autonome .content-autonome-desc p {
        /* padding-right: 40px !important; */
        font-family: 'Century-Gothic-Std';
    }

    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }

    p.justified-text-modify {
        margin-bottom: 0px !important;
    }


    /* detail actualiteé */
    .description-actualite {
        text-align: justify;
        margin: 0 auto;
        /* Optional: to center the entire block */
        max-width: 800px;
        /* Optional: to limit the width of the text block */
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    .description-actualite p {
        margin-bottom: 15px;
        /* Optional: to add space between paragraphs */
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    .bloc-1-collection {
        display: flex;
        justify-content: center;
    }

    .bloc-1-collection {
        padding: 40px 0;
        text-align: center;
    }

    .content-bloc1-collection {
        width: 100%;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: center;
        padding-left: 50px;
        padding-right: 50px;
    }

    .centered-content {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        text-align: center;
    }

    .bloc-2-collection {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .video-bloc2-collection {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }


    .title-bloc1-collection {
        text-align: center;
        background: var(--grayLighten_color);
        font-family: "Century-Gothic-Std", "Century Gothic";
        color: black;
        margin: 0 30px;
        font-size: 19px;
        padding: 10px;
        text-transform: uppercase;
    }

    .container.adjust-conseil-container {
        max-width: 1226px;
    }

    .custom-card-conseil {
        width: 100%;
        margin: 0 auto;
        max-width: 400px;
        padding: 20px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }





    /* .content-bloc1-collection {
        font-size: 20px;
        font-weight: 400;
        color: black;
        line-height: 30px;
        text-align: justify;
        max-width: 800px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .description-actualite {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 20px;
        font-weight: 400;
        color: black;
        justify-content: center;
        align-items: center;
    } */

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 459px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }


}





/* ******************************Start responsive ***********************************************************************/
/*responsive home */

@media (min-width: 396px) and (max-width: 420px) {
    .sliderTop .slick-prev::before {
        left: -7px;
    }
}

@media (min-width: 500px) and (max-width: 700px) {
    .sliderTop .slick-prev::before {
        left: 40px;
    }
}

@media (min-width: 360px) and (max-width: 369px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 35px;
        bottom: 250px;
    } */

    .carousel-inner .slick-next::before {
        right: 50px;
        bottom: 217px;
    }
}

@media (min-width: 370px) and (max-width: 388px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 32px;
        bottom: 250px;
    }

    .carousel-inner .slick-next::before {
        right: 37px;
        bottom: 217px;
    }
}

@media (min-width: 389px) and (max-width: 400px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 32px;
        bottom: 220px;
    }

    .carousel-inner .slick-next::before {
        right: 25px;
        bottom: 187px;
    }
}

@media (min-width: 401px) and (max-width: 415px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 25px;
        bottom: 230px;
    }

    .carousel-inner .slick-next::before {
        right: 15px;
        bottom: 197px;
    }
}

@media (min-width: 416px) and (max-width: 435px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 18px;
        bottom: 150px;
    } */

    .carousel-inner .slick-next::before {
        right: 0px;
        bottom: 117px;
    }
}

@media (min-width: 436px) and (max-width: 470px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 12px;
        bottom: 140px;
    } */

    .carousel-inner .slick-next::before {
        right: -25px;
        bottom: 107px;
    }
}

@media (min-width: 471px) and (max-width: 505px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 0px;
        bottom: 120px;
    }

    .carousel-inner .slick-next::before {
        right: -50px;
        bottom: 87px;
    }
}

@media (min-width: 505px) and (max-width:546px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 65px;
    }

    .carousel-inner .slick-next::before {
        right: -70px;
        bottom: 33px;
    }
}

@media (min-width: 547px) and (max-width:767px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 65px;
    } */

    .carousel-inner .slick-next::before {
        right: -70px;
        bottom: 33px;
    }

    div#carouselExampleCaptions1 button.slick-prev.slick-arrow {

        right: calc(50% - 120px) !important;
        transform: translateX(50%);
    }
}

@media (min-width: 551px) and (max-width: 767px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 33px;
    } */

    /* div#carouselExampleCaptions1 button.slick-next.slick-arrow {
        right: calc(50% - 30px) !important;
        transform: translateX(50%);
    } */
    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 600px !important; */
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }

    section.autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -48px !important;
        font-weight: 300;
        left: -12px;
        background: url(../images/btnright.png) center no-repeat important;
        height: 12px !important;
        width: 60px;
        content: "";
    }

    section.collection.home .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 59px !important;
        width: 60px;
        content: "";
        top: 33px !important;
        left: 10px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }

    section.collection.home .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: #000000;
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 295px !important;
        width: 107px;
        content: "";
        top: -186px !important;
        left: 10px;
    }


    section.avis-clients {
        padding: 0px 0 50px 0;
        text-align: center;
        position: relative;
    }

    section.autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0 !important;
        left: -30px !important;
        font-weight: 300 !important;
        background: url(../images/btnleft.png) center no-repeat !important;
        height: 8px !important;
        width: 60px !important;
        content: "";
        top: -46px !important;

    }


    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 50px;
        z-index: 11111144;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
    }


    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 100px;
        width: 60px;
        content: "";
        top: -60px;
    }

    section.newsletter {
        padding: 30px 0 45px;
        text-align: center;
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -22px;
        font-weight: 300;
        width: 51px;
        height: 28px !important;
        background: url(../images/btnleft.png) center no-repeat;
        height: 84px;
        width: 60px;
        content: "";
        top: -24px;
    }

    .carousel-maquillage .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 42px;
        left: 33px;
    }


}

@media (min-width:551px) and (max-width:670px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 650px !important;
    }

}

@media (min-width:671px) and (max-width:725px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 670px !important;
    }
}

@media (min-width:618px) and (max-width:725px) {
    .carousel-inner .slick-next::before {
        right: -120px !important;
    }
}

@media (min-width:726px) and (max-width:767px) {
    .carousel-inner .slick-next::before {
        right: -150px !important;
    }
}

@media (min-width: 360px) and (max-width: 550px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: auto !important;
    }
}

@media (min-width: 481px) and (max-width: 501px) {
    section.collection .collection_hiver .content-img_collection {
        bottom: -250px
    }
}

@media (min-width: 502px) and (max-width: 550px) {
    section.collection .collection_hiver .content-img_collection {
        bottom: -270px
    }
}

@media (max-width: 395px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        font-size: 25px;
        padding-left: 0px;
    }
}

@media (min-width: 396px) and (max-width: 767px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        font-size: 27px !important;
        padding-left: 0px !important;
    }
}

@media (min-width: 396px) and (max-width:400px) {
    .mahassen-lives {
        margin-top: 300px !important;
    }
}

@media (min-width: 401px) and (max-width:414px) {
    .mahassen-lives {
        margin-top: 300px !important;
    }
}

@media (min-width: 415px) and (max-width:422px) {
    /* .mahassen-lives {
        margin-top: 270px !important;
    } */
}

@media (min-width: 396px)and (max-width:767px) {
    section.mahassen-lives .mahassen-live-desc {
        margin-top: -150px;
    }

}

/* @media (max-width: 767px) {
    section.mahassen-lives {
        padding: 0px 20px 47px 20px !important;
        top: 50px;

    }
} */
@media (min-width: 360px)and (max-width:400px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: 150px;
    }

    section.abonnez-vous {
        margin-top: -190px;
    }
}

@media (min-width: 400px)and (max-width:500px) {
    .abonnez-vous {
        margin-top: -100px !important;
    }

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: 50px;
    }

    .mahassen-lives .slick-list .item.shine .fancybox img {
        height: 400px;

    }
}

@media (min-width: 481px)and (max-width:767px) {
    section.collection .desc_collection {
        padding: 180px 0 0;
    }

    section.autonome .content-autonome .picture {
        height: 450px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        height: 300px !important;
        object-fit: cover;
    }

    .carousel-innerMake .slick-prev {
        top: 10%;
    }

    .carousel-innerMake .slick-next {
        right: 5px;
        top: 35%;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 35px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 450px;

    }
}

@media (min-width: 501px)and (max-width:767px) {
    section.maquillage .content-autonome-desc h2 {
        margin-top: 50px;
    }
}

@media (min-width: 462px)and (max-width:767px) {
    /* .mahassen-lives {
        margin-top: 460px;
    } */

}

@media (min-width: 481px)and (max-width:500px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;
        /* margin-top: 300px !important; */
    }
}

@media (min-width: 501px)and (max-width:530px) {
    .mahassen-lives {
        margin-top: 40px !important;
    }
}

@media (min-width: 531px)and (max-width:560px) {
    .mahassen-lives {
        margin-top: 20px !important;
    }
}

/* @media (min-width: 561px)and (max-width:767px) {
    .mahassen-lives {
        margin-top: 0px !important;
    }
} */

@media (min-width: 501px)and (max-width:767px) {

    .abonnez-vous {
        margin-top: -20px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 50px;
    }

    .carte-mahassen.centre-m .col-md-12.col-lg-6 .content-carte-mahassen.carte-two .content-carte-one .content-img.shine {
        order: -1;
    }
}

@media (min-width: 545px)and (max-width:599px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: -40px;
    }
}

@media (min-width: 600px)and (max-width:767px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: -40px;
    }

    .live-slider.slick-initialized.slick-slider .item {
        height: auto;
    }
}

@media (max-width: 569px) {

    .same-height {
        flex-direction: column;
        align-items: center;
    }

    .content-img-categorie3 {
        margin-bottom: 20px;
    }

    .same-height-img {
        width: 100%;
        height: auto;
    }
}



@media (min-width: 569px) and (max-width: 892px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }
}

@media (max-width: 852px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }
}


@media (max-width: 568px) {
    .contents-img {
        display: block;
    }

    .content-one {
        display: block;
        width: 100%;
    }

    .content-one-img {
        width: 100%;
        margin-bottom: 20px;
    }
}


@media (min-width: 501px) and (max-width:547px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;
        margin-top: -50px !important;
    }
}

@media (min-width: 548px)and (max-width:600px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;
        margin-top: 20px !important;
    }
}

@media (min-width: 601px)and (max-width:767px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;

    }
}

@media (min-width: 651px)and (max-width:767px) {
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        max-height: 700px !important;

    }
}

@media (min-width: 423px)and (max-width:430px) {
    /* .mahassen-lives {
        margin-top: 270px !important;
    } */
}

@media (min-width: 431px)and (max-width:445px) {
    /* .mahassen-lives {
        margin-top: 270px !important;
    } */
}

@media (min-width: 446px)and (max-width:461px) {
    /* .mahassen-lives {
        margin-top: 245px !important;
    } */
}

@media (min-width: 462px)and (max-width:480px) {
    /* .mahassen-lives {
        margin-top: 240px !important;
    } */
}

@media (min-width: 481px)and (max-width:495px) {
    /* .mahassen-lives {
        margin-top: 290px !important;
    } */
}

@media (min-width: 496px)and (max-width:500px) {
    .mahassen-lives {
        /* margin-top: 320px !important; */
    }
}

/*start responsive footer*/
@media (max-width:767px) {
    section.footer .footer-content {
        padding-left: 0px;
        display: block !important;
        text-align: center;
    }

    section.footer .footer-content .resp-footer {
        margin-top: 25px;
    }

    section.footer .footer-content span {
        line-height: 30px;
    }

    section.footer .footer-content div .maps.text-end {
        margin-top: 0px;
    }

    section.footer .align-items-center {
        justify-content: center;
    }

    .bi.bi-envelope {
        margin-bottom: -10px;
    }

    .flex-newsletter {
        display: flex;
        justify-content: center;
    }

    .footer-qrq .text-app {
        text-align: center;
    }

    .footer-qrq .img-app {
        text-align: center;
    }

    section.mahassen-lives .item::after {
        top: 35%;
    }

    section.footer {
        padding: 20px 25px 50px !important;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    .collection_hiver {
        margin-top: 0px !important;
    }

    .collection .container .collection_hiver {
        height: 530px !important;
    }
}

/*end responsive footer*/
@media (min-width:768px) and (max-width:991px) {

    section.collection .desc_collection h2,
    section.collection .desc_collection h4 {
        font-size: 24px;
    }

    .collection_hiver {
        margin-top: 0px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 500px !important;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 100px;
        left: 0px;
        height: 245px;
    }

    .autonome {
        margin-top: -80px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 20px; */
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 45px;
    }

    .maquillage img.small-image {
        margin-top: 0px;
        max-width: 100%;
        max-height: 100%;
    }

    .maquillage img.small-image-right {
        margin-top: 0px;
        max-width: 100%;
        max-height: 100%;
    }

    section.maquillage {
        padding: 50px;
    }

    section.maquillage .content-video {
        display: flex;
        justify-content: center;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 50px;
    }

    section.nouveaute {
        padding: 100px 10px 70px;
    }

    section.nouveaute.Center-m {
        padding: 0px 10px 70px;
    }

    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    section.product-cosmetique {
        padding: 20px 0 20px;
    }

    section.nouveaute.home {
        padding: 120px 10px 70px;
    }

    section.mahassen-lives button.slick-prev.slick-arrow,
    section.mahassen-lives button.slick-next.slick-arrow {
        bottom: -40px;
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        top: 20px;
        bottom: 0;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - -30px) !important;
        transform: translateX(50%);
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(50% - 30px) !important;
        transform: translateX(100%);
    }

    section.avis-clients {
        padding: 50px 0 50px 0;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 50px;
    }

    .autonome .content-autonome .content-autonome-desc,
    .autonome .content-autonome .picture.shine.col-md-9 {
        width: 50%;
    }

    section.mahassen-lives {
        padding: 20px 73px 47px 30px;
    }

    section.newsletter {
        padding: 0px 0 45px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen .content-carte-one div span,
    .content-carte-mahassen.carte-two .content-carte-one div span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        text-align: justify;
        font-size: 15px !important;
    }

    .carte-mahassen .content-carte-one {
        display: flex;
        flex-direction: column;
    }

    .carte-mahassen .content-img.shine {
        order: -1;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 100px;
        padding-left: 0px;
        padding-top: 0px;
    }


    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    .footer-qrq {
        padding-left: 50px;
        padding-top: 20px;
        display: block;
        text-align: center;
    }

    .footer-qrq .text-app {
        text-align: center;
    }

    .footer-qrq .img-app {
        text-align: center;
        margin-top: 35px !important;
    }

    .footer-qrq .flex-newsletter {
        display: flex;
        justify-content: center;
        margin-top: 30px;
    }

    section.autonome .content-autonome .picture img {
        height: 400px;
    }

}

@media (min-width:768px) and (max-width:991px) {
    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .fancybox img {
        width: 100%;
        object-fit: cover;
    }

    .maquillage.home .content-video {
        display: block;

    }

    .maquillage.home .row .col-md-12.modify {
        padding-right: calc(var(--bs-gutter-x)* .5);
        padding-left: calc(var(--bs-gutter-x)* .5);
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: auto !important;
    }

    section.maquillage.home .container-fluid.adjust-container-section-hammem-spa .col-md-4 {
        flex: 0 0 auto;
        width: 100%;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one {
        grid-template-columns: auto 100px !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-img.shine,
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        margin-bottom: 40px;
        max-height: 800px;
        width: 100% !important;
    }
}

@media (min-width:768px) and (max-width:825px) {
    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 45px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 470px;
        position: relative;
    }
}

@media (min-width:826px) and (max-width:991px) {
    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 110px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 550px;
        position: relative;
    }
}

@media (min-width:992px) and (max-width:1023px) {
    .massage.coiffure.mah-Centre .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -220px !important;
        left: -115px !important;
    }

    .carousel-inner .slick-prev::before {
        bottom: -65px;
        left: -25px;
    }

    .carousel-innerMake .slick-prev {
        right: 5px;
        top: 20%;
    }

    .carousel-innerMake .slick-next {
        top: 40%;
        right: 16px;
    }

    .carousel-item.shine .custom-caption {
        top: 60%;
    }

    section.footer .footer-content {
        grid-template-columns: repeat(4, 1fr);
        padding-left: 0px;
    }

    section.collection .desc_collection {
        padding: 70px 0 0 40px;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 20px 0 0 0px;
    }

    section.collection.mah-nouveaute.mah-Centre .col-md-2 {
        width: 40%;
    }

    section.collection.mah-nouveaute.mah-Centre .col-md-1 {
        width: 60%;
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        left: 90px !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        right: 30px !important;
    }

    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .carousel-inner .slick-prev::before {
        top: 50px;
    }

    section.product-cosmetique button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -40px;
        right: 98px;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    .carousel-inner .slick-next::before {
        top: 150px;
    }

    .carousel-inner button.slick-next.slick-arrow {
        left: 290px;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 305px !important;
    }

    .carousel-innerMake .slick-prev {
        right: -2px;
        top: 20%;
    }

    .carousel-innerMake .slick-next {
        top: 40%;
        right: -7px;
    }

    .carousel-item.shine .custom-caption {
        top: 65%;
    }
}

@media (min-width:992px) and (max-width:1165px) {
    .container {
        max-width: 850px;
    }

    section.collection .collection_hiver .content-img_collection {
        left: -15px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: 100% !important;
    }

    #carouselExampleCaptions1 .indicators .carousel-inner {
        overflow: initial;
    }



    .autonome {
        margin-top: -150px;
    }

    section.autonome .content-autonome {
        grid-template-columns: 55% 60%;
    }

    section.nouveaute {
        padding: 50px 10px 50px 10px;
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(50% - 30px) !important;
        transform: translateX(100%);
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        bottom: 0;
        top: 20px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 400px;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - -30px) !important;
        transform: translateX(50%);
    }

    .nouveaute .col-md-7,
    .nouveaute .col-md-5 {
        width: 50% !important;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: auto;
    }

    section.maquillage {
        padding: 50px 0px;
    }

    img.small-image {
        margin-top: 0px;
    }

    img.small-image-right {
        margin-top: 0px;
    }

    .small-image {
        max-width: 100%;
        max-height: 100%;
    }

    .small-image-right {
        max-width: 100%;
        max-height: 100%;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 40px !important;
        margin-left: 0 !important;
        padding-left: 100px !important;
        margin-right: 0 !important;
        padding-right: 100px !important;

    }

    .mahassen-lives .col-lg-4 {
        width: 40%;
    }

    .mahassen-lives .col-lg-8 {
        width: 60%;
    }

    section.abonnez-vous {
        margin-top: 0;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 0px !important;
    }

    section.abonnez-vous {
        padding: 10px 30px 10px;
    }

    .marque-abonnez section.abonnez-vous {
        padding: 0px 30px 10px;
    }

    .footer .container-fluid {
        display: flex;
    }

    section.footer .footer-content h3 {
        font-size: 13px;
        line-height: 25px;
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    section.footer .img-qrq img {
        width: 20%;
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .footer-qrq {
        padding: 0 0px 0px 10px;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .img-app img {
        width: 90px !important;
    }

    section.footer form {
        width: 200px;
    }

    section.footer .footer-content {
        gap: 20px;
        padding-left: 0px !important;
    }

    .resp-footer {
        width: 100%;
    }

    .flex-newsletter {
        display: flex;
        justify-content: center;
    }

    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }
}

@media (min-width:992px) and (max-width:1024px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 25px; */
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 80px !important;
    }

    section.autonome.home .content-autonome-desc {
        padding-left: 0px !important;
    }
}

@media (min-width:1025px) and (max-width:1199px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 50px; */
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 120px !important;
    }

    section.autonome .content-autonome .picture img {
        height: 450px !important;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 80px !important;
    }

    section.autonome.home .content-autonome-desc {
        padding-left: 0px !important;
    }

}

@media (min-width:1200px) {
    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer .container-fluid {
        display: flex;
    }

    .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-qrq img {
        width: 20%;
    }

    section.footer .footer-content h3 {
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    .resp-footer.flex {
        width: 200px;
    }

    section.footer .img-qrq img {
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .flex-newsletter {
        justify-content: center;
        display: flex;
    }

    section.footer form {
        width: 220px;
    }

    .bi.bi-telephone {
        margin-top: 10px;
    }

    .bi.bi-envelope {
        margin-top: 20px;
    }

    .autonome {
        margin-top: -70px;
    }

}

@media (min-width: 350px) and (max-width: 639px) {
    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    /*
    .footer .container-fluid {
        display: flex;
    }*/
    .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-qrq img {
        width: 20%;
    }

    section.footer .footer-content h3 {
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    /*
    .resp-footer.flex{
        width: 200px;
    }*/
    section.footer .img-qrq img {
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .flex-newsletter {
        justify-content: center;
        display: flex;
    }

    section.footer form {
        width: 220px;
    }

    .bi.bi-telephone {
        margin-top: 10px;
    }

    .bi.bi-envelope {
        margin-top: 20px;
    }

    .autonome {
        margin-top: -70px;
    }

    .autonome.home {
        margin-top: 0px !important;
    }
}

@media (min-width:1200px) and (max-width:1350px) {
    .autonome {
        margin-top: -70px;
    }

    .autonome.home {
        margin-top: 0px !important;
        margin-bottom: 30px !important;
    }

    .abonnez-vous {
        padding: 0px 30px 65px !important;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption p,
    section.autonome div#carouselExampleCaptions2 .carousel-caption h4 {
        font-size: 13px;
    }

}

@media (min-width:1400px) {
    .carousel-inner .slick-prev::before {
        /* left: -60px; */
    }

    .carousel-inner .slick-next::before {
        right: -60px;
    }

    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: -20px !important;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-next::before {
        right: 57px !important;
    } */

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 60px; */
        margin-top: -40px;
    }

}


@media (min-width:1567px) and (max-width:1800px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 120px !important; */

    }
}

@media (min-width:1800px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 148px !important; */

    }
}

@media (min-width:1677px) {
    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-top: 100px;
    }

    /* section.collection {
        padding-bottom: 300px !important;
    } */

    section.collection .collection_hiver .content-img_collection {
        bottom: -200px !important;
        left: -50px;
        height: 500px;
    }

    section.autonome {
        margin-right: 30px;
        margin-left: 30px;
        height: calc(70vh) !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome {
        display: grid;
        grid-template-columns: 59% 63%;
        position: relative;
    }

    section.autonome .content-autonome-desc {
        padding-top: 70px;
    }

    section.autonome .content-autonome .picture {
        height: 765px;
        margin-top: 20px;
    }

    section.autonome .content-autonome .picture img {
        height: 70%;
        width: 100%;
        max-width: 84%;
        object-fit: cover;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 725px;
        position: relative;
    }

    button.slick-prev.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    button.slick-next.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-img {
        margin-bottom: 45px;
        max-height: 750px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-one {
        display: grid;
        grid-template-columns: auto 100px;
        padding-left: 65px;
        padding-top: 1px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-top: 35px;
        max-height: 750px;
    }


    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer .container-fluid {
        justify-content: center;
    }
}

@media (max-width:415px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        height: 450px;
    }
}

@media (min-width:416px) and (max-width:480px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        height: 550px;
    }

    section.collection .desc_collection {
        padding: 150px 0 0;
    }
}

@media (min-width: 551px) and (max-width:767px) {
    section.collection .collection_hiver .content-img_collection {
        bottom: -350px !important;
    }

    section.collection .desc_collection {
        padding: 300px 0 0 !important;
    }
}

@media (min-width: 433px) and (max-width: 445px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        margin-top: 0px;
    }
}


@media (min-width: 501px) and (max-width: 547px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        margin-top: 50px !important;
    }
}

@media (min-width: 1677px) {
    section.maquillage.home {
        margin-top: 100px !important;
    }
}

/*start responsive page soin peau*/
@media (max-width: 500px) {
    .header-marketing {
        /* height: 150px; */
        position: relative;
    }

    .content_slider {
        padding: 0px;
    }

    .header-marketing img {
        width: 100%;
        height: 100%;
        object-fit: initial;
    }


    section.collection.mah-nouveaute.maquillage {
        background: white;
        padding: 50px 5vw 65px;
    }

    section.collection.mah-nouveaute {
        position: relative;
        padding-left: 5vw;
        padding-right: 5vw;
    }


    @media (min-width: 1024px) and (max-width: 1677px) {
        section.collection.mah-nouveaute.maquillage {
            padding: 40px 4vw;
        }
    }

    @media (min-width: 768px) and (max-width: 1024px) {
        section.collection.mah-nouveaute.maquillage {
            padding: 30px 4vw;
        }

        .desc_collection p {
            font-size: 16px;
        }

    }


    @media (max-width: 768px) {
        section.collection.mah-nouveaute.maquillage {
            padding: 20px 3vw;
        }

        .content-img-collection img,
        .spa img {
            width: 100%;
            height: auto;
        }

        .desc_collection p {
            font-size: 14px;
        }
    }


}

@media (min-width: 501px) and (max-width: 767px) {
    .header-marketing {
        height: auto;
        position: relative;
    }

    .header-marketing img {
        width: 100%;
        height: 100%;
        object-fit: initial;
    }

}

@media (max-width: 767px) {
    section.collection .desc_collection .spa.maquillage {
        margin-top: -40px;
        height: 0 !important;
    }

    section.product-cosmetique.maquillage {
        padding: 20px 0px 20px 0px;
        margin-top: 15px !important;
    }

    .product-slider-idees .slick-list .slick-slide {
        display: flex;
        justify-content: center;
    }

    .product-slider-idees .product-item.shine img {
        max-height: 300px !important;
    }

    section.collection .desc_collection .spa img {
        width: 100% !important;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 20px 0px 0px 0px !important;
    }

    /* section.newsletter.soin {
        padding-top: 100px !important;
    } */

    .idees .product-slider-idees.slick-dotted .slick-next:before,
    .idees .product-slider-idees.slick-dotted .slick-prev:before {
        color: black;
        opacity: .99;
        font-size: 30px;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.lamarque::after {
        display: none;
    }

}

@media (max-width: 435px) {
    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 0%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -10%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }
}

@media (min-width: 436px) and (max-width: 560px) {


    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -10%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }
}

@media (min-width: 561px) and (max-width: 767px) {
    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 0%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -6%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }
}

@media (min-width: 396px) and (max-width: 767px) {
    .mahassen-lives.soin {
        padding: 0px 76px 30px 30px !important;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-top: 0px;
    }
}

@media (min-width:1201px) {
    .header-marketing.application .ban-app {
        top: 40%;
        right: 10%;
    }
}

@media (min-width:991px)and (max-width:1200px) {
    .header-marketing {
        height: auto;
        position: relative;
    }

    .header-marketing-desc.ban-app.application-beauty .name-app {

        margin-left: -50px;
    }

    .header-marketing-desc.ban-app.application-beauty .btn-app {
        margin: -40px 0 0;
        padding: 5px 2px;
        margin-left: -50px;

    }

    .header-marketing-desc.ban-app.application-beauty .logo-app img {
        margin-right: 25px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app {
        width: 70%;
    }

    .header-marketing-desc.ban-app.application-beauty {
        right: 10%;
        top: 40%;
    }
}

@media (min-width:768px)and (max-width:991px) {
    section.collection.mah-nouveaute.maquillage .content-img-collection {
        max-width: 100%;
    }

    section.product-cosmetique.maquillage {
        padding: 20px 0 20px 0px;
    }

    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 50%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: 40%;
        overflow: initial;
        z-index: 9999;
        TOP: 105%;
        width: 0;
    }

    .idees.soin .product-slider-idees.slick-dotted .slick-next:before {
        color: black;
        opacity: 0.99;
        font-size: 30px;
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 25px !important;
        font-weight: 300;
        height: 257px;
        width: 60px;
        content: "";
        top: -93px !important;
        background: url(../images/btnright.png) center no-repeat;
    }

    .idees .product-slider-idees.slick-dotted .slick-next:before {
        color: black;
        opacity: 0.99;
        font-size: 30px;
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -15px !important;
        font-weight: 300;
        height: 83px !important;
        width: 60px;
        content: "";
        top: -4px !important;
        background: url(../images/btnright.png) center no-repeat;
    }

    section.mahassen-lives.soin {
        margin-top: -50px;
    }

    section.lamarque {
        padding: 0px 35px !important;
        top: -47px;
    }

    section.abonnez-vous {
        padding: 50px 30px 50px;

    }


    section.lamarque:after {
        display: none;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.newsletter.soin {
        padding-top: 100px;
    }

    .product-slider-idees.soin .product-item img {
        max-height: 400px !important;
    }
}

@media (min-width:992px) {
    .product-slider-idees.soin {
        display: flex;
        justify-content: center;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media (min-width:992px)and (max-width:1024px) {
    .mahassen-lives.soin {
        margin-top: -50px;
    }

}

/*End responsive page soin peau*/
/*Start responsive page bon plan*/
@media (min-width:767px) {
    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 {
        width: 50% !important;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-prev {
        left: -60px;
        top: 110%;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-next {
        top: 110%;
        right: 0;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-prev::before,
    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-next:before {
        opacity: .90;
        color: black;
    }

}

/*End responsive page bon plan*/
@media (min-width:1400px) and (max-width:1676px) {

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2,
    section.collection .desc_collection h2 {
        font-size: 28px !important;
    }
}

@media (min-width:1400px) {
    section.collection .desc_collection h2 {
        padding-bottom: 15px;
    }

    section.collection .desc_collection {
        padding: 100px 30px 0px 30px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 40px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 16px !important;
        line-height: 32px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 16px !important;
        line-height: 32px;
        text-align: justify;
    }

}

@media (min-width:1400px) and (max-width:1500px) {
    section.autonome .content-autonome-desc p {
        padding-top: 20px !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
    }
}

@media (min-width:1500px) {
    section.autonome .content-autonome-desc p {
        padding-top: 20px !important;
        margin-bottom: 20px;

    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
    }

    .newsletter {
        margin-top: 50px;
    }
}

@media (min-width:1677px) {

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2,
    section.collection .desc_collection h2 {
        font-size: 32px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }

    section.collection .desc_collection a.decouvrir,
    section.autonome .content-autonome-desc a.decouvrir,
    section.maquillage .content-autonome-desc a.decouvrir,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
    section.avis-clients a.decouvrir,
    section.mahassen-lives .mahassen-live-desc a.decouvrir,
    .cont-description a.decouvrir {
        font-size: 18px !important;
    }

    section.collection .desc_collection {
        padding: 50px 50px 0px 50px !important;
    }

    section.collection .desc_collection p {
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 120px !important;
    }

    section.autonome .content-autonome-desc p {
        padding-top: 60px !important;
        margin-bottom: 20px;
    }

    section.maquillage.home .small-image {
        max-width: 600px;
        max-height: 700px;
    }

    section.maquillage.home .small-image-right {
        max-width: 600px;
        max-height: 700px;
    }

    img.small-image {
        margin-top: 0px !important;
    }

    img.small-image-right {
        margin-top: 0px !important;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 60px;
        padding-right: 50px;
        padding-left: 50px;
    }

    section.nouveaute {
        padding: 0px 35px 50px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 100px;
        max-height: 600px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-two .content-img {
        margin-bottom: 100px;
        max-height: 807px;
        width: 100%;
    }


    section.mahassen-lives .mahassen-live-desc {
        margin-top: 50px;
    }

    .autonome {
        margin-top: -120px !important;
    }
}

@media (min-width:1677px) and (min-width:1800px) {
    section.maquillage.home {
        margin-top: -100px !important;
    }
}



@media (min-width:1311px) and (max-width:1400px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: -30px !important;
    }
}

@media (min-width:1520px) and (max-width:1676px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: 30px !important;
    }
}

@media (min-width:1677px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: 50px !important;
    }
}

/*Start responsive page femme*/
@media(max-width:767px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 14px ;
        text-align: justify;
        line-height: 29px;
    }

    section.massage.coiffure .content-img img {
        object-fit: cover;
    }

    section.coiffure-hom {
        padding: 10px 10px 35px 10px;
    }

    section.coiffure-hom.marque {
        padding: 20px 35px 0px 35px !important;
    }

    .massage.coiffure .row {
        display: flex;
        flex-direction: column;
    }

    .massage.coiffure .col-md-6 {
        width: 100%;
    }

    .massage.coiffure .col-md-6.order-md-2 {
        order: 1;
    }

    .massage.coiffure .col-md-6.order-md-1 {
        order: 2;
    }

    .cont-description-right {
        margin-top: 0px;
    }

    section.massage.coiffure .content-img {
        padding-right: 0px !important;
    }

    /* .live-slider.slick-initialized.slick-slider img {
        height: auto;
        width: 100%;
        object-fit: cover;
    } */

    .massage.coiffure {
        padding: 10px 10px 35px 10px !important;
    }

    .brochure-homme .container-fluid .row.d-flex {
        flex-direction: column;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure {
        order: -1;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }


    .product-cosmetique.recomd {
        padding: 0px 20px 0px 20px !important;
    }

    section.product-cosmetique.recomd button.slick-next.slick-arrow,
    section.product-cosmetique.recomd button.slick-prev.slick-arrow {
        bottom: -10px !important;
    }

}

@media (min-width: 768px) and (max-width: 1024px) {
    .abonnez-vous.instagram {
        margin-top: -40px !important;
    }
}

@media(min-width:571px) and (max-width:767px) {
    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

}

@import url('https://fonts.googleapis.com/css2?family=Allura&family=Bebas+Neue&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital@0;1&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Sassy+Frass&display=swap');

@font-face {
    font-family: "Century-Gothic-Std";
    src: url("../fonts/Century-Gothic-Std-Regular.woff") format("woff");
}

/* info global */

:root {
    /* ===== Colors ===== */
    --Heading_color: #000;
    --red_color: #d43f39;
    --grayLighten_color: #f5f5f5;
    --white-color: #fff;
    /* ===== fonts family===== */
    --Brand_title_fonts:
        'Century Gothic';
    /* ===== fonts weight===== */
    --Brand_title_weight: bold;
    /* ===== fonts size ===== */
    --Brand_title_size_level_one: 106px;
    --Brand_title_size_level_two: 50px;
    --Brand_title_size_level_three: 45px;
    --Brand_title_size_level_forth: 35px;
    --Brand_title_size_level_five: 40px;
    --Brand_title_size_level_seven: 16px;
    --Brand_para_size: 16px;
}

.fa-classic,
.fa-regular,
.fa-solid,
.far,
.fas {
    font-family: "Font Awesome 6 Free";
}

body {
    min-height: 100vh;
}

html {
    overflow-x: hidden !important;
}

a {
    text-decoration: none;
}

li.lang a {
    color: rgb(0, 0, 0);
    font-size: 13px;
}

li.lang a:hover {
    color: rgb(255, 0, 0);
}

/* start hover shine */
.menu_scrol.sticky {
    position: fixed;
    /* top: 0; */
    left: 0;
    width: 100%;
    z-index: 4;
    background: #fff;
    top: 0;
    box-shadow: 0 0 10px #d7d7d7d6;
}

.shine {
    position: relative;
    overflow: hidden;
}

.box-actualité {
    background: #fff !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1) !important;
    overflow: hidden !important;
    margin-bottom: 20px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}


.image-box-actualité img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
}

.title-box-actualité {
    font-size: 20px !important;
    font-weight: bold !important;
    color: #333 !important;
    padding: 15px 20px !important;
    text-align: center !important;
}


.detail-box-actualité {
    display: flex !important;
    justify-content: space-between !important;
    padding: 10px 20px !important;
    font-size: 14px;
    color: #777 !important;
    /* border-bottom: 1px solid #e0e0e0; */
}

.content-box-actualité {
    padding: 20px !important;
    color: #000000 !important;
}

.description-content {
    position: relative;
}

.description-content .btn-box-blogs a {
    display: inline-block !important;
    padding: 8px 16px !important;
    /* background-color: #007bff; */
    color: #070707 !important;
    text-decoration: none !important;
    border-radius: 4px !important;
    transition: background-color 0.3s ease !important;
}

.shine::before {
    /* background: transparent;
    content: "";
    /* display: block; */
    /* height: 100%; */
    /* left: -75%; */
    /* position: absolute; */
    /* top: 0; */
    /* transform: skewX(-25deg); */
    /* width: 50%; */
    /* z-index: 2; */
}

/*.shine:hover::before,
.shine:focus::before {
    -webkit-animation: shine 0.85s;
    animation: shine 0.85s;
}

@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}

@keyframes shine {
    100% {
        left: 125%;
    }
}
*/

/* end hover shine */

i.first-icon {
    position: fixed;
    bottom: 145px;
    right: 20px;
    font-size: 16px;
    background-color: var(--white-color);
    color: var(--Heading_color);
    cursor: pointer;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    z-index: 2;
    padding: 10px;
    border: 2px solid var(--Heading_color);
}


/* start nos offres */

div.nos_offres {
    background: var(--Heading_color);
    padding: 3px 0 6px;
    text-align: center;
}

div.nos_offres span,
div.nos_offres a {
    color: var(--white-color);
    font-family: var(--Brand_title_fonts);
    font-weight: 300;
    font-size: 12px;
}

div.nos_offres a {
    text-decoration: underline;
    display: inline-block;
    margin-left: 28px;
}

div.nos_offres a i {
    color: var(--white-color);
}

img.pack-image {
    width: 100%;
}

/* end nos offres */


/* start header logo and icons */

.header_logo_icons {
    padding: 8px 33px;
}

.header_logo_icons .content_lang {
    display: flex;
    gap: 30px;
    margin-top: 10px;
}

.header_logo_icons .lang-menu,
.header_logo_icons .monnais,
.header_logo_icons .laguages {
    position: relative;
    text-decoration: underline;
    cursor: pointer;
}

.header_logo_icons .lang-menu ul.languages_uses {
    padding: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 20px;
    display: none;
    right: inherit;
    z-index: 2;
    transition: .7s;
    list-style: none;
    margin-top: 5px;
}

.header_logo_icons .lang-menu .mon_uses,
.header_logo_icons .lang-menu .laguages_uses {
    padding: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 20px;
    display: none;
    /* right: 11px; */
    z-index: 2;
    transition: .7s;
    list-style: none;
    margin-top: 5px;
}

.telheader a {
    text-decoration: none;
    color: black;
    font-size: 15px;
    padding-top: 17px;
}

.header_logo_icons .lang-menu ul.active,
.header_logo_icons .lang-menu .mon_uses.active,
.header_logo_icons .lang-menu .laguages_uses.active {
    display: block;
    background: white;
}

.header_logo_icons .lang-menu .selected-lang {
    position: relative;
    display: table;
    cursor: pointer;
}

.header_logo_icons .monnais span {
    display: inline-block;
    width: 45px;
}

/*.header_logo_icons .lang-menu .selected-lang:after,
.header_logo_icons .monnais:after,
.header_logo_icons .laguages:after {
    position: absolute;
    content: "\f107";
    font-family: "Font Awesome 5 Pro";
    top: 50%;
    transform: translateY(-50%);
    right: -15px;
}

.header_logo_icons .lang-menu .selected-lang.active:after,
.header_logo_icons .monnais.active:after,
.header_logo_icons .laguages.active:after {
    content: "\f106";
}*/

.header_logo_icons .mahassen-live span:first-of-type {
    display: inline-block;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    font-size: 12.5px;
}

.header_logo_icons .mahassen-live span.live {
    padding: 3px;
    font-family: var(--Brand_title_fonts);
    position: relative;
    top: -13px;
}

.header_logo_icons .mahassen-live span.live:after {
    position: absolute;
    content: "";
    top: -17px;
    right: -17px;
    width: 17px;
    height: 17px;
    background-image: url(../images/live.png);
}

.header_logo_icons .header_icons {
    display: flex;
    gap: 6px;
    margin-top: 6px;
    justify-content: end;
}


/* end header logo and icons */


/* start slider */

.content_slider {
    position: relative;
    padding: 0 33px;
    overflow: hidden;
}

.content_slider .content_networks {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: absolute;
    z-index: 3;
    top: 50%;
    left: 23px;
    gap: 10px;
    transform: translateY(-50%);
}

.content_slider .content_networks.maquillage {
    justify-content: end;
    align-items: center;
    position: absolute;
    top: 35%;
    bottom: inherit;
    transform: inherit;
    padding-bottom: 33px;
}

.content_slider .carousel-indicators {
    position: absolute;
    right: 0 !important;
    bottom: inherit;
    left: inherit !important;
    z-index: 2;
    display: flex;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 0;
    margin-right: -41px !important;
    margin-bottom: inherit !important;
    margin-left: inherit !important;
    list-style: none;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.content_slider button.carousel-control-prev,
.content_slider button.carousel-control-next {
    display: none;
}

.content_slider .carousel-indicators [data-bs-target] {
    /* box-sizing: inherit; */
    /* flex: 0; */
    /* width: auto; */
    /* width: 13px !important; */
    /* height: 13px !important; */
    /* padding: 0; */
    /* margin-right: 3px; */
    /* margin-left: 3px; */
    /* text-indent: -999px; */
    /* cursor: pointer; */
    /* border-radius: 50% !important; */
    background-color: transparent;
    /* background-clip: padding-box; */
    /* border: 0; */
    /* border-top: 10px solid transparent; */
    /* border-bottom: 10px solid transparent; */
    /* opacity: .1; */
    /* transition: opacity .6s ease; */
}

.content_slider .carousel-indicators button.active {
    opacity: 1;
    position: relative;
}

.content_slider .carousel-indicators button.active:after {
    /* position: absolute; */
    content: "";
    width: 17px;
    height: 2px;
    background-color: var(--Heading_color);
    transform: translateY(-50%);
}

.content_slider .carousel-indicators button {
    opacity: .1;
}

.content_slider .content_networks a {
    color: var(--Heading_color);
}

.content_slider .content_networks a i {
    transition: all 1s;
}

.content_slider .content_networks a:hover i {
    transform: scale(1.2);
}

.content_slider {
    position: relative;
    padding: 0 33px;
}

.content_slider .carousel-item {
    height: 650px !important;
}

.content_slider .carousel-item img.d-block.w-100 {
    height: 100% !important;
    width: 100% !important;
    object-fit: cover;
}

.content_slider .carousel-caption {
    position: absolute;
    right: inherit !important;
    left: 50px !important;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: var(--Heading_color) !important;
    text-align: left !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.content_slider .carousel-caption span.collection {
    font-size: 22px;
    font-family: var(--Brand_title_fonts);
    display: inline-block;
    margin-bottom: 13px;
    letter-spacing: 5px;
}

.content_slider .carousel-caption h1 {
    font-size: 28px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.content_slider .carousel-caption p {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    max-width: 660px;
}

.content_slider .carousel-caption button {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 10px 45px;
    text-transform: uppercase;
    margin-top: 40px;
    transition: opacity 2s;
    border: none;
}

.content_slider .carousel-caption button:hover {
    opacity: .5;
}


/* end slider */

nav:not(.nav-breadcrumb) {
    border-top: 1px solid #e2e2e2;
    z-index: 99;
    padding: 12px 0;
}

nav .navbar {
    height: 100%;
    /* max-width: 1250px; */
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: auto;
    padding: 0 50px;
}

nav .navbar .logo {
    display: none;
}

.navbar .logo a {
    font-size: 30px;
    text-decoration: none;
    font-weight: 600;
}

nav .navbar .nav-links {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

nav .navbar .links {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    padding: 0;
}

nav .navbar .links li {
    /* position: relative; */
    display: flex;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    padding: 0 14px;
}

nav .navbar .links li a {
    height: 100%;
    font-weight: 300;
    text-decoration: none;
    white-space: nowrap;
    color: var(--Heading_color);
    font-size: 11.5px;
    font-weight: lighter;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
}

.telheader a {
    font-size: 12px;
}

nav .navbar .links li a:hover {
    color: var(--red_color);
}

.links li:hover i.fa-caret-down,
.links li:hover .fa-caret-down {
    transform: rotate(180deg);
}

nav .navbar .links li .fa-caret-right,
nav .navbar .links li .fa-caret-down {
    height: 100%;
    width: 22px;
    text-align: center;
    display: inline-block;
    transition: all 0.3s ease;
    font-size: 12px;
}

nav .navbar .links li .sub-menu {
    position: absolute;
    top: 36px;
    left: 0;
    right: 0;
    line-height: 27px;
    background: var(--white-color);
    border-radius: 0 0 4px 4px;
    display: none;
    z-index: 20;
    padding: 20px 40px;
    box-shadow: 0 0px 3px 0 rgb(0 0 0 / 15%);
}

nav .navbar .links li .sub-menu .nav-n1 {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

nav .navbar .links li .sub-menu .nav-n1 h4 {
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: bold;
    font-size: 13px;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 {
    padding: 0;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.li-mariee a.mariee {
    padding: 5px;
    background: #fde2e1;
    text-transform: uppercase;
    text-align: inherit;
    font-style: italic;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1>li {
    padding: 0;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child {
    position: relative;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child.active .ul-nav-n2 {
    display: block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li {
    position: relative;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child.active .ul-nav-n3 {
    display: block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n3 {
    position: absolute;
    right: -100%;
    position: absolute;
    /* right: -127%; */
    padding: 0;
    top: 0;
    -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
    box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    display: none;
    z-index: 1;
    background: white;
}


/* nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a:after,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a:after {
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    content: "\f054";
    width: 10px;
    height: 10px;
    font-size: 10px;
    right: -17px;
} */

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child .nav-n1-has-child-flex,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 .nav-n2-has-child-flex {
    display: flex;
    justify-content: center;
    align-items: center;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
    width: 100%;
    height: 100%;
    position: relative;
    display: inline-block;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a.active,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a:hover {
    color: red;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
    padding: 11px;
    font-size: 10px;
    line-height: 8px;
    cursor: pointer;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
    position: absolute;
    left: 0;
    padding: 0;
    top: 7px;
    -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
    box-shadow: 0px 1px 4px -1px rgb(165 160 160);
    display: none;
    z-index: 1;
    background: white;
}

nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a {
    position: relative;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
    max-width: 200px;
    height: 100px;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image:last-of-type {
    margin-bottom: 41px !important;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image.no-list {
    margin-top: 20px;
    align-items: end;
    justify-content: start;
    gap: 20px;
}

.navbar .links li .sub-menu li {
    padding: 0 22px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.navbar .links li .sub-menu a {
    font-size: 12.5px;
    font-weight: 500;
    font-family: var(--Brand_title_fonts);
    text-transform: capitalize;
}

.navbar .links li .sub-menu .fa-caret-right {
    line-height: 40px;
}

.navbar .links li .sub-menu .more-sub-menu {
    position: absolute;
    top: 0;
    left: 100%;
    border-radius: 0 4px 4px 4px;
    z-index: 1;
    display: none;
}

.links li .sub-menu .more:hover .more-sub-menu {
    display: block;
}

.navbar .search-box {
    position: relative;
    height: 40px;
    width: 40px;
    display: none;
}

.navbar .search-box i {
    position: absolute;
    height: 100%;
    width: 100%;
    line-height: 40px;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
}

.navbar .search-box .input-box {
    position: absolute;
    right: calc(100% - 40px);
    top: 80px;
    height: 60px;
    width: 300px;
    border-radius: 6px;
    opacity: 0;
    pointer-events: none;
    transition: all 0.4s ease;
}

.navbar.showInput .search-box .input-box {
    top: 65px;
    opacity: 1;
    pointer-events: auto;
    ;
}

.search-box .input-box::before {
    content: '';
    position: absolute;
    height: 20px;
    width: 20px;
    right: 10px;
    top: -6px;
    transform: rotate(45deg);
}

.search-box .input-box input {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 4px;
    transform: translate(-50%, -50%);
    height: 35px;
    width: 280px;
    outline: none;
    padding: 0 15px;
    font-size: var(--Brand_title_size_level_seven);
    border: none;
}

.navbar .nav-links .sidebar-logo {
    display: none;
}

.navbar .bx-menu {
    display: none;
}

@media (max-width:920px) {
    nav .navbar {
        max-width: 100%;
        padding: 0 25px;
    }

    nav .navbar .logo a {
        font-size: 27px;
    }

    nav .navbar .links li {
        padding: 0 10px;
        white-space: nowrap;
    }

    nav .navbar .links li a {
        font-size: 15px;
    }
}

@media (max-width:992px) {
    nav .navbar .logo {
        display: none;
    }

    .navbar .bx-menu {
        display: block;
    }

    nav .navbar .nav-links {
        position: fixed;
        top: 0;
        left: -100%;
        display: block;
        max-width: 270px;
        width: 100%;
        line-height: 40px;
        padding: 20px;
        box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
        transition: all 0.5s ease;
        z-index: 1000;
        background: white;
        overflow-y: scroll;
    }

    .navbar .nav-links .sidebar-logo {
        display: grid;
        grid-template-columns: auto 25px;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .sidebar-logo .logo-name img {
        width: 160px;
    }

    /* .sidebar-logo .logo-name {
        font-size: 25px;
    } */
    .sidebar-logo i,
    .navbar .bx-menu {
        font-size: 20px;
    }

    nav .navbar .links {
        display: block;
        margin-top: 20px;
        padding: 0;
    }

    nav .navbar .links li .arrow {
        line-height: 40px;
    }

    nav .navbar .links li {
        display: block;
    }

    nav .navbar .links li .sub-menu {
        position: relative;
        top: 0;
        box-shadow: none;
        display: none;
        padding: 0;
    }

    nav .navbar .links li .sub-menu li {
        border-bottom: none;
    }

    .navbar .links li .sub-menu .more-sub-menu {
        display: none;
        position: relative;
        left: 0;
    }

    .navbar .links li .sub-menu .more-sub-menu li {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .links li:hover i.fa-caret-down,
    .links li:hover .fa-caret-down {
        transform: rotate(0deg);
    }

    .navbar .links li .sub-menu .more-sub-menu {
        display: none;
    }

    .navbar .links li .sub-menu .more span {
        display: flex;
        align-items: center;
    }

    .links li .sub-menu .more:hover .more-sub-menu {
        display: none;
    }

    nav .navbar .links li:hover .htmlCss-sub-menu,
    nav .navbar .links li:hover .js-sub-menu {
        display: none;
    }

    .navbar .nav-links.show1 .links .htmlCss-sub-menu,
    .navbar .nav-links.show3 .links .js-sub-menu,
    .navbar .nav-links.show2 .links .more .more-sub-menu {
        display: block;
    }

    .navbar .nav-links.show1 .links i.fa-caret-down,
    .navbar .nav-links.show3 .links .fa-caret-down {
        transform: rotate(180deg);
    }

    .navbar .nav-links.show2 .links .fa-caret-right {
        transform: rotate(90deg);
    }
}

@media (max-width:370px) {
    nav .navbar .nav-links {
        max-width: 100%;
        background: var(--white-color);
    }
}


/* start section collection */

section.collection {
    /* padding-bottom: 50px; */
    padding-top: 50px;
}

section.collection .maps {
    padding: 25px 0 !important;
    position: fixed;
    bottom: 11px;
    right: 24px;
    z-index: 3;
}

section.collection .collection_hiver {
    position: relative;
}

section.collection .desc_collection {
    padding: 55px 0 0 40px;
    display: grid;
    justify-content: start;
    align-content: baseline;
    gap: 40px;
}

section.collection .desc_collection h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}

section.collection .desc_collection h4 {
    font-weight: 400;
    margin: 0 0 35px;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}

section.collection .desc_collection p,
section.autonome .content-autonome-desc p,
section.nouveaute .content-noveaute-desc .contnet-nouveaute p {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 30px;
    font-family: 'Century-Gothic-Std';
    line-height: 29px;
    /* letter-spacing: 0.1rem; */
}

.description-by-mahassen {
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 30px;
    font-family: 'Century-Gothic-Std';
    line-height: 29px;
    margin-top: 20px;
}

.titre-by-mahassen {
    font-weight: 400;
    text-transform: uppercase;
    font-family: 'Century-Gothic-Std';
    font-size: 25px;
}



section.collection .desc_collection a.decouvrir,
section.autonome .content-autonome-desc a.decouvrir,
section.maquillage .content-autonome-desc a.decouvrir,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
section.avis-clients a.decouvrir,
section.mahassen-lives .mahassen-live-desc a.decouvrir,
section.carte-mahassen.centre-m.home .content-carte-mahassen.carte-two .content-carte-one a.decouvrir,
section.carte-mahassen.centre-m.home .content-carte-mahassen.carte-one .content-carte-one a.decouvrir,
section.massage.coiffure .cont-description a.decouvrir,
section.coiffure-hom .cont-description a.decouvrir,
.cont-description a.decouvrir {
    font-size: 13.5px;
    text-decoration: none;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    padding: 15px 15px 15px 0;
    letter-spacing: 0.02rem;
    background: transparent !important;
    background-position: center;
    animation: change 3s linear infinite;
    position: relative;
    font-family: "Century-Gothic-Std", "Century Gothic";
    background: transparent !important;
}

@keyframes change {
    0% {
        background-image: url(../images/bg-btn.jpg);
    }

    100% {
        background-image: url(../images/bg-red.jpg);
    }
}

section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.maquillage .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir i.fa-solid.fa-arrow-right-long,
section.avis-clients a.decouvrir i.fa-solid.fa-arrow-right-long,
section.hamam.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.massage.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.massage.coiffure.mah-Centre.mah .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long {
    margin-left: 12px;
}

section.collection .desc_collection a.decouvrir:after,
section.autonome .content-autonome-desc a.decouvrir:after,
section.maquillage .content-autonome-desc a.decouvrir:after,
section.mahassen-lives .mahassen-live-desc a.decouvrir:after,
section.hamam.mah-Centre.mah .cont-description a.decouvrir:after,
section.massage.mah-Centre.mah .cont-description a.decouvrir:after,
section.lamarque .cont-description a.decouvrir:after,
section.bloc2-app.bloc2 .cont-description a.decouvrir:after,
section.bloc3-app.bloc3 .cont-description a.decouvrir:after,
section.carte-mahassen.centre-m.home .content-carte-mahassen.carte-two .content-carte-one a.decouvrir:after,
section.carte-mahassen.centre-m.home .content-carte-mahassen.carte-one .content-carte-one a.decouvrir:after,
section.massage.coiffure.mah-Centre.mah .cont-description a.decouvrir:after,
section.massage.coiffure .cont-description a.decouvrir:after,
section.coiffure-hom .cont-description a.decouvrir:after,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:after {
    content: "";
    position: absolute;
    bottom: 13px;
    width: 113px;
    height: 1px;
    left: 0;
    right: inherit;
    top: inherit;
    background: black;
}

section.abonnez-vous.instagram-centre-mahassen {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}


@keyframes animate {
    0% {
        background-position: left;
    }

    50% {
        background-position: center;
    }

    100% {
        background-position: right;
    }
}

section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
section.mahassen-lives .mahassen-live-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one a.decouvrir i.fa-solid.fa-arrow-right-long,
section.carte-mahassen .content-carte-mahassen.carte-one .content-carte-one a.decouvrir i.fa-solid.fa-arrow-right-long,
section.lamarque .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.brochure-homme.b2b .cont-description.brochure a.decouvrir i.fa-solid.fa-arrow-right-long,
section.massage.coiffure .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.coiffure-hom .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long {
    margin-left: 10px;
}


.rating {
    padding-top: 2px;
    padding-bottom: 16px;
}

section.collection .desc_collection .collection_networks,
section.autonome .content-autonome .collection_networks,
.cont-description .collection_networks,
.fond-de-tient-description .collection_networks {
    display: flex;
    gap: 35px;
    margin-top: 20px;
}

section.collection .desc_collection .collection_networks a,
section.autonome .content-autonome .collection_networks a,
.cont-description .collection_networks a,
.fond-de-tient-description .collection_networks a {
    padding: 7px 10px;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: inherit;
    display: inline-block;
    border: 1px solid var(--Heading_color);
    color: var(--Heading_color);
    transition: all 2s;
    position: relative;
}

section.collection .desc_collection .collection_networks a:hover,
.content-autonome .collection_networks a:hover,
.fond-de-tient-description .collection_networks a:hover {
    opacity: .5;
}

section.collection .collection_hiver div#carouselExampleCaptions1 {
    max-width: 725px;
    /* height: 740px; */
    margin-left: 0;
    margin-right: 0;
    min-height: 740px;
}

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
    /* height: 645px !important; */
    width: 625px;
}

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
    height: 100% !important;
    width: 100%;
    object-fit: cover;
}

section.collection .collection_hiver .carousel-indicators {
    bottom: -60px;
    gap: 20px;
    margin-right: 150px;
}

section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-next,
section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-prev,
section.autonome div#carouselExampleCaptions2 button.carousel-control-prev,
section.autonome div#carouselExampleCaptions2 button.carousel-control-next,
section.maquillage div#carouselExampleCaptions3 button.carousel-control-next,
section.maquillage div#carouselExampleCaptions3 button.carousel-control-prev {
    display: none;
}

section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-indicators button,
section.autonome div#carouselExampleCaptions2 .carousel-indicators button,
section.maquillage .content-carousel-maquillage .carousel-indicators button,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators button {
    width: auto;
    height: auto;
    background-color: transparent !important;
    opacity: 1;
    box-sizing: inherit;
    border-top: 0px solid transparent !important;
    border-bottom: 0px solid transparent !important;
}

section.collection .collection_hiver .content-img_collection {
    position: absolute;
    bottom: -38px;
    right: inherit;
    left: 33px;
    width: 375px;
    /* height: 425px; */
}

section.collection .collection_hiver .content-img_collection img {
    width: 100%;
    /* height: 100%; */
}

section.collection .collection_hiver .contents-img_collection {
    position: absolute;
    bottom: -38px;
    right: inherit;
    left: 33px;
    width: 375px;
    /* height: 425px; */
}

section.collection .collection_hiver .contents-img_collection img {
    width: 100%;
    /* height: 100%; */
}

section.collection .desc_collection .spa.maquillage {
    /* height: 127px; */
}

section.collection .desc_collection .spa img {
    width: 100%;
    /* height: 100%; */
}


/* end section collection */


/* start section autonome */



section.autonome .content-autonome {
    display: grid;
    grid-template-columns: 42% 58%;
    position: relative;
}

.art-block {
    width: 100%;
}

section.autonome .content-autonome .picture {
    /* height: 765px; */
    margin-top: 20px;
}

p.justified-text-modify {
    padding-top: 10px;
}

section.autonome .content-autonome .picture img {
    /* height: 100%; */
    width: 100%;
    object-fit: cover;
}

h2#swal2-title {

    color: black;
}

div#swal2-html-container {

    color: black;
}

.reseaux {
    padding-bottom: 10px;
    padding-right: 6px;
}

section.autonome .content-autonome-desc h2 {
    font-size: 29px;
    padding-left: 401px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    position: absolute;
    /* top: 200px; */
    left: 0;
    right: inherit;
    width: auto;
    color: var(--Heading_color);
    z-index: 1;
}

section.autonome .content-autonome-desc .title-maquillage-pro {
    font-size: 29px;
    /* padding-left: 401px; */
    font-family: "Century-Gothic-Std", "Century Gothic" !important;
    text-transform: uppercase;
    position: absolute;
    /* top: 200px; */
    left: 0;
    right: inherit;
    width: auto;
    color: var(--Heading_color);
    z-index: 1;
}



.recrutement-title-one {
    font-size: 32px;
    font-weight: 600;
    text-align: center !important;
}


section.autonome .content-autonome-desc span {
    color: var(--white-color);
}

.cont-descriptionn-actualité-centre {
    width: 100%;
    max-width: 80%;
    margin: 40px auto;
    text-align: justify;
    padding: 0 10%;
}


section.catalogBloc {
    padding: 20px 0;
    position: relative;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

section.autonome .content-autonome-desc {
    padding-top: 100px;
}

section.autonome .content-autonome-desc p {
    padding-right: 20px;
}

section.autonome .content-autonome .collection_networks a,
.cont-description .collection_networks a {
    position: relative;
    display: inline-block;
}

.content-autonome-desc a.decouvrir {
    margin-top: 0;
}

section.autonome .content-autonome-desc a.decouvrir {
    margin-left: 0;
    display: inline-block;
}

section.autonome .content-autonome .collection_networks {
    margin-left: 40px;
}

.content-autonome .collection_networks,
.cont-description .collection_networks {
    margin-top: 50px;
}

.content-autonome .collection_networks a:not(:last-of-type):after,
.cont-description .collection_networks a:not(:last-of-type):after,
.fond-de-tient-description .collection_networks a:not(:last-of-type):after {
    position: absolute;
    content: "";
    height: 35px;
    width: 1px;
    background-color: #adadad;
    right: -20px;
    top: 0;
    bottom: 0;
}

section.autonome div#carouselExampleCaptions2 {
    position: relative;
}

section.autonome div#carouselExampleCaptions2 .carousel-item {
    /* height: 725px; */
    margin-top: 20px;
}

section.autonome div#carouselExampleCaptions2 .carousel-item img {
    width: 100% !important;
    background-size: cover;
    margin: 0 auto;
}

.custom-caption {
    /* background-color: rgba(255, 255, 255, 0.7); */
    padding: 10px;
    border-radius: 5px;
    top: 39%;
}

.item-desc button {
    text-decoration: none;
    background-color: black;
    color: white;
}

button.btn-ajouter-brush.shine {
    outline: none;
    border: none;
    background: black;
    color: white;
    font-size: var(--Brand_para_size);
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 300;
    text-transform: uppercase;
    padding: 6px 0;
    transition: all 2s;
    margin: 0 auto;
    width: 168px;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

.justified-text {
    text-align: justify;
    text-justify: inter-word;

}


section.autonome div#carouselExampleCaptions2 .carousel-caption {
    position: absolute;
    bottom: 50px;
    z-index: 0;
    width: 100%;
    left: 0;
    text-align: center;
    padding-top: 0;
    padding-bottom: 0;
}

/* .item-icons {
    position: absolute;
    top: 2px;
    left: 21px !important;
    padding-right:11px;
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 25px;
    font-size: 13px;
    box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
    font-family: var(--Brand_title_fonts);
    text-align: center;
    flex-direction: column;
} */

section.autonome div#carouselExampleCaptions2 .carousel-caption p,
section.maquillage .content-carousel-maquillage .carousel-caption p,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
    color: var(--Heading_color);
    font-family: var(--Brand_title_fonts);
    font-size: 18px;
    font-weight: 450;
    margin-bottom: 5px;
}

section.autonome div#carouselExampleCaptions2 .carousel-caption h4,
section.maquillage .content-carousel-maquillage .carousel-caption h4,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption h4 {
    color: #f33f38;
    font-family: 'Century-Gothic-Std';
    font-size: 16px;
}

section.autonome div#carouselExampleCaptions2 .carousel-indicators {
    position: absolute;
    top: -146px;
    right: -105px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 20px;
    align-items: flex-end;
    text-align: right;
    z-index: 0;
}

section.autonome div#carouselExampleCaptions2 .carousel-indicators button:not(.active) {
    margin-right: 12px;
}


/* end section autonome */


/* start section maquillage */

section.maquillage {
    padding: 50px 170px 50px;
    background: #f5f5f5;
}

.owl-nav button {
    background: none;
    border: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    color: #333;
    /* Arrow color */
    font-size: 2rem;
    cursor: pointer;
}

.owl-nav .owl-prev {
    left: -30px;
    /* Position the left arrow */
}

.owl-nav .owl-next {
    right: -30px;
    /* Position the right arrow */
}

.owl-nav button:hover {
    color: #000;
    /* Change color on hover */
}

.owl-nav button span {
    display: inline-block;
}


section.maquillage .video-container {
    height: 745px;
    width: 100%;
    position: relative;
}

section.maquillage .video-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.maquillage .video-container::after {
    position: absolute;
    content: "";
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playvideo.png);
    background-size: cover;
    pointer-events: none;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    cursor: pointer;
    z-index: 2;
    /* animation: scale 3s linear infinite; */
}

@keyframes scale {
    0% {
        box-shadow: -4px 2px 111px 1px rgba(5, 3, 3, 0.75);
    }

    100% {
        box-shadow: -4px 2px 111px 28px rgba(5, 3, 3, 0.75);
    }
}

section.maquillage .popup-video {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    background: rgba(0, 0, 0, .8);
    height: 100%;
    width: 100%;
}

section.maquillage .popup-video video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 750px;
    height: 750px;
    border-radius: 5px;
    border: 2px solid var(--white-color);
    object-fit: cover;
}

section.maquillage .popup-video span {
    position: absolute;
    top: 5px;
    right: 20px;
    font-size: 50px;
    color: var(--white-color);
    font-weight: 700;
    z-index: 100;
    cursor: pointer;
}

section.maquillage video {
    height: 100%;
    width: 100%;
}

section.maquillage .content-autonome-desc {
    /* margin-top: 130px; */
    padding-right: 6px;
    margin-left: 80px;
    padding-left: 93px;
    margin-top: 0px;
}

h2.adjust-hammem-spa-title {
    margin-bottom: 20px;
}


section.maquillage .content-autonome-desc a.decouvrir {
    margin-top: 26px;
}

section.maquillage .content-autonome-desc h2 {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 27px;
    text-transform: uppercase;
    margin-bottom: 30px;
    color: var(--Heading_color);
}

section.maquillage .content-autonome-desc p {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 30px;
    letter-spacing: 0.01rem;
}

section.maquillage .content-autonome-desc a.decouvrir:hover {
    /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
    background-size: contain !important;
    transition: 1s all ease-out;
}

section.maquillage .content-carousel-maquillage {
    position: relative;
    margin-top: 43px;
}

section.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: 40px;
    width: 470px;
    height: 685px;
    top: 40px;
    left: -89px;
    z-index: 0;
}

.content-img-esthetique img {
    width: 60px;
    object-fit: cover;
    /* border-radius: 4px; */
    margin-right: 10px;
}

.content-img-esthetique img {
    max-width: 100%;
}


@media (min-width: 1200px) and (max-width: 1676px) {
    section.esthetique-home .content-img-esthetique img {
        width: 100%;
        object-fit: cover;
    }
}

.content-carousel-maquillage img {
    width: 380px !important;
}

section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 45px;
    gap: 30px;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner {
    height: 100%;
    position: relative;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
    bottom: 0;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
    height: 725px;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
    position: absolute;
    bottom: 60px;
    left: 0;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner img,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner img {
    height: 500px;
    box-shadow: 4px 6px 15px -4px rgb(0 0 0 / 10%);
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .new,
section.product-cosmetique div#product-slider .product-item .new,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .new,
.product-item .new,
.carousel-item .new,
.carousel-maquillage .new {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #f33f38;
    padding: 4px 11px;
    font-size: 13px;
    background: var(--white-color);
    box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
    font-family: var(--Brand_title_fonts);
    text-align: center;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    /* background-image: url(../images/bg-remise.png); */
    background: red;
    /* background-position: center; */
    border-radius: 50%;
}

.carousel-maquillage .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
}

.carousel-maquillage .remise span {
    color: white;
}

section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise span,
section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise span,
carousel-maquillage .carousel-inner .remise span {
    color: var(--white-color);
    font-family: var(--Brand_title_fonts);
    font-size: var(--Brand_para_size);
    font-weight: 700;
    /* margin-top: 23px; */
    /* padding: 3px 58px; */
    display: inline-block;
    /* transform: rotate(45deg); */
}


/* end section maquillage */


/* start section nouveaute */

section.nouveaute {
    padding: 50px 35px 50px;
}

section.nouveaute .content-image {
    /* height: 552px; */
}

section.nouveaute .content-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.nouveaute .content-noveaute-desc {
    position: relative;
    height: 100%;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
    font-size: 25px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    font-weight: 400;
    width: auto;
    color: var(--Heading_color) !important;
    margin-bottom: 22px;

}


/* end section nouveaute */


/* start product-cosmetique */

section.product-cosmetique {
    padding: 0 0 20px;
}

section.product-cosmetique .item {
    padding: 0px 28px;
    display: inline-block;
}

section.product-cosmetique .item .product-item {
    /* height: 400px; */
    position: relative;
}

section.product-cosmetique .item .product-item img {
    height: 100%;
    background-size: cover;
    width: 100%;
}

/* section.product-cosmetique .item .product-item .item-icons {
    position: absolute;
    bottom: 50px;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    display: none;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
} */

@keyframes viewicons {
    0% {
        bottom: 0;
    }

    50% {
        bottom: 20px;
    }

    100% {
        bottom: 50px;
    }
}

section.product-cosmetique .item:hover .item-icons {
    display: block;
}

section.product-cosmetique .item .product-item .item-icons i {
    padding: 20px 25px;

    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons-left i {
    padding: 20px 25px;

    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons i:hover {
    color: #acacac;
}

section.product-cosmetique .item .product-item .item-icons-left i:hover {
    color: #acacac;
}

section.product-cosmetique .slick-slider {
    margin: 0 13px;
}

section.product-cosmetique .item .item-desc {
    padding: 26px 32px;
    text-align: center;
}

section.product-cosmetique .item a {
    text-decoration: none;
}



section.product-cosmetique .item .item-desc h5 {
    font-size: 20px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: #f33f38;
}

section.product-cosmetique button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 80px;
    width: 50px;
    height: 50px;
    left: inherit;
    z-index: 3;
}

section.product-cosmetique .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/* end product-cosmetique */


/* start section avis */

section.avis-clients {
    padding: 0 0 50px 0;
    text-align: center;
    position: relative;
}

section.avis-clients img {
    position: absolute;
    top: 66px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    background: var(--white-color);
    border-radius: 50%;
}

section.avis-clients .content-slider-avis {
    max-width: 80%;
    margin: 0 auto;
    position: relative;
}

section.avis-clients .avis-slider.slick-initialized.slick-slider {
    background-color: #f5f5f5;
    padding: 106px 0 50px;
    position: relative;
}

section.avis-clients .avis-slider .item {
    color: var(--Heading_color);
    position: relative;
    text-decoration: none;
}

section.avis-clients .avis-slider .item p {
    font-size: 20px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    max-width: 100%;
    padding: 0 30px;
    margin: 0 auto;
}

section.avis-clients .avis-slider .item .author-avis {
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    margin-top: 54px;
    position: relative;
    font-style: italic;
}

section.avis-clients .avis-slider .item .author-avis:after {
    position: absolute;
    content: "";
    width: 2px;
    height: 32px;
    top: inherit;
    bottom: 30px;
    background: var(--Heading_color);
    left: 50%;
    transform: translateX(1px);
}

section.avis-clients h2 {
    font-size: 27px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 28px;
}

section.avis-clients .avis-slider .slick-dots {
    top: 50%;
    height: 5px;
}

section.avis-clients .slick-prev:before {
    content: "";
    background: var(--Heading_color);
    font-size: 51px;
    position: absolute;
    left: -69px;
    width: 115px;
    height: 2px;
}

section.avis-clients .slick-next:before {
    background: var(--Heading_color);
    content: "";
    font-size: 51px;
    position: absolute;
    right: -69px;
    width: 115px;
    height: 2px;
}

span.slick-prev-index {
    position: absolute;
    top: 43%;
    left: -94px;
}

span.slick-next-index {
    position: absolute;
    top: 43%;
    right: -94px;
}

section.avis-clients a.decouvrir {
    margin-top: 30px;
    background: url(../images/bg-votre-avis.png);
    background-size: cover;
}


/* end section avis */


/* start section carte mahassen */

section.carte-mahassen {
    padding: 50px 35px 20px;
}

section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
    display: grid;
    grid-template-columns: 60px auto 142px;
}

section.carte-mahassen .content-carte-mahassen.carte-two {
    display: grid;
    grid-template-columns: auto 100px;
    padding-left: 65px;
    padding-top: 39px;
}

section.carte-mahassen .content-carte-mahassen .content-img img {
    width: 100%;
    height: 100%;
    /* object-fit: cover; */
}

section.carte-mahassen .content-carte-mahassen .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.carte-mahassen .content-carte-mahassen span.profiter {
    writing-mode: tb-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    text-align: end;
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
}

section.carte-mahassen .content-carte-mahassen span.profiter .remise,
carousel-maquillage span.profiter .remise {
    color: #f33f38;
}

section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
    writing-mode: vertical-rl;
    font-size: 150px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: var(--grayLighten_color);
    margin-left: 126px;
    letter-spacing: 0.2rem;
    display: inherit;
    line-height: initial;
}

section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: #fde2e1;
    margin-top: 361px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
    margin-top: 50px;
}

section.carte-mahassen .content-carte-mahassen.content-carte-one .content-img {
    margin-bottom: 45px;
    max-height: 600px;
    width: 100%;
}


section.carte-mahassen .content-carte-mahassen.carte-two .content-img {
    margin-bottom: 45px;
    max-height: 802px;
}



section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .contents-img {
    margin-top: 50px;
}

section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .contents-img {
    margin-bottom: 45px;
    max-height: 600px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one .contents-img {
    margin-bottom: 45px;
    max-height: 600px;
    width: 100%;
}

section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
    margin-top: 264px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
    font-size: 38px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 25px;
    letter-spacing: 0.02rem;
}

.content-carte-one p {
    font-size: 14px;
    line-height: 29px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button {
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    padding: 8px 11px;
    background: var(--white-color);
    margin-top: 14px;
    transition: opacity 2s;
    text-transform: uppercase;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button:hover {
    opacity: .5;
}


/* end section carte mahassen */


/* start section mahassen live */

section.mahassen-lives {
    padding: 30px 76px 30px 30px;
    position: relative;
    /* margin-top: 100px; */
}

.center-item {
    display: flex;
    justify-content: center;
    align-items: center;
}


/* section.mahassen-lives .mahassen-live-desc h2, .cont-description h2 {
    font-family: 'Century-Gothic-Std';

    color: var(--Heading_color);
} */

.title-bloc-marque {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


section.mahassen-lives .item {
    position: relative;
    padding: 0 20px;
}

section.mahassen-lives .item a img {
    width: 100%;
    /* height: 100%; */
}

section.mahassen-lives .item::after {
    position: absolute;
    content: "";
    width: 60px;
    height: 60px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playlive.png);
    cursor: pointer;
    pointer-events: none;
    /* animation: scale 1s linear infinite; */
    border-radius: 50%;
    background-size: contain;
}

section.mahassen-lives button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: -54px;
    right: 18px;
}

.swal-error-popup {
    background-color: #f8d7da;
    border: 2px solid #dc3545;
}

.swal-error-title {
    color: #dc3545;
}

.text-error {
    color: #000000;
}


.custom-cancel-btn {
    background-color: #a7a7a7 !important;
    color: white !important;
}


.custom-confirm-btn:hover {
    background-color: #45a049;
}


.custom-cancel-btn {
    background-color: #f44336;
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
}

.custom-cancel-btn:hover {
    background-color: #e53935;
}

section.mahassen-lives .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    width: 51px;
    height: 51px;
    background: url(../images/btnright.png)center no-repeat;
    height: 68px;
    width: 60px;
    content: "";
}

section.mahassen-lives button.slick-prev.slick-arrow {
    position: absolute;
    bottom: -54px;
    left: inherit;
    right: 114px;
    top: inherit;
}

a.decouvrir {
    padding-top: 30px;
}

section.mahassen-lives .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    font-weight: 300;
    width: 51px;
    height: 51px;
    background: url(../images/btnleft.png)center no-repeat;
    height: 68px;
    width: 60px;
    content: "";
}

section.mahassen-lives .mahassen-live-desc .diese {
    margin-top: 0;
    margin-bottom: 30px;
    text-align: center;
    position: relative;
    height: 116px;
}



section.mahassen-lives .mahassen-live-desc .diese::after {
    position: absolute;
    content: "";
    width: 531px;
    height: 286px;
    background: #fbfaf8;
    top: 23px;
    right: -206px;
    z-index: -1;
}

section.mahassen-lives .mahassen-live-desc {
    font-size: 14px;
    font-family: 'Century-Gothic-Std';
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 85px;
    line-height: 27px;
}



section.mahassen-lives .mahassen-live-desc a.decouvrir {
    margin-top: 0;
}

section.mahassen-lives .mahassen-live-desc span.live {
    position: absolute;
    bottom: 76px;
    left: 8%;
    height: 324px;
    width: 624px;
    z-index: -1;
}

section.mahassen-lives .mahassen-live-desc span.live img {
    width: 100%;
    object-fit: cover;
}


/* end section mahassen live */
/* start section commaunity  */
.abonnez-vous-slider-commaunuté-maquillage-pro {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: center;
}

.abonnez-vous-slider-commaunuté-maquillage-pro .item {
    text-align: center;
}

.abonnez-vous-slider-commaunuté-maquillage-pro .item img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* End start commaunity */

/* start section commaunity */
.abonnez-vous-slider-communauté-beauté {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.abonnez-vous-slider-communauté-beauté .item {
    display: inline-block;
    flex: 1;
    margin-right: 15px;
    text-align: center;
}

.abonnez-vous-slider-communauté-beauté img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

/* End section commaunity */

/* start section abonnez vous */

section.abonnez-vous {
    padding: 0px 30px 12px;
    text-align: center;
    /* background: #f5f5f5; */
}

section.abonnez-vous.instagram.marque {
    padding: 50px 30px 12px;
    text-align: center;
}

section.abonnez-vous.instagram {
    padding: 12px 30px 12px;
    text-align: center;
}

section.abonnez-vous.no-bg {
    background: #fff;
}

section.abonnez-vous h2 {
    font-size: 24px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    padding-bottom: 31px;
    padding-top: 20px;
    letter-spacing: 0.02rem;
}

.img-flex {
    height: 200px;
    width: auto;
    object-fit: cover;
}

.fidelite-one-acceuil {
    font-size: 1.5rem;
    margin-left: 20px;
    display: flex;
    align-items: center;
    height: auto !important;
}


section.abonnez-vous h5 {
    font-size: 18px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    color: var(--Heading_color);
    margin-bottom: 45px;
}

section.abonnez-vous .item {
    padding: 0 10px;
    position: relative;
}

/* .abonnez-vous-slider-visite-virtuel .slick-slide img {
    width: auto;
    height: auto;
    max-width: 100%;
    display: block;
    margin: 0 auto;
} */

/* .abonnez-vous-slider-visite-virtuel .item {
    width: auto !important;
    text-align: center;
} */


section.abonnez-vous:not(.instagram) .item::after {
    position: absolute;
    content: "";
    width: 56px;
    height: 40px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url(../images/playyoutube.png);
    cursor: pointer;
    pointer-events: none;
}

/* section.abonnez-vous .item img {
    width: auto;

} */

section.abonnez-vous.instagram-centre-mahassen .item img {
    width: 100%;

}

section.abonnez-vous .slick-slider {
    margin: 0 -15px;
}

/* Start section abonnez vous inspirez vous */
.abonnez-vous-slider-inspirez-vous-slider {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.abonnez-vous-slider-inspirez-vous-slider .slick-slide {
    display: flex !important;
    justify-content: center;
    align-items: center;
    float: none !important;
    text-align: center;
}

.abonnez-vous-slider-inspirez-vous-slider img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    display: block;
}

/* End section abonnez vous inspirez vous */
/* Start section abonnez vous visite virtuel */
/* .abonnez-vous-slider-visite-virtuel {
    display: flex !important;
    justify-content: center;
    align-items: center !important;
    flex-wrap: nowrap;
} */

/* .abonnez-vous-slider-visite-virtuel .item {
    display: inline-block !important;
    flex: 1 !important;
    margin-right: 15px !important;
    text-align: center !important;
}

.abonnez-vous-slider-visite-virtuel img {
    width: auto !important;
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
} */

/* End section abonnez vous visite virtuel */
section.newsletter {
    padding: 20px 0 45px;
    text-align: center;
}

section.newsletter h2 {
    font-size: 22px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 8px;
    letter-spacing: 0.02rem;
}

section.newsletter span {
    font-size: 19px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.01rem;
}

section.newsletter .email {
    max-width: 1050px;
    margin: 35px auto 0;
    display: grid;
    grid-template-columns: auto 238px;
    gap: 20px
}

section.newsletter .email input[type="email"] {
    padding: 16px;
    border: 1px solid #382e2e;
    outline: none;
}

section.newsletter .email .inscrire {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
}

section.newsletter .email .inscrire:hover {
    opacity: 0.5;
}


/* end section abonnez vous */


/* start section icons */

section.icons {
    padding: 50px 0;
    text-align: center;
}

section.icons .container-fluid {
    position: relative;
}

section.icons .container-fluid:after {
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    bottom: 0;
    width: 15px;
    height: 100%;
    background: var(--white-color);
}

section.icons .container-fluid::before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    bottom: 0;
    width: 15px;
    height: 100%;
    background: var(--white-color);
}

section.icons .item-desc img {
    margin: 0 auto 28px;
}

section.icons .item {
    position: relative;
    padding: 0 10px;
}

/* section.icons .item:after {
    position: absolute;
    content: "";
    height: 100%;
    width: 1px;
    background: #e6e6e6;
    right: 0;
    top: 0;
    bottom: 0;
} */


/* e6e6e6 */

section.icons .item-desc h5 {
    font-size: 13px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: bold;
    color: var(--Heading_color);
    margin-bottom: 20px;
}


/* end section icons */


/* start footer */

section.footer {
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 52px 25px 25px;
    border-bottom: 2px solid #2e2e2e;
}

section.footer .footer-content {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 60px;
}

section.footer .footer-content h3 {
    font-size: var(--Brand_title_size_level_seven);
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    font-weight: bold;
    color: var(--white-color);
    margin-bottom: 25px;
}

section.footer .footer-content span {
    margin-bottom: 12px;
    display: block;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.55px;
}

section.footer .footer-content h3 span {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: initial;
    display: block;
    margin-top: 10px;
}

section.footer .footer-content .adresse {
    padding-left: 25px;
    background-image: url(../images/icon-maps.png);
    background-position: top 3px left;
    background-repeat: no-repeat;
    margin-bottom: 20px;
}

section.footer .footer-content .telephone a,
section.footer .footer-content .email a {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    text-transform: initial;
    display: block;
    color: var(--white-color);
    text-decoration: none;
}

section.footer .footer-content .telephone a span,
section.footer .footer-content .email a span {
    margin: 0;
}

section.footer .footer-content .telephone {
    padding-left: 25px;
    background-image: url(../images/icon-tel.png);
    background-position: top 4px left;
    background-repeat: no-repeat;
    margin-bottom: 20px;
}

section.footer .footer-content .email {
    padding-left: 25px;
    background-image: url(../images/icon-email.png);
    background-position: top 7px left;
    background-repeat: no-repeat;
}

.footer-networks {
    background: var(--Heading_color);
    color: var(--white-color);
    padding: 0 21px;
}

.footer-networks a {
    color: var(--white-color);
}

.footer-networks i {
    font-size: 14px;
    font-weight: bold;
    margin-right: 5px;
    cursor: pointer;
}

.footer-networks .carte-banck {
    display: flex;
    gap: 15px;
}


/* end footer */


/* ===============================================
            start page centre mahassen
=============================================== */


/* start marketing */

.header-marketing {
    height: auto;
    position: relative;
}

.header-marketing:after {
    position: absolute;
    content: "";
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    background: #00000020;
    z-index: 0;
}

.header-marketing img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header-marketing .header-marketing-icons {
    position: absolute;
    top: 50%;
    right: 0;
    color: var(--white-color);
    z-index: 1;
}

.header-marketing .header-marketing-icons {
    position: absolute;
    top: 50%;
    right: 0;
    color: var(--white-color);
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 20px;
    transform: translateY(-50%);
    overflow: hidden;
    width: auto;
}

.header-marketing .header-marketing-icons a {
    display: flex;
    background: var(--Heading_color);
    gap: 13px;
    text-transform: uppercase;
    font-size: var(--Brand_title_size_level_seven);
    font-weight: 400;
    width: auto;
    padding: 15px;
    color: var(--white-color);
    text-decoration: none;
    align-items: center;
    position: relative;
    right: -162px;
    transition: right 2s;
    font-size: 13px;
}

li.breadcrumb-item a {

    font-size: 14px;
    color: white;

}

.header-marketing .header-marketing-icons a:hover {
    right: 0;
}

.header-marketing .header-marketing-icons a i {
    font-size: 14px;
}

.header-marketing .header-marketing-desc {
    position: absolute;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    text-align: center;
    color: var(--white-color);
    z-index: 1;
}

.header-marketing .header-marketing-desc.meilleur {
    width: 100%;
}

.header-marketing .header-marketing-desc h1 {
    font-size: 28px;
    font-weight: 700;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-transform: uppercase;
    letter-spacing: 0.15rem;
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
}

li.breadcrumb-item a:hover {
    color: #fff;
}

.breadcrumb-item+.breadcrumb-item::before {
    color: #fff;
}

.header-marketing .header-marketing-desc p {
    font-size: 14px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
}

.header-marketing .header-marketing-desc.meilleur p {
    width: 53%;
    margin: 0 auto;
}

a.decouvre {
    font-size: 16px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-decoration: none;
    color: white;
    background: black;
    padding: 20px;
    width: 240px;
    height: 60px;
    clear: both;
    display: table;
    margin: 30px auto 0;
    text-transform: uppercase;
    transition: opacity 2s;
}

a.decouvre:hover {
    opacity: .5;
}


/* end marketing */


/* start section nouveaute */

section.collection.mah-nouveaute {
    position: relative;
    padding-left: 35px;
    padding-right: 35px;
}

section.collection.mah-nouveaute .content-img {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .content-img-collection {
    padding-right: 160px;
    width: 100%;
}


.content-img-collection {
    margin-left: 70px;
}


section.actualité-blogs {
    margin-top: 50px;
}


section.collection.mah-nouveaute .content-img.shine-two {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .content-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.collection.mah-nouveaute .contents-img {
    padding-right: 160px;
    height: 722px;
    width: 100%;
}

section.collection.mah-nouveaute .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.collection.mah-nouveaute div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    right: 50%;
    transform: inherit;
    bottom: 0;
    max-width: 462px;
}

.carousel-control-next-icon,
.carousel-control-prev-icon {
    display: none;
}

section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 0;
    gap: 30px;
    left: 0;
}


/* end section nouveaute */


/* start section hamam */

.cont-description {
    width: 85%;
    margin-top: 42px;
}

.cont-description-section-la-marque {
    width: 85%;
    margin-top: 42px;
    margin-left: 30px;
}

section.lamarque .cont-description {
    width: 100% !important;
    margin-top: 0px;

}

section.lamarque .cont-description-section-la-marque {
    width: 100% !important;
    margin-left: 30px;

}

section.hamam .cont-description {
    margin-top: 50px;
}

section.hamam {
    padding: 0 35px 0;
    position: relative;
    margin: 50px 0 50px;
}

section.hamam .hamam-img {
    background: url(../images/mahassen-centre1.jpg) left no-repeat;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 43%;
}

section.hamam .hamam-img .content-img {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}


section.hamam .hamam-img .content-img-hammem {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}



section.hamam .hamam-img .content-img-hammem img {
    width: 100%;
    height: 100%;
}

section.hamam .hamam-img .content-img img {
    width: 100%;
    height: 100%;
}


section.hamam .hamam-img .contents-img {
    /* width: 50%; */
    /* height: 50%; */
    position: absolute;
    bottom: -40%;
    right: 8%;
}

section.hamam .hamam-img .contents-img img {
    width: 100%;
    height: 100%;
}

/* end section hamam */


/* start section massage */

section.massage {
    padding: 50px 35px;
    position: relative;
}

section.massage .hamam-img {
    position: relative;
}

section.massage:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.massage.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.massage.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.content-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    line-height: 31px;
    font-size: 18px !important;
    text-align: justify;
}

section.massage .content-img {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    /* padding-right: 50px; */
}

/* a.close-carte {
    color: #000000 !important;
    vertical-align: middle;
    height: 52px;
    display: table-cell;
} */

section.massage .content-img-la-marque {
    text-align: center;
    width: 50%;
    margin: 0 auto;
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    /* padding-right: 50px; */
}

.button-space {
    margin-right: 10px;
}

section.massage .content-img img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .content-img-la-marque img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .contents-img {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    padding-right: 50px;
}

section.massage .contents-img-la-marque {
    text-align: center;
    width: 50%;
    /* margin: 0 auto; */
    width: 100%;
    /* height: 555px; */
    object-fit: cover;
    padding-right: 50px;
}

section.massage .contents-img img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}

section.massage .contents-img-la-marque img {
    width: 100%;
    /* height: 100%; */
    object-fit: contain;
}



/* end section massage */


/* start section la Marque */

section.lamarque {
    position: relative;
    padding-right: 46px;
    padding-left: 32px;
    padding-top: 70px;
    padding-bottom: 70px;
}

.live-slider.slick-initialized.slick-slider .item {
    /* height: 594px; */
}

.live-slider.slick-initialized.slick-slider img {
    width: 100%;
    /* height: 100%; */
    object-fit: cover;
}


section.lamarque:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 50%;
    bottom: 0;
    z-index: -1;
}

section.lamarque .slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    left: inherit;
    right: 60px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    bottom: -80px;
}

section.lamarque .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    background: url(../images/btnleft.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}

section.lamarque .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    left: inherit;
    right: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    bottom: -80px;
}

section.lamarque .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/* end section la Marque */


/* start page esthetique-home */

section.esthetique-home {
    padding: 50px 35px;
    background: #f5f5f5;
    margin-top: 50px;
    padding-bottom: 80px;
}

section.esthetique-home .content-slider-home {
    padding-left: 50px;
    position: relative;
}

section.esthetique-home span.count-slide-position {
    /* position: absolute; */
    /* bottom: -78px; */
    /* left: 145px; */
    font-size: 32px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.esthetique-home .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    -webkit-transform: inherit !important;
    -ms-transform: inherit !important;
    transform: inherit !important;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: 0;
    background: 0 0;
    left: 185px;
    bottom: 0px !important;
}

section.esthetique-home .slick-prev {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: inherit;
    display: block;
    width: 51px;
    height: 51px;
    padding: 0;
    -webkit-transform: inherit !important;
    -ms-transform: inherit !important;
    transform: inherit !important;
    cursor: pointer;
    color: transparent;
    border: none;
    outline: 0;
    background: 0 0;
    right: inherit;
    bottom: 0px !important;
    left: 0;
}

section.esthetique-home .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
}

section.esthetique-home .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: -0;
    left: 0;
    font-weight: 300;
}

section.esthetique-home .content-img {
    height: 967px;
}

section.esthetique-home .content-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.esthetique-home .contents-img {
    height: 967px;
}

section.esthetique-home .contents-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.esthetique-home h2 {
    font-size: 41px;
    text-align: center;
    margin-bottom: 50px;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.esthetique-home h3 {
    font-size: 31px;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.esthetique-home p {
    font-size: 18px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    margin-bottom: 50px;
    text-align: justify;
    line-height: 35px;
    margin-top: 50px;
    color: black;
}

section.esthetique-home .homme-slider.slick-initialized.slick-slider .item {
    height: 465px;
}

section.esthetique-home .content-img-abs {
    position: relative;
    width: 100%;
    height: 100%;
}

section.esthetique-home .content-img-abs img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 415px;
    height: 375px;
    object-fit: cover;
}

section.esthetique-home .contents-img-abs {
    position: relative;
    width: 100%;
    height: 100%;
}

section.esthetique-home .contents-img-abs img {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 415px;
    height: 375px;
    object-fit: cover;
}


/* end page esthetique-home */


/* ===============================================
            end page centre mahassen
=============================================== */


/* ===============================================
            start page maquillage
=============================================== */


/* start section collection.mah-nouveaute.maquillage */

section.collection.mah-nouveaute.maquillage {
    background: white;
    padding: 50px 37px 65px;
}

section.collection.mah-nouveaute.maquillage .desc_collection {
    padding: 55px 0 0;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    left: 37px;
    right: inherit;
    transform: inherit;
    bottom: 0;
    max-width: 472px;
    z-index: 1;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
    position: absolute;
    top: inherit;
    left: 37px;
    right: inherit;
    transform: inherit;
    bottom: -189px;
    max-width: 472px;
    z-index: 1;
}

section.collection.mah-nouveaute.maquillage .content-img {
    padding-right: 0;
    height: 700px;
    max-width: 722px;
    margin-left: auto;
}

section.collection.mah-nouveaute.maquillage .content-img-collection {
    padding-right: 0;
    max-width: 722px;
    margin-left: auto;
}


section.collection.mah-nouveaute.maquillage .contents-img {
    padding-right: 0;
    height: 700px;
    max-width: 722px;
    margin-left: auto;
}

section.collection.mah-nouveaute.maquillage .desc_collection {
    padding: 55px 0 0 20px;
}

section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
    bottom: 170px;
    gap: 30px;
    right: -141%;
    left: inherit;
}


/* end section collection.mah-nouveaute.maquillage */


/* start collection.mahassen */

section.collection.mahassen {
    padding: 50px 37px 50px;
    margin-top: 120px;
    background: #f5f5f5;
}

section.collection.mahassen h2 {
    font-size: var(--Brand_title_size_level_forth);
    font-weight: 700;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-align: center;
    margin-bottom: 50px;
}

section.collection.mahassen .slick-slider {
    margin: 0 -22px;
}

section.collection.mahassen .item {
    padding: 0 22px;
}

section.collection.mahassen .item .product-item {
    height: 454px;
    margin-bottom: 25px;
}

section.collection.mahassen .item img {
    height: 100%;
    background-size: cover;
}

section.collection.mahassen .item a {
    text-decoration: none;
}

section.collection.mahassen .item h4 {
    text-align: center;
    text-decoration: none;
    color: black;
    font-size: 28px;
    margin: 15px 0 15px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
}

section.collection.mahassen .slick-dots {
    bottom: -39px;
}

section.collection.mahassen .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 10px;
    height: 10px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: 0;
    background: black !important;
    color: black !important;
    border-radius: 50%;
    margin: 0 auto;
}

section.collection.mahassen .slick-dots li.slick-active button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 25px;
    height: 25px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: 0;
    background: transparent !important;
    color: transparent !important;
    border-radius: 50%;
    margin: 0 auto;
    border: 2px solid #989898;
}


/* end collection.mahassen */


/* start section product cosmetique maquillage */

section.product-cosmetique.maquillage {
    padding: 50px 0 40px;
    background: white;
}

section.product-cosmetique.maquillage.maquillage2 {
    padding: 20px 0 20px;
    background: white;
}

section.product-cosmetique.maquillage h2 {
    font-size: var(--Brand_title_size_level_forth);
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 50px;
}


/* end section product cosmetique maquillage */


/* start section idees */

section.idees {
    padding: 50px 37px 50px;
    background: #f5f5f5;
}

section.idees .slick-slider {
    margin: 0 -24px;
}

section.idees .item-desc {
    text-align: center;
}

section.idees h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 70px;
}

section.idees .item {
    padding: 0px 37px;
    display: inline-block;
}

button.btn-ajouter.ajouter.shine {
    height: 42px;
    width: 100%;
    outline: none;
    background: #1e1e1e !important;
    color: white;
    margin-bottom: 30px;
    text-transform: uppercase;
    outline: none;
    border: none;
}

/* section.idees .product-item {
    height: 685px !important;
} */

section.idees .item .product-item:nth-child(odd) {
    margin-bottom: 45px;
}


section.idees .item .product-item:nth-child(even) {
    margin-top: 45px;
}

section.idees .item .product-item img {
    /* height: 100%; */
    background-size: cover;
}

section.idees .item a {
    text-decoration: none;
}

section.idees .item .item-desc h4 {
    color: #000 !important;
    font-family: var(--Brand_title_fonts);
    font-size: 22px;
}

section.idees .item .item-desc p {
    color: #000 !important;
    font-weight: 300;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
    text-transform: capitalize;
    padding: 0 15px;
    margin: 0;
}


/* end section idees */


/* ===============================================
            end page maquillage
=============================================== */


/* ================== start section inscrivez-vous */

section.inscrivez-vous {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #4c4c4ce3;
    z-index: 55;
    display: none;
}

section.inscrivez-vous .container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

section.inscrivez-vous .inscrivez-vous-description {
    padding: 45px 50px 45px 65px;
}

section.inscrivez-vous .inscrivez-vous-description h2 {
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.02rem;
}

section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
    font-size: 15px;
    font-weight: 400;
    margin: 0 0 15px;
    font-family: var(--Brand_title_fonts);
    line-height: 30px;
    letter-spacing: 0.1rem;
    color: #adaaaa;
}

section.inscrivez-vous .inscrivez-vous-description p:last-of-type {
    font-size: 13px;
    font-weight: 400;
    margin: 0 0 15px;
    font-family: var(--Brand_title_fonts);
    line-height: 23px;
    color: #000;
    text-transform: uppercase;
}

section.inscrivez-vous .content_networks-pop-up {
    display: flex;
    gap: 15px;
}

section.inscrivez-vous .content_networks-pop-up a {
    color: black;
    transition: all 2s;
}

section.inscrivez-vous .content_networks-pop-up a:hover {
    opacity: .5;
}

section.inscrivez-vous .inscrivez-vous-description .email {
    display: grid;
    grid-template-columns: auto 130px;
    gap: 10px;
    width: 73%;
    margin-bottom: 25px;
}

section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
    height: 40px;
    border: 1px solid #000;
    padding: 9px;
    outline: none;
    color: #7f7f7f;
}

section.inscrivez-vous .inscrivez-vous-description .email input[type="email"]::placeholder {
    font-size: 13px;
}

section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 13px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
}

section.inscrivez-vous .inscrivez-vous-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.content-inscrivez-vous {
    display: grid;
    grid-template-columns: 70% 30%;
    background: white;
    position: relative;
    gap: 1px;
    max-width: 930px;
}

.content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
    position: absolute;
    top: -19px;
    right: -16px;
    padding: 10px;
    background: black;
    color: white;
    transition: opacity 2s;
    cursor: pointer;
    z-index: 1;
}

.content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark:hover {
    opacity: .5;
}


/* ================== end section inscrivez-vous */


/* ============================================
                 start page fond de teint
============================================ */


/* start navigayions links */

.navigation-links {
    text-align: center;
    padding: 0 50px;
}

.navigation-links .container-fluid {
    padding: 166px 0;
    height: 100%;
    background: #00000020;
}

.header-marketing .header-marketing-desc h2 {
    font-family: var(--Brand_title_fonts);
    letter-spacing: 0.15rem;
    font-weight: 700;
}

.navigation-links h1 {
    font-size: 32px;
    font-weight: 700;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    letter-spacing: 0.15rem;
    -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    color: #fff;
}

.navigation-links .breadcrumb {
    justify-content: center;
    margin: 0;
}

.navigation-links nav {
    border: none;
    color: #505050;
}

.navigation-links li.breadcrumb-item,
.navigation-links li.breadcrumb-item a {
    font-family: var(--Brand_title_fonts);
    height: 100%;
    font-weight: 300;
    text-decoration: none;
    white-space: nowrap;
    color: #505050;
    font-size: 15px;
    font-weight: 500;
}

.navigation-links li.breadcrumb-item {
    font-size: 14px;
}

.navigation-links li.breadcrumb-item a {
    font-size: 14px;
}

.navigation-links li.breadcrumb-item a {
    text-decoration: underline;
    text-transform: none
}


/* end navigayions links */


/* start section fond-de-tient-details */

section.fond-de-tient-details {
    padding: 50px 33px 50px;
}

section.fond-de-tient-details .content-img {
    display: flex;
    gap: 20px;
    width: 100%;
}

section.fond-de-tient-details .contents-img {
    display: flex;
    gap: 20px;
    width: 100%;
    justify-content: center;
}

.same-height {
    display: flex;
    align-items: stretch;
}

.same-height-img {
    height: 100%;
    object-fit: cover;
    width: auto;
}

.img-fluid-categorie {
    max-width: 100%;

}

section.fond-de-tient-details .content-img .content-one {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* width: -webkit-fill-available; */
}

section.fond-de-tient-details .contents-img .content-one {
    display: flex;
    flex-direction: column;
    gap: 20px;
    /* width: -webkit-fill-available; */
}


section.fond-de-tient-details .contents-img .content-one .content-one-img {
    position: relative;
    height: 400px;
    display: flex;
    align-content: center;
    justify-content: center;
}

section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: inherit;
    left: inherit;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}


section.fond-de-tient-details .contents-img .content-one .content-one-img .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: 20px;
    bottom: inherit;
    left: inherit;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}

section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.fond-de-tient-details .contents-img .content-one .content-one-img .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.fond-de-tient-details .content-img .content-one .content-one-img:hover .fa-regular.fa-heart {
    display: block;
}

section.fond-de-tient-details .contents-img .content-one .content-one-img:hover .fa-regular.fa-heart {
    display: block;
}

section.fond-de-tient-details .content-img .content-one-img a.fancybox img {
    width: 100%;
    object-fit: cover;
    height: 100%;
}

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





.select_wrap select {
    border: none;
    border-radius: 0;
    padding: 8px 15px;
    margin-right: 10px;
    background: #f7f7f7;
}

.select_wrap {
    margin: 20px 0;
}

.select_wrap select:focus-visible {
    outline: none;
}

.select_wrap ul {
    list-style: none;
    padding: 0;
}

.select_wrap .default_option {
    background: #fff;
    border-radius: 5px;
    position: relative;
    cursor: pointer;
    border: 1px solid #e4e3e3;
}

.select_wrap .default_option:before {
    content: "";
    position: absolute;
    top: 18px;
    right: 18px;
    width: 16px;
    height: 16px;
    border: 2px solid;
    border-color: transparent transparent #555555 #555555;
    transform: rotate(-45deg);
}

.select_wrap .select_ul {
    position: absolute;
    top: 56px;
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 5px;
    display: none;
    -webkit-box-shadow: 3px 3px 26px -6px rgb(165 160 160);
    -moz-box-shadow: 3px 3px 26px -6px rgba(165, 160, 160, 1);
    box-shadow: 3px 3px 26px -6px rgb(165 160 160);
}

.select_wrap .select_ul li {
    cursor: pointer;
}

.select_wrap .select_ul li:first-child:hover {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.select_wrap .select_ul li:last-child:hover {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.select_wrap .option {
    display: flex;
    align-items: center;
    height: 54px;
    box-sizing: border-box;
    padding: 0 15px 0 20px;
}

.select_wrap .option p {
    margin: 0;
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: #454545;
}

.select_wrap .option .icon {
    background: url('../images/teinte-plan.png') no-repeat 0 0;
    width: 32px;
    height: 32px;
    margin-right: 15px;
}

.select_wrap .option.teinte-num0 .icon {
    background-position: 0 -10px;
}

.select_wrap .option.teinte-num1 .icon {
    background-position: 0 -64px;
}

.select_wrap .option.teinte-num2 .icon {
    background-position: 0 -120px;
}

.select_wrap .option.teinte-num3 .icon {
    background-position: 0 -173px;
}

.select_wrap .option.teinte-num4 .icon {
    background-position: 0 -227px;
}

.select_wrap .option.teinte-num5 .icon {
    background-position: 0 -282px;
}

.select_wrap .option.teinte-num6 .icon {
    background-position: 0 -335px;
}

.select_wrap.active .select_ul {
    display: block;
    z-index: 1;
}

.select_wrap.active .default_option:before {
    top: 25px;
    transform: rotate(-225deg);
}


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

.fond-de-tient-description .avis {
    margin-top: 15px;
}


/* .fond-de-tient-description {
    padding-left: 65px;
} */

.fond-de-tient-description h2 {
    margin-bottom: 15px;
    text-transform: uppercase;
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 4px;
}



.fond-de-tient-description h3 {
    color: #f33f38;
    font-size: 20px;
    /* font-weight: 600; */
    margin-bottom: 7px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
}

.select_wrap label {
    font-size: 14px;
}

.fond-de-tient-description .content-img-fond-de-tient img {
    width: 300px;
}

.fond-de-tient-description .contents-img-fond-de-tient img {
    width: 300px;
}


.avis img {
    width: 17px;
}

.fond-de-tient-description p {
    font-size: 14.5px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 0;
    text-align: justify;
}

.fond-de-tient-description h5,
.fond-de-tient-description h5 span {
    color: #f33f38;
    font-size: 16px;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    margin-top: 9px;
}

.fond-de-tient-description span.all-avis {
    color: #737373;
    display: inline-block;
    margin: 0 20px 0 10px;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
}

.fond-de-tient-description span.rediger-avis {
    color: #737373;
    font-family: var(--Brand_title_fonts);
    font-size: 15px;
}

.fond-de-tient-description .content-img-fond-de-tient {
    margin-bottom: 30px;
}

.fond-de-tient-description .contents-img-fond-de-tient {
    margin-bottom: 30px;
}

.fond-de-tient-description button.btn-ajouter {
    height: 41px;
    width: 100%;
    outline: none;
    background: #1e1e1e;
    color: white;
    margin-bottom: 30px;
    text-transform: uppercase;
    outline: none;
    border: none;
    font-size: 14px;
}

.fond-de-tient-description button.btn-ajouter.ajouter {
    max-width: 100%;
}


/* start section slick */

.content-fond-de-tient {
    padding: 40px 50px 20px;
}

.content-fond-de-tient .item a .item-icons {
    position: absolute;
    bottom: 28px;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    display: none;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}

.content-fond-de-tient .item a:hover .item-icons {
    display: block;
}

.content-fond-de-tient .item a .item-icons {
    padding: 7px 2px;
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 13px;
    transition: all 2s;
    width: 143px;
}

.content-fond-de-tient h3 {
    text-align: center;
    font-size: 21px;
    margin-bottom: 21px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    color: #000;
}

.content-fond-de-tient .item-descc {
    padding-top: 12px;
}

.content-fond-de-tient .item-descc p {
    font-size: 15px;
    text-align: center;
}

.content-fond-de-tient h5 {
    font-size: 15px;
    margin-top: 5px;
}

.content-fond-de-tient .item-desc p {
    font-size: 15px;
    text-align: center;
}

.content-fond-de-tient .slick-initialized .slick-slide {
    display: block;
    margin: 0 15px;
}

.fond-de-tient-description .product-item {
    margin: 0 auto 0;
}

.fond-de-tient-description .product-item img {
    width: 100%;
    /* height: 307px; */
}

.fond-de-tient-description .item a {
    text-align: center;
    text-decoration: none;
}

.fond-de-tient button.slick-prev.slick-arrow,
.fond-de-tient button.slick-next.slick-arrow {
    display: none !important;
}


/* end section click */


/* end section fond-de-tient-details */


/* start page coupe */

.fond-de-tient-description.coupe {
    height: 100%;
    padding-left: 20px;
    padding-top: 11px;
}

.fond-de-tient-description .grid-avis {
    display: flex;
    gap: 11px;
    margin-top: 22px;
    justify-content: space-evenly;
}

.fond-de-tient-description .grid-avis .btn-increment {
    display: flex;
    height: 41px;
    width: 100%;
    justify-content: space-between;
}

.fond-de-tient-description .grid-avis .btn-increment button.btn-increment-btn {
    width: 42px;
    outline: none;
    border: 1px solid #dad7d7;
    background: #f8f8f8;
    font-size: 23px;
    color: #6f6f6f;
}

.fond-de-tient-description .grid-avis .btn-increment input[type="text"] {
    border: 1px solid #dad7d7;
    border-left: none;
    border-right: none;
    text-align: center;
    width: 100%;
}

.fond-de-tient-description.coupe .grid-avis .btn-increment input[type="text"] {
    width: 100%;
}

.fond-de-tient-description .avis .grid-btn {
    display: grid;
    gap: 11px;
    grid-template-columns: repeat(2, 1fr);
    padding-bottom: 16px;
}

.fond-de-tient-description .avis .grid-btn button {
    outline: none;
    border: none;
    background: #000000;
    color: white;
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px 23PX;
    transition: all 2s;
    width: 100%;
}

.fond-de-tient-description .avis .grid-btn button:hover {
    opacity: .5;
}

.fond-de-tient-description .avis .grid-btn button img {
    display: inline-block;
    margin-right: 7px;
    margin-top: -7px;
}

.fond-de-tient-description p.partager {
    color: #737373;
    font-family: var(--Brand_title_fonts);
}


/* end page coupe */


/* ============================================
                 end page fond de teint
============================================ */


/* ============================================
                 start page coiffure
============================================ */

section.nos-services-coiff {
    padding: 50px 35px;
}

section.nos-services-coiff .grid-nos-services-coiff {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff {
    position: relative;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff img {
    width: 100%;
    object-fit: cover;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff h4 {
    position: absolute;
    bottom: 0;
    text-align: center;
    left: 0;
    right: 0;
    font-size: 19px;
    font-family: var(--Brand_title_fonts);
    font-weight: 700;
    text-transform: uppercase;
    background: #ffffffc7;
    margin: 0;
    padding: 16px 0;
}

section.nos-services-coiff .grid-nos-services-coiff .service-coiff a.service-coiff-link {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
}

div#coiffureCarousel {
    height: 100%;
}

div#coiffureCarousel .carousel-inner {
    height: 100%;
}

div#coiffureCarousel .carousel-inner .carousel-item {
    height: 100%;
}

div#coiffureCarousel .carousel-inner img.d-block.w-100 {
    height: 100% !important;
    object-fit: cover;
}

section.bannierCoiff {
    padding: 50px 35px 0;
}

section.bannierCoiff div#coiffureCarousel2 {
    height: 280px;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner {
    height: 100%;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item {
    height: 100%;
}

section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item img.d-block.w-100 {
    height: 100%;
    object-fit: cover;
}

.content-img-service {
    max-width: 100%;
    height: auto;
}

.content-img-service img {
    /* width: 60px; */
    object-fit: cover;
    /* border-radius: 4px; */
    margin-right: 10px;
}

/* ============================================
                 end page coiffure
============================================ */


/* ============================================
                 responsive
============================================ */
section.collection .desc_collection a.decouvrir:hover,
section.autonome .content-autonome-desc a.decouvrir:hover,
section.maquillage .content-autonome-desc a.decouvrir:hover,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
section.avis-clients a.decouvrir:hover,
section.mahassen-lives .mahassen-live-desc a.decouvrir,
.cont-description a.decouvrir:hover {
    /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
    background-size: 145px !important;
    transition: 1s all ease-out;
}

@media screen and (min-width: 320px) {

    section.collection .desc_collection a.decouvrir:hover,
    section.autonome .content-autonome-desc a.decouvrir:hover,
    section.maquillage .content-autonome-desc a.decouvrir:hover,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
    section.avis-clients a.decouvrir:hover,
    section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
    .cont-description a.decouvrir:hover {
        /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
        background-size: 145px !important;
        transition: 1s all ease-out;
    }

    .content-img img {
        max-width: 100%;
    }

    .content-img-left img {
        max-width: 100%;
    }

    .header-marketing-brushing img {
        min-height: 250px;
    }

    section.content-tabs-brushing .tabsmahassen {
        font-size: 20px;
    }

    section.creation-coupe .creation-img img {
        width: 100%;
        height: auto;
        position: relative;
        bottom: -70px;
        right: 0;
    }

    /* page centreMahassen carroussel */
    .contentSlider {
        display: block;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {
        width: 100%;
        height: 100%;
    }

    .content-img-application-one {
        width: 100%;
        height: 100%;
    }

    .content-img-left {
        width: 100%;
        height: 100%;
    }

    .content-text2 {
        width: 100%;
    }

    section.mahassen-lives .mahassen-live-desc span.live img {
        width: 100%;
        object-fit: cover;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        left: 6%;
        font-size: 6rem;
        bottom: -105px;
        height: 324px;
        width: auto;
        z-index: -1;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: absolute;
        text-align: center;
        width: 100%;
        float: none;
    }

    .carousel-item.shine-two.active {
        min-height: 567px;
        padding: 0 10px;
    }

    .carousel-maquillage .carousel-item.shine {
        min-height: 432px;
        padding: 0 10px;
    }

    /* .carousel-maquillage{
        min-height: 582px;
        padding: 0 10px;
    } */

    /* .carousel-item.shine {
        height: 100%;
        min-height: 730px;
    } */

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 5%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        /* z-index: 999; */
        right: -50px;
    }

    .sliderTop .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        content: "";
        background: url(../images/btnleft.png)center no-repeat;
        height: 20px;
        width: 60px;
    }

    .sliderTop .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 58%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -50px;
    }

    .sliderTop .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png)center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }

    .carousel-innerMake .carousel-inner.item.shine {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: relative;
        text-align: center;
        width: 100%;
        float: left;
        z-index: 999;
        overflow: visible !important;
    }

    section.maquillage div#carouselExampleCaptions2 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 32%;
        display: block;
        width: auto;
        height: 10px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -6px;
    }

    .carousel-innerMake .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 52%;
        display: block;
        width: auto;
        height: auto;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: 0;
    }

    .carousel-innerMake .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 3px;
        left: 0;
        font-weight: 300;
        background: url(../images/btnleft.png)center no-repeat;
        height: 13px;
        width: 60px;
        content: "";
    }

    .carousel-innerMake .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png)center no-repeat;
        height: 33px;
        width: 60px;
        content: "";
    }

    .carousel-maquillage button.slick-prev.slick-arrow,
    .carousel-inner button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 98px;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }



    section.autonome.home .product-maquillage-pro button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 90px;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }

    /* .carousel-maquillage  button.slick-next.slick-arrow, .carousel-inner   button.slick-next.slick-arrow{
        position: absolute;
        top: inherit;
        bottom: 0px;
        right: 35px;
        width: 50px;
        height: auto;
        left: inherit;
    } */
}

@media (max-width: 767px) {

    /* start header */
    .content_slider .carousel-item {
        height: 250px !important;
    }

    .content_slider .carousel-item img.d-block.w-100 {
        object-fit: cover;
    }

    /* end header */
    /* start header icon */
    .header_logo_icons .content_lang {
        margin-bottom: 5px;
        justify-content: space-between;
    }

    .header_logo_icons .header_icons {
        justify-content: center;
        /* margin-top: 33px; */
    }

    /* end header icon */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc span.live {
        left: 2%;
        font-size: 12rem;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 227px;
        height: 227px;
        top: 142px;
        right: 50%;
        transform: translateX(50%);
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 50px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: 0;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 30px;
    }

    /* end section mahassen-lives */
    /* start section autonome */
    section.collection {
        padding-top: 40px;
    }

    section.autonome .content-autonome .picture {
        margin-top: 150px;
    }

    section.autonome .content-autonome {
        display: flex;
        /*grid-template-columns: auto;*/
        flex-direction: column;
    }

    section.autonome .content-autonome .picture {
        order: -1;
    }

    section.autonome .content-autonome .picture {
        margin-bottom: 15px;
        height: 565px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 0px;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 89px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        position: inherit;
        top: inherit;
        left: inherit;
        right: inherit;
        width: auto;
    }

    section.autonome .content-autonome-desc span {
        /*  color: var(--grayLighten_color);*/
        color: black;
    }

    section.autonome .content-autonome-desc p {
        padding-right: 0;
        margin-top: -85px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        position: absolute;
        top: inherit;
        right: 50%;
        transform: translateX(50%);
        flex-direction: row;
        gap: inherit;
        margin: 0;
        bottom: 0;
    }

    /* end section autonome */
    /* start section abonnez-vous */
    section.abonnez-vous {
        padding-top: 20px !important;
        padding-left: 50px;
        padding-right: 50px;
        padding-bottom: 10px;
    }

    section.abonnez-vous.marque,
    .marque-abonnez .abonnez-vous.instagram {
        padding: 10px 50px;
    }

    section.abonnez-vous .slick-slider {
        margin: 0;
    }

    /* end section abonnez-vous */
    /* start section newsletter */


    section.newsletter .email {
        max-width: 90%;
        grid-template-columns: auto 159px;
        gap: 5px;
    }

    /* end section newsletter */
    /* start section maquillage */
    section.maquillage {
        padding: 0px 0px 50px 0px;
        margin-top: 20px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 50px;
    }

    section.maquillage .content-carousel-maquillage {
        margin-top: 50px;
    }

    section.maquillage .video-container {
        height: 545px;
    }

    .maquillage .row .col-md-12.modify {
        padding-left: 0;
        padding-right: 0;
    }

    .maquillage .small-image {
        max-width: 100%;

    }

    .maquillage .small-image-right {
        max-width: 100%;

    }


    section.maquillage div#carouselExampleCaptions3,
    section.autonome div#carouselExampleCaptions2 {
        position: relative;
        top: 40px;
        width: 100%;
        top: inherit;
        left: inherit;
        margin: 0 auto;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -30px;
    }

    /* start section maquillage */
    /* start section nouveaute */
    section.nouveaute {
        padding: 0px
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        bottom: 250px;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
        font-size: 58px;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute {
        position: inherit;
        top: inherit;
        transform: inherit;
        left: inherit;
        margin-bottom: 50px;
        margin-top: 10px;
    }

    /* end section nouveaute */
    /* start section nouveaute */
    section.nouveaute .content-image {
        height: auto;
    }

    /* end section nouveaute */
    /* start section avis */
    section.avis-clients img {
        top: 184px;
    }

    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        padding: 115px 0;
    }

    section.avis-clients h2 {
        font-size: 58px;
        margin-bottom: 130px;
    }

    section.avis-clients .avis-slider .item .author-avis {
        margin-top: 80px;
    }

    section.avis-clients .avis-slider .item .author-avis:after {
        height: 32px;
    }

    section.avis-clients .slick-next:before {
        right: -22px;
        width: 35px;
    }

    section.avis-clients .slick-prev:before {
        left: -22px;
        width: 35px;
    }

    span.slick-prev-index {
        left: -23px;
    }

    span.slick-next-index {
        right: -23px;
    }

    /* end section avis */
    /* start page collection */
    section.collection .desc_collection {
        padding: 252px 0 0;
        gap: 50px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 100%;
        /* height: 750px; */
        margin-left: 0;
        margin-right: 0;
        min-height: auto;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-inner {
        height: 100%;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: -338px;
        left: 33px;
        width: 353px;
        height: 425px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        justify-content: end;
        margin: 0;
    }

    section.collection .collection_hiver .content-img_collection img {
        width: 65%;
        height: auto;
        object-fit: cover;
    }

    /* end page collection */
    /* start section carte-mahassen */
    .slick-next {
        right: 0;
    }

    .slick-prev {
        left: 0;
    }

    section.carte-mahassen {
        padding: 50px 0 100px;
    }

    /* .fidelite-mahassen .carte-mahassen.centre-m {
        padding: 50px 0 !important;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        max-width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 30px auto 95px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 89px;
        margin-left: -10px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 30px;
    }

    /* end section carte-mahassen */
    /* start produit cosmetique */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    section.product-cosmetique .item .item-desc {
        padding: 26px 15px;
    }

    section.product-cosmetique button.slick-next.slick-arrow {
        right: 0;
    }

    section.product-cosmetique .slick-slider {
        margin: inherit;
    }

    section.product-cosmetique .item .product-item .item-icons i {
        padding: 10px;
    }

    /* section p {
        font-size: 18px !important;
    } */

    /* start produit cosmetique */
    /* start section abonnez vous */
    section.abonnez-vous {
        margin-top: 20px;
    }

    /* start section abonnez vous */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px 20px;
    }

    /* end footer */
    /* ===========================================
            start page centre mahassen
    =========================================== */
    /* start section collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
        height: 500px;
        padding-bottom: 40px;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        right: inherit;
        transform: inherit;
        bottom: 0;
        max-width: 100%;
        width: 100%;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -37px;
        left: 0;
    }

    /* end section collection.mah-nouveaute */
    /* start section hamam */
    section.hamam {
        margin: 102px 0 0;
    }

    section.hamam .hamam-img {
        position: relative;
        top: inherit;
        right: inherit;
        bottom: inherit;
        left: inherit;
        height: 400px;
    }

    section.hamam .hamam-img .content-img {
        left: 0;
        bottom: 0;
    }

    /* start section hamam */
    /* start section esthetique-home */
    section.esthetique-home {
        padding: 75px 0 100px;
    }

    section.esthetique-home h2 {
        font-size: 60px;
        margin-bottom: 40px;
    }

    section.esthetique-home .content-slider-home {
        padding-left: 0;
    }

    section.esthetique-home .content-img {
        height: 550px;
        margin-bottom: 50px;
    }

    section.esthetique-home .content-img-abs img {
        bottom: -31px;
        right: 7px;
        width: 215px;
        height: 215px;
    }

    section.esthetique-home .slick-next {
        right: 0;
        left: inherit;
    }

    section.esthetique-home .slick-prev {
        right: 180px;
        left: inherit;
    }

    section.esthetique-home span.count-slide-position {
        left: inherit;
        right: 95px;
    }

    /* start section esthetique-home */
    /* start section massage */
    section.massage {
        padding: 103px 0;
    }

    section.massage .content-img {
        margin-bottom: 35px;
    }

    section.massage .content-img-la-marque {
        margin-bottom: 35px;
    }

    section.massage.coiffure::before,
    section.massage:after {
        height: 643px;
        top: 60px;
    }



    .cont-description {
        width: 100%;
        margin-top: 35px;
    }

    /* end section massage */
    /* start section collection */
    section.collection .desc_collection {
        padding: 201px 0 0;
    }

    /* end section collection */
    /* start  section esthetique-home */
    section.esthetique-home {
        margin-top: 0;
    }

    section.esthetique-home.mah-Centre {
        margin-top: 30px;
    }

    /* end  section esthetique-home */
    /* start section lamarque */
    .live-slider.slick-initialized.slick-slider .item {
        height: auto;
    }

    section.abonnez-vous {
        margin-top: 5px !important;
    }

    section.lamarque:after {
        width: 50%;
        top: inherit;
        right: 50%;
        bottom: 10px;
        height: 620px;
    }

    /* end section lamarque */
    /* ===========================================
            end page centre mahassen
    =========================================== */
    /* ==============================================
                 start page maquillage
    ============================================== */
    /* start header-marketing */
    .header-marketing .header-marketing-desc.meilleur p {
        width: 90%;
    }

    /* end header-marketing */

    /* start fiche Brushing */
    .header-marketing-brushing img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .header-marketing-brushing {
        height: 533px;
        position: relative;
    }

    .header-marketing-brushing .header-marketing-desc h1 {
        font-size: var(--Brand_title_size_level_five);
        font-weight: 700;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        letter-spacing: 0.15rem;
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing-brushing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing-brushing {
        height: 100%;
        position: relative;
        min-height: 100%;
    }

    section.content-tabs-brushing {
        padding: 50px;
        height: 100%;
        max-width: 1330px;
        margin: 0 auto;
        padding-bottom: 0;
    }

    section.content-tabs-brushing p {

        font-size: 16px;
        line-height: 40px;
    }

    section.product-cosmetique.fiche h2 {
        padding-bottom: 60px;
    }

    section.product-cosmetique.fiche .item .product-item {
        height: 100%;
        position: relative;
    }

    /* start marketing */


    .header-marketing:after {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background: #00000020;
        z-index: 0;
    }



    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
        display: flex;
        flex-direction: column;
        transform: translateY(-50%);
        overflow: hidden;
        width: auto;
        display: none;
    }

    .header-marketing .header-marketing-icons a {
        display: flex;
        background: var(--Heading_color);
        text-transform: uppercase;
        font-size: var(--Brand_title_size_level_seven);
        font-weight: 400;
        width: auto;
        padding: 15px;
        color: var(--white-color);
        text-decoration: none;
        align-items: center;
        position: relative;
        right: -131px;
        transition: right 2s;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons a i {
        font-size: 18px;
    }

    .header-marketing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-desc.meilleur {
        width: 100%;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: var(--Brand_title_size_level_five);
        font-weight: 700;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        letter-spacing: 0.15rem;
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing .header-marketing-desc p {
        font-size: 24px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        -moz-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        -webkit-text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
        text-shadow: 6px 5px 8px rgba(0, 0, 0, 0.5);
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
    }

    a.decouvre {
        font-size: 16px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        text-decoration: none;
        color: white;
        background: black;
        padding: 20px;
        width: 240px;
        height: 60px;
        clear: both;
        display: table;
        margin: 30px auto 0;
        text-transform: uppercase;
        transition: opacity 2s;
    }

    a.decouvre:hover {
        opacity: .5;
    }


    /* end marketing */
    /* start section idees */
    section.idees .slick-slider {
        margin: inherit;
    }

    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* start section collection.mahassen */
    section.collection.mahassen {
        margin-top: 0;
    }

    section.collection.mahassen .item {
        padding: 0px 5px;
    }

    section.collection.mahassen .slick-slider {
        margin: inherit;
    }

    /* end section collection.mahassen */
    /* start section mahassen-lives */
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end section mahassen-lives */
    /* start collection.mah-nouveaute.maquillage */
    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 30px 0 0 0;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        max-width: 100%;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        transform: inherit;
        bottom: inherit;
        max-width: inherit;
        z-index: 1;
        margin-bottom: 73px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        right: 0;
        left: 0;
        bottom: -22px;
        position: absolute;
    }

    /* end collection.mah-nouveaute.maquillage */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez-vous */
    /* ==============================================
                 end page maquillage
    ============================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */
    .content-inscrivez-vous {
        grid-template-columns: auto;
        width: 80%;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        order: 1;
        padding: 20px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        grid-template-columns: auto;
        width: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
        height: 40px;
    }

    .inscrivez-vous-img {
        order: 0;
        height: 241px;
        padding-top: 0;
    }

    section.inscrivez-vous .inscrivez-vous-img img {
        object-fit: cover;
    }


    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        width: 100%;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links {
        padding: 0 10px;
    }

    section.fond-de-tient-details {
        padding: 50px 0 0;
    }

    section.fond-de-tient-details {
        padding: 50px 0;
    }

    section.fond-de-tient-details .content-img {
        margin-bottom: 45px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px 18px;
        -webkit-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
        -moz-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
        box-shadow: 3px 8px 26px -21px rgb(165 160 160);
    }

    /* end page fond de tient */
    /* start page coupe */
    .fond-de-tient-description .grid-avis {
        flex-direction: column;
    }

    .fond-de-tient-description .avis .grid-btn {
        grid-template-columns: repeat(1, 1fr);
    }

    section.fond-de-tient-details .content-img .content-one {
        gap: 15px;
    }

    /* coupe page coupe */
    /* start page coiffure */
    div#coiffureCarousel {
        padding-bottom: 40px;
    }

    section.bannierCoiff {
        padding: 40px 35px;
    }

    section.nos-services-coiff {
        padding: 50px 35px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        grid-template-columns: repeat(2, 1fr);
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 15px;
    }

    /* end page coiffure */

    /*Start page home*/

    section.icons {
        padding: 20px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 50px;
        padding-left: 65px;
        /* padding-top: 1px; */
    }


    section.autonome .content-autonome-desc p {
        padding-top: 20px;
    }

    .video-wrapper {
        display: flex;
    }

    .maquillage .content-video .small-image {
        margin-top: 0px;
    }

    .maquillage .content-video .small-image-right {
        margin-top: 0px;
    }



    .maquillage .content-video {
        display: flex;
        justify-content: center;
    }

    .maquillage .content-video .small-image {
        width: 100%;
        object-fit: cover;
    }

    .maquillage .content-video .small-image-right {
        width: 100%;
        object-fit: cover;
    }

    .nouveaute .container-fluid .row .order-2 {
        order: 2 !important;
    }

    .nouveaute .container-fluid {
        flex-direction: column;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(29% - -8px) !important;
        transform: translateX(50%);
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(86% - 70px) !important;
        transform: translateX(100%);
    }

    /* .avis-clients {
        margin-top: 30px;
    } */

    .carte-mahassen.centre-m .content-carte-mahassen .content-carte-one div span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 14px;
        text-align: justify;
        line-height: 29px;
    }



    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 14px ;
    }

    section.esthetique-home p {
        font-size: 14px ;
    }

    section.autonome .content-autonome-desc p {
        text-align: justify;
    }

    /*end page home*/
}

@media (max-width: 480px) {

    /* start header */
    .header_logo_icons {
        padding: 30px 0 19px;
    }

    .header_logo_icons img {
        width: auto;
    }

    .header_logo_icons .content_lang {
        /* display: inherit; */
        text-align: center;
    }

    .header_logo_icons .lang-menu .selected-lang {
        margin-bottom: 20px;
    }

    .header_logo_icons .lang-menu ul.languages_uses {
        right: inherit;
    }

    /* end header */
    /* start section carte-mahassen */
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 30px auto 56px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 33px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one button {
        font-size: 13px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 37px;
        margin: 0;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: auto;
        height: 100%;
        text-align: left;
        padding-bottom: 108px;
        margin-left: 0;
        font-size: var(--Brand_para_size);
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-top: 35px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0;
    }

    section.carte-mahassen .content-carte-mahassen span.profiter {
        font-size: 14px;
    }

    /* end section carte-mahassen */
    /* start section collection */
    section.collection .desc_collection {
        padding: 10px 0 0;
    }

    section.collection .desc_collection .spa {
        height: 100px;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 289px;
        /* left: 0px; */
        width: 100%;
        height: auto;
        position: relative;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: 345px !important;
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: 0;
    }

    section.collection .desc_collection a.decouvrir,
    section.autonome .content-autonome-desc a.decouvrir,
    section.maquillage .content-autonome-desc a.decouvrir,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
    section.avis-clients a.decouvrir,
    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        font-size: 15px;
    }

    section.collection .collection_hiver .carousel-indicators {
        gap: 8px;
    }

    .carousel-caption {
        right: 15px;
        bottom: 60px;
        left: 15px;
    }

    /* end section collection */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc span.live {
        left: 6%;
        font-size: 6rem;
        bottom: -105px;
    }

    /* end section mahassen-lives */
    /* start section maquillage */
    section.maquillage .content-autonome-desc h2 {
        font-size: 27px !important;
    }

    section.maquillage .video-container {
        height: 445px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner img {
        height: 450px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        bottom: 63px;
    }

    section.maquillage .direction-sm {
        flex-direction: column;
    }

    /* end section maquillage */
    /* start section avis */
    section.newsletter .email {
        grid-template-columns: auto;
    }

    section.newsletter .email .inscrire {
        padding: 10px;
    }

    section.avis-clients img {
        top: 133px;
    }

    section.avis-clients .slick-next:before {
        right: -26px;
    }

    section.avis-clients .slick-prev:before {
        left: -26px;
    }

    /* end section avis */
    /* start section autonome */
    section.autonome .content-autonome .picture {
        height: 365px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        bottom: 133px;
        width: 100%;
        transform: inherit;
        left: 0;
        right: 0;
    }

    section.maquillage div#carouselExampleCaptions3 {
        height: 650px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: auto;
    }

    .carousel-innerMake .slick-prev {
        top: 10%;
    }

    .carousel-innerMake .slick-next {
        right: 5px;
        top: 35%;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 35px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        bottom: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        height: 300px !important;
        object-fit: cover;
    }

    /* end section autonome */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end footer */
    /* ===========================================
            start page centre mahassen
    =========================================== */
    /* start section header-marketing */
    .header-marketing .header-marketing-desc h1 {
        font-size: 27px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: var(--Brand_para_size);
    }

    /* start section header-marketing */
    /* start section hamam */
    section.hamam {
        padding: 50px 0;
        margin: 0;
    }

    section.hamam .hamam-img .content-img {
        width: 100%;
        height: 100%;
    }

    /* end section hamam */
    /* start section massage */
    section.massage {
        padding: 0 0 50px;
    }

    section.massage .content-img {
        width: 100%;
        height: 355px;
    }

    section.massage.coiffure.marque .content-img-la-marque {
        width: 100%;
        height: auto !important;
    }

    section.massage .content-img-la-marque {
        width: 100%;
        /* height: 355px; */
    }

    section.massage.coiffure::before,
    section.massage:after {
        height: 441px;
        top: 60px;
    }

    .content-box-actualité {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 16px;
        line-height: 25px;
        text-align: justify;
    }

    /* end section massage */
    /* start section lamarque */
    section.lamarque {
        padding: 0 35px 50px;
    }

    /* end section lamarque */
    /* ===========================================
            end page centre mahassen
    =========================================== */
    /* ===========================================
            start page Maquillage
    =========================================== */
    /* start header */
    div.nos_offres a {
        display: block;
        margin-left: 0;
    }

    .header_logo_icons .content_lang {
        margin-top: 0;
    }

    .content_lang.p-maquillage {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .header_logo_icons .monnais {
        float: right;
        margin-right: 20px;
    }

    .header_logo_icons .lang-menu .mon_uses {
        right: 20px;
    }

    .content_lang.p-maquillage .mahassen-live {
        grid-column: 1 / 3;
    }

    .header_logo_icons .monnais span {
        width: auto;
    }

    .header_logo_icons .lang-menu,
    .header_logo_icons .monnais {
        position: relative;
        display: table;
        text-align: left;
    }

    a.decouvre {
        width: auto;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 22px;
    }

    /* end header */
    /* start marketing */
    .header-marketing .header-marketing-desc h1 {
        font-size: 17px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 15px;
    }

    /* end marketing */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0;
    }

    /* end section abonnez-vous */
    /* start section abonnez-vous */
    section.abonnez-vous h5 {
        font-size: 15px;
    }

    /* end section abonnez-vous */
    /* start section collection.mah-nouveaute.maquillage */
    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        margin-bottom: 65px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -50px;
    }

    /* end section collection.mah-nouveaute.maquillage */
    /* ===========================================
           end page Maquillage
    =========================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */


    section.inscrivez-vous p {
        font-size: 12px !important;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 15px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        margin: 0 0 25px;
    }

    .inscrivez-vous-img {
        padding-top: 0;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
        top: -7px;
        right: -7px;
        padding: 5px;
        opacity: 1;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        font-size: 11px;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links h1 {
        font-size: 24px;
    }

    section.fond-de-tient-details .content-img {
        flex-direction: column;
    }

    .fond-de-tient-description .content-img-fond-de-tient img {
        width: 100%;
    }

    .content-fond-de-tient h3 {
        font-size: 20px;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img {
        height: 300px;
    }

    /* end page fond de tient */
    /* start page coupe */
    .fond-de-tient-description.coupe {
        display: inherit;
    }

    .fond-de-tient-description .avis .grid-btn button {
        font-size: 15px;
    }

    /* end page coupe */
    /* start page coiffure */
    section.nos-services-coiff .grid-nos-services-coiff {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end page coiffure */
}

@media (min-width: 768px) and (max-width: 991px) {
    .carousel-maquillage.slick-initialized.slick-slider {
        position: relative;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 130px;
        right: 0;
        transform: inherit;
        bottom: 0;
        max-width: 462px;
    }

    section.collection.mah-nouveaute .carousel-item.shine {
        min-height: 510px;
        width: 100% !important;
        /* background: white; */
        padding: 10px;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 42%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -50px;
    }

    .sliderTop .slick-slide img {
        display: block;
        min-height: 520px;
        object-fit: cover;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0;
    }

    .massage.coiffure.mah-Centre .carousel.slide .slick-prev:before {
        left: 20px;
    }

    .massage.coiffure.mah-Centre .carousel.slide .slick-next:before {
        right: 35px !important;
    }

    .massage.coiffure.mah-Centre button.slick-prev.slick-arrow {
        bottom: -10px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -230px !important;
    }

    /* about slider Homme esthetique  */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {
        width: 100%;
    }

    .content-text2 {
        width: 100%;
    }

    .carousel-item.shine {
        min-height: 0px;
    }

    /* start nav  */
    /* nav:not(.nav-breadcrumb) {
        display: none;
    } */
    /* end nav */
    /* start slider */
    .content_slider .carousel-caption h1 {
        font-size: 50px;
    }

    /* end slider */
    /* start header_logo_icons */
    .header_logo_icons .content_lang {
        justify-content: space-between;
        margin-bottom: 15px;
    }

    .header_logo_icons .header_icons {
        /* margin-top: 24px; */
        justify-content: center;
    }

    /* end header_logo_icons */
    /* start section collection */
    section.collection {
        padding: 70px 0 0px;
    }

    section.collection .desc_collection {
        padding: 20px 0 0;
        gap: 20px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        /* height: 680px !important; */
        width: 100%;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: -80px;
        justify-content: end;
        margin: 0;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        margin-left: 13px;
        margin-right: 0;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 0;
        right: inherit;
        left: 20px;
        width: 195px;
        height: 195px;
    }

    section.autonome .content-autonome-desc h2 {
        position: inherit;
    }

    section.autonome .content-autonome-desc span {
        color: #dadada;
    }

    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }

    /* end section collection */
    /* start section autonome */
    section.autonome .content-autonome {
        grid-template-columns: auto;
        gap: 0;
        margin-bottom: 40px;
        display: flex;
    }

    /* end section autonome */
    /* start section maquillage */
    section.maquillage div#carouselExampleCaptions3 {
        position: inherit;
        top: inherit;
        width: 90%;
        left: inherit;
        margin: 0 auto;
        height: 465px;
    }

    section.maquillage .video-container {
        margin-bottom: 40px;
        height: 745px;
    }

    /* end section maquillage */
    /* start carte-mahassen */
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        margin-left: 7.5rem;
        font-size: 110px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-carte-one {
        height: 800px !important;
    }

    .fidelite-one-acceuil {
        height: 1375px !important;
    }

    .fidelite-two-acceuil {
        margin-top: -285px !important;
    }

    /* start carte-mahassen */
    /* start section avis */
    section.avis-clients h2 {
        font-size: var(--Brand_title_size_level_three);
    }

    span.slick-prev-index {
        left: -36px;
    }

    span.slick-next-index {
        right: -36px;
    }

    /* end section avis */
    /* start section newsletter */


    section.newsletter .email {
        max-width: 80%;
    }

    /* end section newsletter */
    /* start section mahassen-lives */
    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 50px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: inherit;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 40px;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 291px;
        height: 593px;
        top: 0;
        right: 0;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        left: 2%;
        font-size: 17rem;
    }

    section.avis-clients .slick-next:before {
        right: -11px;
        width: 48px;
    }

    section.avis-clients .slick-prev:before {
        left: -11px;
        width: 48px;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }

    /* end section mahassen-lives */
    /* start section abonnez vous */

    /* end section abonnez vous */
    /* start footer */
    section.footer .footer-content {
        grid-template-columns: repeat(2, 1fr);
    }

    /* end footer */
    /* ==============================================
                 start page centre mahassen
    ============================================== */
    /* start collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        right: inherit;
        transform: inherit;
        bottom: 0;
        margin: 50px auto;
        max-width: 90%;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -34px;
        gap: 30px;
        left: 0;
        align-items: center;
        margin: 0;
    }

    /* end collection.mah-nouveaute */
    /* start esthetique-home */
    section.esthetique-home h2 {
        font-size: 100px;
    }

    section.esthetique-home .content-slider-home {
        padding-left: 0;
    }

    section.esthetique-home .content-img-abs img {
        bottom: 36px;
        width: 215px;
        height: 275px;
    }

    /* end esthetique-home */
    /* start massage */
    section.massage .content-img {
        width: 100%;
        height: 555px;
    }

    /* end massage */
    /* start section hamam */
    section.hamam .hamam-img .content-img {
        width: 50%;
        height: 50%;
        left: auto;
        bottom: -15%;
    }

    /* start section hamam */
    /* ==============================================
                 end page centre mahassen
    ============================================== */
    /* ==============================================
                 start page maquillage
    ============================================== */
    /* start section header */
    /* start section collection.mah-nouveaute.maquillage */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    section.collection.mah-nouveaute.maquillage {
        padding: 20px 37px 0px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: relative;
        top: inherit;
        left: inherit;
        right: inherit;
        transform: inherit;
        bottom: inherit;
        max-width: 100%;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0 0;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        right: 0;
        left: 0;
        bottom: -22px;
        position: absolute;
    }

    section.collection.mahassen .item {
        padding: 0 5px;
    }

    section.collection.mahassen {
        padding: 85px 37px 105px;
        margin-top: 20px;
        background: #f5f5f5;
    }

    /* end section collection.mah-nouveaute.maquillage */
    /* start section mahassen-lives */
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end section mahassen-lives */
    /* start section abonnez-vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez-vous */
    /* start section idees */
    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* ==============================================
                 end page maquillage
    ============================================== */
    /* ==============================================
                start pop up maquillage
    ============================================== */
    .content-inscrivez-vous {
        grid-template-columns: 60% 40%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        grid-template-columns: 65% 35%;
        width: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        font-size: 11px;
    }

    section.fond-de-tient-details .contents-img .content-one {
        display: flex;
        gap: 20px;
    }

    /* ==============================================
                end pop up maquillage
    ============================================== */
    /* start page fond de tient */
    .navigation-links {
        padding: 0 10px;
    }

    section.fond-de-tient-details {
        padding: 50px 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px 10px;
        -webkit-box-shadow: -3px -1px 22px -15px rgba(165, 160, 160, 1);
        -moz-box-shadow: -3px -1px 22px -15px rgba(165, 160, 160, 1);
        box-shadow: -3px -1px 22px -15px rgb(165 160 160);
    }

    section.fond-de-tient-details .content-img {
        margin-bottom: 40px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    /* end page fond de tient */
    /* start page coiffure */
    div#coiffureCarousel {
        padding-bottom: 40px;
    }

    section.nos-services-coiff {
        padding: 50px 35px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 15px;
    }

    section.bannierCoiff div#coiffureCarousel2 {
        padding-bottom: 40px;
    }



    /* end page coiffure */
}

@media (min-width: 992px) and (max-width: 1199px) {
    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 40%;
        right: 52%;
        transform: inherit;
        bottom: 0;
        max-width: 282px;
        /* background: white; */
    }

    /* ============================================
                    start page centre mahassen
    ============================================ */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {}

    .content-text2 {}

    .carousel-item.shine {
        min-height: auto;
        max-height: fit-content;
    }

    section.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: 40px;
        width: 480px;
        height: 725px;
        top: 60px;
        left: -59px;
        z-index: 0;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 45%;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        z-index: 999;
        right: -50px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption p,
    section.maquillage .content-carousel-maquillage .carousel-caption p,
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
        font-size: 22px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption h4,
    section.maquillage .content-carousel-maquillage .carousel-caption h4,
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption h4 {
        font-size: 18px;
    }

    /* ============================================
                    start page home
    ============================================ */
    /* start navbar */
    /* nav:not(.nav-breadcrumb) {
        display: none;
    } */
    /* end navbar */
    /* start header */
    .header_logo_icons .content_lang {
        gap: 45px;
    }

    .sliderTop .slick-slide img {
        display: block;
        min-height: 520px;
        object-fit: cover;
    }

    /* end header */


    /* header-marketing */
    .header-marketing .header-marketing-desc h1 {
        padding: 0 20px;
        font-size: 32px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
        font-size: 19px;
    }

    /* header-marketing */
    /* start header logo icons */
    .header_logo_icons .mahassen-live span:first-of-type {
        font-size: 16px;
    }

    /* end header logo icons */
    /* start section collection */
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 100%;
        /* height: 790px; */
        margin-left: 20px;
    }

    /* end section collection */
    /* start section autonome */
    section.autonome div#carouselExampleCaptions2 {
        margin-top: 20px;
        margin-bottom: 20px;
    }

    /* start section maquillage */
    section.maquillage .content-autonome-desc {
        margin-top: 170px;
    }

    /* end section maquillage */
    /* start carte-mahassen */
    section.carte-mahassen .content-carte-mahassen.carte-two {
        grid-template-columns: auto 59px;
        padding-left: 40px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 480px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        display: grid;
        grid-template-columns: 60px auto 42px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 116px;
        margin-left: -9px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 28px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        max-width: 100%;
    }

    /* start carte-mahassen */
    /* start mahassen-lives */
    section.mahassen-lives {
        padding: 30px 50px 0px 30px;
        /* top: 109px; */
    }

    section.mahassen-lives .mahassen-live-desc h2 {
        font-size: 35px;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        width: 326px;
        height: 378px;
        top: 142px;
        right: -173px;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        bottom: 241px;
        left: 35%;
        font-size: 14rem;
        line-height: initial;
        bottom: -66px;
    }

    section.mahassen-lives .mahassen-live-desc p {
        margin-bottom: inherit;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 30px;
    }

    /* end mahassen-lives */
    /* start product-cosmetique */
    section.product-cosmetique .item .item-desc {
        padding: 26px 15px;
    }

    /* end product-cosmetique */
    /* start abonnez-vous */
    section.abonnez-vous {
        margin-top: 50px;
    }

    /* end abonnez-vous */
    /* start newsletter */
    section.newsletter .email {
        max-width: 90%;
    }

    /* end newsletter */
    /* START page CentreMahassen  */
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    .content-img {}

    .content-text2 {}

    /* end  page CentreMahassen  */

    /* start section collection */
    section.collection .collection_hiver .content-img_collection {
        width: 50%;
        height: auto !important;
        bottom: 0px !important;
    }

    section.collection .carousel-indicators {
        justify-content: end;
        margin-right: 0;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        margin-right: 0;
    }

    /* end section collection */
    /* start section avis */
    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        padding: 80px 0;
    }

    section.avis-clients img {
        top: 214px;
    }

    /* end section avis */
    /* start footer */


    /* end footer */
    section.collection .maps {
        right: 36px;
    }

    i.first-icon {
        right: 35px;
    }

    /* ============================================
                    end page home
    ============================================ */
    /* ============================================
                    start page centre mahassen
    ============================================ */
    /* start page hamam */
    section.hamam .hamam-img .content-img {
        width: 292px;
        height: 292px;
        bottom: -20%;
        right: 8%;
    }

    /* end page hamam */
    /* start page collection.mah-nouveaute */
    section.collection.mah-nouveaute .content-img {
        padding-right: 0;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -60px;
        gap: 30px;
        left: inherit;
        justify-content: center;
        align-items: center;
        width: 100%;
    }

    /* end page collection.mah-nouveaute */
    /* start section esthetique-home */
    section.esthetique-home .content-img-abs img {
        width: 315px;
        height: 275px;
    }


    .description-detail-actualite {
        width: 100%;
        max-width: 100%;
        margin: 40px auto;
        text-align: justify;
        padding: 0 10%;
    }


    section.content-bloc1-collection {
        padding: 20px 0;
        position: relative;
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
    }


    /* end section esthetique-home */
    /* ============================================
                    end page centre mahassen
    ============================================ */
    /* ============================================
                    start page maquillage
    ============================================ */
    /* start mahassen-lives*/
    section.mahassen-lives .item {
        padding: 0 5px;
    }

    /* end mahassen-lives*/
    /* start section abonnez vous */
    section.abonnez-vous .item {
        padding: 0 5px;
    }

    /* end section abonnez vous */
    /* start product-cosmetique */
    section.collection.mahassen .item {
        padding: 0 5px;
    }

    /* end product-cosmetique */
    /* start product-cosmetique */
    section.product-cosmetique .item {
        padding: 0px 5px !important;
    }

    /* end product-cosmetique */
    /* start section idees */
    section.idees .item {
        padding: 0px 5px;
    }

    /* end section idees */
    /* ============================================
                    end page maquillage
    ============================================ */
    /* start page fond de tient */
    section.fond-de-tient-details {
        padding: 50px 35px;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description {
        padding-left: 0;
    }

    .content-fond-de-tient {
        padding: 40px 22px 20px;
    }

    .fond-de-tient-description .product-item {
        margin: 0 5px;
        -webkit-box-shadow: -4px 0px 9px -7px rgba(165, 160, 160, 1);
        -moz-box-shadow: -4px 0px 9px -7px rgba(165, 160, 160, 1);
        box-shadow: -4px 0px 9px -7px rgb(165 160 160);
    }

    /* end page fond de tient */
    /* start section coupe */
    .fond-de-tient-description .grid-avis {
        flex-direction: column;
    }

    .fond-de-tient-description .avis .grid-btn {
        grid-template-columns: repeat(1, 1fr);
    }

    /* end section coupe */
    /* start page coiffure */
    section.nos-services-coiff .grid-nos-services-coiff {
        gap: 10px;
    }

    /* start page coiffure */
}


@media (min-width: 1200px) and (max-width: 1308px) {
    .footer-qrq {
        padding-left: 1px;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 60px 25px 35px;
        padding-left: 48px;
        justify-items: center;
        padding-right: 30px;
        padding-left: 90px;
        border-bottom: 2px solid #2e2e2e;
    }

}

@media (min-width: 1025px) and (max-width: 1676px) {

    /* ============================================
                    start page centre mahassen
    ============================================ */

    /* end section carte-mahassen */
    /* start footer */
    section.footer .footer-content {
        gap: 15px;
    }

    /* ============================================
                    end page home
    ============================================ */
    /* ============================================
                    start page centre mahassen
    ============================================ */
    /* start section header-marketing */
    .header-marketing .header-marketing-icons a {
        width: 176px;
    }

    /* end section header-marketing */
    /* start esthetique-home */
    section.esthetique-home .content-img-abs img {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 315px;
        height: 275px;
        object-fit: cover;
    }

    /* end esthetique-home */
    /* start collection.mah-nouveaute */
    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: -44px;
        left: 0;
        justify-content: center;
        margin: 0;
    }

    /* end collection.mah-nouveaute */


    @import url('https://fonts.googleapis.com/css2?family=Allura&family=Bebas+Neue&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital@0;1&family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Sassy+Frass&display=swap');

    @font-face {
        font-family: "Century-Gothic-Std";
        src: url("../fonts/Century-Gothic-Std-Regular.woff") format("woff");
    }

    /* info global */


    body {
        min-height: 100vh;
    }


    /* start hover shine */

    .shine {
        position: relative;
        overflow: hidden;
    }


    /* end hover shine */




    /* start nos offres */

    div.nos_offres {
        background: var(--Heading_color);
        text-align: center;
    }

    div.nos_offres span,
    div.nos_offres a {
        color: var(--white-color);
        font-family: var(--Brand_title_fonts);
        font-weight: 300;
        font-size: 13px;
    }

    div.nos_offres a {
        text-decoration: underline;
        display: inline-block;
        margin-left: 28px;
    }

    div.nos_offres a i {
        color: var(--white-color);
    }


    /* end nos offres */


    /* start header logo and icons */



    .header_logo_icons .content_lang {
        display: flex;
        gap: 41px;
        margin-top: 10px;
    }

    .header_logo_icons .lang-menu,
    .header_logo_icons .monnais,
    .header_logo_icons .laguages {
        position: relative;
    }

    .header_logo_icons .lang-menu ul.languages_uses {
        padding: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 20px;
        display: none;
        right: inherit;
        z-index: 2;
        transition: .7s;
        list-style: none;
        margin-top: 5px;
    }

    .header_logo_icons .lang-menu .mon_uses,
    .header_logo_icons .lang-menu .laguages_uses {
        padding: 0;
        margin: 0;
        padding: 0;
        position: absolute;
        top: 20px;
        display: none;
        /* right: 11px; */
        z-index: 2;
        transition: .7s;
        list-style: none;
        margin-top: 5px;
    }

    .header_logo_icons .lang-menu ul.active,
    .header_logo_icons .lang-menu .mon_uses.active,
    .header_logo_icons .lang-menu .laguages_uses.active {
        display: block;
        background: white;
    }

    .header_logo_icons .lang-menu .selected-lang {
        position: relative;
        display: table;
        cursor: pointer;
    }

    .header_logo_icons .monnais span {
        display: inline-block;
        width: 45px;
    }

    /*.header_logo_icons .lang-menu .selected-lang:after,
    .header_logo_icons .monnais:after,
    .header_logo_icons .laguages:after {
        position: absolute;
        content: "\f107";
        font-family: "Font Awesome 5 Pro";
        top: 50%;
        transform: translateY(-50%);
        right: -23px;
    }

    .header_logo_icons .lang-menu .selected-lang.active:after,
    .header_logo_icons .monnais.active:after,
    .header_logo_icons .laguages.active:after {
        content: "\f106";
    }*/


    .header_logo_icons .mahassen-live span.live {
        top: -15px;
    }

    .header_logo_icons .mahassen-live span.live:after {
        position: absolute;
        content: "";
        top: -17px;
        right: -17px;
        width: 17px;
        height: 17px;
        background-image: url(../images/live.png);
    }

    .header_logo_icons .header_icons {
        display: flex;
        gap: 6px;
        margin-top: 7px;
        justify-content: end;
    }

    .fav_number {
        top: 61px;
        right: 61px;
    }


    /* end header logo and icons */


    /* start slider */

    .content_slider {
        position: relative;
        padding: 0 33px;
    }

    .content_slider .content_networks {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        top: 50%;
        left: 14px;
        gap: 25px;
        transform: translateY(-50%);
    }

    .content_slider .content_networks.maquillage {
        justify-content: end;
        align-items: center;
        position: absolute;
        top: 40%;
        bottom: inherit;
        transform: inherit;
        padding-bottom: 33px;
    }

    .content_slider .carousel-indicators {
        position: absolute;
        right: -29px !important;
        bottom: inherit;
        left: inherit;
        z-index: 2;
        display: flex;
        flex-direction: column !important;
        justify-content: center !important;
        padding: 0;
        margin-right: 0px !important;
        margin-bottom: inherit !important;
        margin-left: inherit !important;
        list-style: none;
        /* top: 50% !important; */
        /* transform: translateY(-50%) !important; */
    }

    .content_slider button.carousel-control-prev,
    .content_slider button.carousel-control-next {
        display: none;
    }

    /*.content_slider .carousel-indicators [data-bs-target] {
    box-sizing: content-box;
    flex: auto;
    width: 13px !important;
    height: 60px !important;
    padding: 10px;
    margin-right: 0px;
    margin-left: 0px;
    text-indent: -999px;
    cursor: pointer;
    border-radius: 50% !important;
    background-color: transparent !important;
    background-clip: padding-box;
    border: 0;
    /* border-top: 10px solid transparent; */
    /* border-bottom: 10px solid transparent;
    opacity: .1;
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
}*/

    .content_slider .carousel-indicators button.active {
        opacity: 1;
        position: relative;
    }

    .content_slider .carousel-indicators button.active:after {
        position: absolute;
        content: "";
        width: auto;
        transform: translateY(-50%);
        left: 0;
    }

    .content_slider .carousel-indicators button {
        opacity: 1;
    }

    .content_slider .content_networks a {
        color: var(--Heading_color);
    }

    .content_slider .content_networks a i {
        transition: all 1s;
    }

    .content_slider .content_networks a:hover i {
        transform: scale(1.2);
    }

    .content_slider {
        /* position: relative; */
        /* padding: 0 33px; */
    }

    .content_slider .carousel-item {
        height: 650px !important;
    }

    .content_slider .carousel-item img.d-block.w-100 {
        height: 100% !important;
        width: 100% !important;
        object-fit: cover;
    }

    .content_slider .carousel-caption {
        position: absolute;
        right: inherit !important;
        left: 50px !important;
        padding-top: 1.25rem;
        padding-bottom: 1.25rem;
        color: var(--Heading_color) !important;
        text-align: left !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
    }

    .content_slider .carousel-caption span.collection {
        font-size: 24px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        display: inline-block;
        margin-bottom: 15px;
        letter-spacing: 5px;
    }


    .content_slider .carousel-caption button {
        font-size: var(--Brand_title_size_level_seven);
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-weight: 400;
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 16px 88px;
        text-transform: uppercase;
        margin-top: 50px;
        transition: opacity 2s;
    }

    .content_slider .carousel-caption button:hover {
        opacity: .5;
    }


    /* end slider */

    nav:not(.nav-breadcrumb) {
        border-top: 1px solid #e2e2e2;
        z-index: 99;
    }

    nav .navbar {
        /* height: 100%; */
        /* max-width: 1250px; */
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: auto;
        padding: 0 50px;
    }

    nav .navbar .logo {
        display: none;
    }

    .navbar .logo a {
        font-size: 30px;
        text-decoration: none;
        font-weight: 600;
    }

    nav .navbar .nav-links {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    nav .navbar .links {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 0;
        padding: 0;
    }

    nav .navbar .links li {
        /* position: relative; */
        display: flex;
        align-items: center;
        justify-content: space-between;
        list-style: none;
        padding: 0 14px;
    }

    nav .navbar .links li a {
        height: 100%;
        font-weight: 300;
        text-decoration: none;
        white-space: nowrap;
        color: var(--Heading_color);
        font-size: 11.5px;
        font-weight: lighter;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std";
    }

    .links li:hover i.fa-caret-down,
    .links li:hover .fa-caret-down {
        transform: rotate(180deg);
    }

    nav .navbar .links li .fa-caret-right,
    nav .navbar .links li .fa-caret-down {
        height: 100%;
        width: 22px;
        text-align: center;
        display: inline-block;
        transition: all 0.3s ease;
        font-size: 12px;
    }

    nav .navbar .links li .sub-menu {
        position: absolute;
        top: 35px;
        left: 0;
        right: 0;
        line-height: 40px;
        background: var(--white-color);
        border-radius: 0 0 4px 4px;
        display: none;
        z-index: 20;
        padding: 20px 40px;
        box-shadow: 0 0px 3px 0 rgb(0 0 0 / 15%);
    }

    nav .navbar .links li .sub-menu .nav-n1 {
        display: flex;
        justify-content: space-between;
        gap: 20px;
    }

    nav .navbar .links li .sub-menu .nav-n1 h4 {
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: bold;
        font-size: 13px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 {
        padding: 0;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.li-mariee a.mariee {
        padding: 5px;
        background: #fde2e1;
        text-transform: uppercase;
        text-align: inherit;
        font-style: italic;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1>li {
        padding: 0;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child {
        position: relative;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child.active .ul-nav-n2 {
        display: block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li {
        position: relative;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child.active .ul-nav-n3 {
        display: block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n3 {
        position: absolute;
        right: -100%;
        position: absolute;
        /* right: -127%; */
        padding: 0;
        top: 0;
        -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
        box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        display: none;
        z-index: 1;
        background: white;
    }


    /* nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child>a:after,
nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a:after {
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    content: "\f054";
    width: 10px;
    height: 10px;
    font-size: 10px;
    right: -17px;
} */

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child .nav-n1-has-child-flex,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 .nav-n2-has-child-flex {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
        width: 100%;
        height: 100%;
        position: relative;
        display: inline-block;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a.active,
    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a:hover {
        color: red;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
        padding: 11px;
        font-size: 10px;
        line-height: 19px;
        cursor: pointer;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
        position: absolute;
        right: calc(-100% - 48px);
        padding: 0;
        top: 7px;
        -webkit-box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        -moz-box-shadow: 0px 1px 4px -1px rgba(165, 160, 160, 1);
        box-shadow: 0px 1px 4px -1px rgb(165 160 160);
        display: none;
        z-index: 1;
        background: white;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 li.nav-n2-has-child>a {
        position: relative;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
        max-width: 200px;
        height: 100px;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image:last-of-type {
        margin-bottom: 41px !important;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image.no-list {
        margin-top: 20px;
        align-items: end;
        justify-content: start;
        gap: 20px;
    }

    .navbar .links li .sub-menu li {
        padding: 0 22px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .navbar .links li .sub-menu a {
        font-size: 12.5px;
        font-weight: 500;
        font-family: var(--Brand_title_fonts);
        text-transform: capitalize;
    }

    .navbar .links li .sub-menu .fa-caret-right {
        line-height: 40px;
    }

    .navbar .links li .sub-menu .more-sub-menu {
        position: absolute;
        top: 0;
        left: 100%;
        border-radius: 0 4px 4px 4px;
        z-index: 1;
        display: none;
    }

    .links li .sub-menu .more:hover .more-sub-menu {
        display: block;
    }

    .navbar .search-box {
        position: relative;
        height: 40px;
        width: 40px;
        display: none;
    }

    .navbar .search-box i {
        position: absolute;
        height: 100%;
        width: 100%;
        line-height: 40px;
        text-align: center;
        font-size: 22px;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.3s ease;
    }

    .navbar .search-box .input-box {
        position: absolute;
        right: calc(100% - 40px);
        top: 80px;
        height: 60px;
        width: 300px;
        border-radius: 6px;
        opacity: 0;
        pointer-events: none;
        transition: all 0.4s ease;
    }

    .navbar.showInput .search-box .input-box {
        top: 65px;
        opacity: 1;
        pointer-events: auto;
        ;
    }

    .search-box .input-box::before {
        content: '';
        position: absolute;
        height: 20px;
        width: 20px;
        right: 10px;
        top: -6px;
        transform: rotate(45deg);
    }

    .search-box .input-box input {
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 4px;
        transform: translate(-50%, -50%);
        height: 35px;
        width: 280px;
        outline: none;
        padding: 0 15px;
        font-size: var(--Brand_title_size_level_seven);
        border: none;
    }

    .navbar .nav-links .sidebar-logo {
        display: none;
    }

    .navbar .bx-menu {
        display: none;
    }

    @media (max-width:920px) {
        nav .navbar {
            max-width: 100%;
            padding: 0 25px;
        }

        nav .navbar .logo a {
            font-size: 27px;
        }

        nav .navbar .links li {
            padding: 0 10px;
            white-space: nowrap;
        }

        nav .navbar .links li a {
            font-size: 15px;
        }
    }

    @media (max-width:992px) {
        nav .navbar .logo {
            display: none;
        }

        .navbar .bx-menu {
            display: block;
        }

        nav .navbar .nav-links {
            position: fixed;
            top: 0;
            left: -100%;
            display: block;
            max-width: 270px;
            width: 100%;
            line-height: 40px;
            padding: 20px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
            transition: all 0.5s ease;
            z-index: 1000;
            background: white;
        }

        .navbar .nav-links .sidebar-logo {
            display: grid;
            grid-template-columns: auto 25px;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
        }

        .sidebar-logo .logo-name img {
            width: 100%;
        }

        /* .sidebar-logo .logo-name {
        font-size: 25px;
    } */
        .sidebar-logo i,
        .navbar .bx-menu {
            font-size: 25px;
        }

        nav .navbar .links {
            display: block;
            margin-top: 20px;
            padding: 0;
        }

        nav .navbar .links li .arrow {
            line-height: 40px;
        }

        nav .navbar .links li {
            display: block;
        }

        nav .navbar .links li .sub-menu {
            position: relative;
            top: 0;
            box-shadow: none;
            display: none;
            padding: 0;
        }

        nav .navbar .links li .sub-menu li {
            border-bottom: none;
        }

        .navbar .links li .sub-menu .more-sub-menu {
            display: none;
            position: relative;
            left: 0;
        }

        .navbar .links li .sub-menu .more-sub-menu li {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .links li:hover i.fa-caret-down,
        .links li:hover .fa-caret-down {
            transform: rotate(0deg);
        }

        .navbar .links li .sub-menu .more-sub-menu {
            display: none;
        }

        .navbar .links li .sub-menu .more span {
            display: flex;
            align-items: center;
        }

        .links li .sub-menu .more:hover .more-sub-menu {
            display: none;
        }

        nav .navbar .links li:hover .htmlCss-sub-menu,
        nav .navbar .links li:hover .js-sub-menu {
            display: none;
        }

        .navbar .nav-links.show1 .links .htmlCss-sub-menu,
        .navbar .nav-links.show3 .links .js-sub-menu,
        .navbar .nav-links.show2 .links .more .more-sub-menu {
            display: block;
        }

        .navbar .nav-links.show1 .links i.fa-caret-down,
        .navbar .nav-links.show3 .links .fa-caret-down {
            transform: rotate(180deg);
        }

        .navbar .nav-links.show2 .links .fa-caret-right {
            transform: rotate(90deg);
        }
    }

    @media (max-width:370px) {
        nav .navbar .nav-links {
            max-width: 100%;
            background: var(--white-color);
        }
    }


    /* start section collection */

    section.collection {
        /* padding-bottom: 70px; */
        padding-top: 2px;
    }

    section.collection .maps {
        padding: 25px 0 !important;
        position: fixed;
        bottom: 11px;
        margin-right: 20px;
        z-index: 3;
    }

    section.collection .collection_hiver {
        position: relative;
    }

    section.collection .desc_collection {
        padding: 70px 40px 0 40px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 40px;
    }

    /* @media (min-width: 1024px) and (max-width: 1199px) {
         section.autonome .content-autonome-desc p {
            padding-top: 45px;
        }

    } */

    @keyframes change {
        0% {
            background-image: url(../images/bg-btn.jpg);
        }

        100% {
            background-image: url(../images/bg-red.jpg);
        }
    }

    section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.maquillage .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.avis-clients a.decouvrir i.fa-solid.fa-arrow-right-long {
        margin-left: 12px;
    }

    section.collection .desc_collection a.decouvrir:after,
    section.autonome .content-autonome-desc a.decouvrir:after,
    section.maquillage .content-autonome-desc a.decouvrir:after,
    section.massage.coiffure .cont-description a.decouvrir:after,
    section.coiffure-hom .cont-description a.decouvrir:after,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:after {
        content: "";
        position: absolute;
        bottom: 13px;
        width: 113px;
        height: 1px;
        left: 0;
        right: inherit;
        top: inherit;
        background: black;
    }

    @keyframes animate {
        0% {
            background-position: left;
        }

        50% {
            background-position: center;
        }

        100% {
            background-position: right;
        }
    }

    section.collection .desc_collection a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.massage.coiffure .cont-description a.decouvrir i.fa-solid.fa-arrow-right-long,
    section.autonome .content-autonome-desc a.decouvrir i.fa-solid.fa-arrow-right-long {
        margin-left: 10px;
    }

    section.collection .desc_collection .collection_networks,
    section.autonome .content-autonome .collection_networks,
    .cont-description .collection_networks,
    .fond-de-tient-description .collection_networks {
        display: flex;
        gap: 35px;
        margin-top: 20px;
    }

    section.collection .desc_collection .collection_networks a,
    section.autonome .content-autonome .collection_networks a,
    .cont-description .collection_networks a,
    .fond-de-tient-description .collection_networks a {
        padding: 7px 10px;
        border-radius: 50%;
        width: 35px;
        height: 35px;
        text-align: center;
        line-height: inherit;
        display: inline-block;
        border: 1px solid var(--Heading_color);
        color: var(--Heading_color);
        transition: all 2s;
        position: relative;
    }

    section.collection .desc_collection .collection_networks a:hover,
    .content-autonome .collection_networks a:hover,
    .fond-de-tient-description .collection_networks a:hover {
        opacity: .5;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 725px;
        /* height: 100%; */
        margin-left: 220px;
        margin-right: 0;
    }

    section.collection .collection_hiver .carousel-indicators {
        bottom: -30px;
        gap: 20px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-next,
    section.collection .collection_hiver div#carouselExampleCaptions1 button.carousel-control-prev,
    section.autonome div#carouselExampleCaptions2 button.carousel-control-prev,
    section.autonome div#carouselExampleCaptions2 button.carousel-control-next,
    section.maquillage div#carouselExampleCaptions3 button.carousel-control-next,
    section.maquillage div#carouselExampleCaptions3 button.carousel-control-prev {
        display: none;
    }

    section.collection .collection_hiver .content-img_collection {
        position: absolute;
        bottom: 60px;
        right: inherit;
        left: 33px;
        width: 375px;
        /* height: 425px; */
    }

    button.slick-next.slick-arrow {
        padding-bottom: 70px;
    }

    button.slick-prev.slick-arrow {
        padding-bottom: 70px;
    }

    .desc_collection p {
        text-align: justify;
    }


    section.collection .collection_hiver .content-img_collection img {
        width: 100%;
        /* height: 82%; */
    }

    section.collection .desc_collection .spa.maquillage {
        height: 127px;
    }

    ol.breadcrumb {
        justify-content: center;
    }

    section.collection .desc_collection .spa img {
        width: 100%;
        height: 100%;
    }


    /* end section collection */


    /* start section autonome */

    section.autonome {
        padding: 0px 35px 0px 20px;
    }


    p.justified-text-modify {
        text-align: justify !important;
    }



    .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
        margin-left: 77px;
    }

    section.autonome .content-autonome {
        display: grid;
        grid-template-columns: 59% 63%;
        position: relative;
    }

    section.autonome {
        margin-right: 30px;
        margin-left: 30px;
        height: calc(50vh) !important;
        margin-bottom: 10px;
    }

    section.autonome.home {
        margin-right: 30px;
        margin-left: 30px;
        height: auto !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome .picture {
        /* height: 765px; */
        margin-top: 20px;
    }

    .content-video {
        position: flex;
        justify-content: center;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: stretch;
        align-items: flex-end;
        padding-left: 72px;
    }

    .video-wrapper {
        position: relative;
        padding-bottom: 56.25%;
        height: 0;
        overflow: hidden;
        max-width: 100%;
        background: #000;
    }

    .bloc1-application-mahassen {
        text-align: center;
    }

    .title-bloc1-application-mahassen {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 10px;
    }

    .description-bloc1-application-mahassen {
        text-align: justify;
        /* margin: 0 auto;
    max-width: 600px; */
    }

    .img-bloc1-app-application-mahassen {
        margin-top: 20px;
        text-align: center;
    }


    .video-wrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }


    section.autonome .content-autonome .picture img {
        /* height: 70%; */
        width: 100%;
        max-width: 84%;
        object-fit: cover;
    }




    section.autonome .content-autonome-desc span {
        color: var(--white-color);
    }

    section.autonome .content-autonome-desc {
        padding-top: 70px;
    }

    p.justified-text-mahaseen {
        padding-top: 100px;

    }

    .desc_collection p {
        text-align: justify !important;
        /* text-justify: inter-word !important; Add this line for content justification */
    }


    section.autonome .content-autonome-desc p {
        padding-right: 20px;
    }



    section.autonome .content-autonome .collection_networks a,
    .cont-description .collection_networks a {
        position: relative;
        display: inline-block;
    }



    section.autonome .content-autonome-desc a.decouvrir {
        /* margin-left: 40px; */
        display: inline-block;
    }

    section.autonome .content-autonome .collection_networks {
        margin-left: 40px;
    }

    .content-autonome .collection_networks,
    .cont-description .collection_networks {
        margin-top: 50px;
    }

    .content-autonome .collection_networks a:not(:last-of-type):after,
    .cont-description .collection_networks a:not(:last-of-type):after,
    .fond-de-tient-description .collection_networks a:not(:last-of-type):after {
        position: absolute;
        content: "";
        height: 35px;
        width: 1px;
        background-color: #adadad;
        right: -20px;
        top: 0;
        bottom: 0;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: auto;
        position: relative;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators {
        position: absolute;
        top: -146px;
        right: -105px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        gap: 20px;
        align-items: flex-end;
        text-align: right;
        z-index: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-indicators button:not(.active) {
        margin-right: 12px;
    }


    /* end section autonome */


    /* start section maquillage */

    section.maquillage.home {
        padding: 50px 37px 50px;
        background: #f5f5f5;
        margin-top: 0px;
        /* height: 55%; */
    }

    section.maquillage .video-container {
        height: 745px;
        width: 100%;
        position: relative;
    }

    section.maquillage .video-container img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }



    @keyframes scale {
        0% {
            box-shadow: -4px 2px 111px 1px rgba(5, 3, 3, 0.75);
        }

        100% {
            box-shadow: -4px 2px 111px 28px rgba(5, 3, 3, 0.75);
        }
    }

    section.maquillage .popup-video {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 100;
        background: rgba(0, 0, 0, .8);
        height: 100%;
        width: 100%;
    }

    section.maquillage .popup-video video {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 750px;
        height: 750px;
        border-radius: 5px;
        border: 2px solid var(--white-color);
        object-fit: cover;
    }

    section.maquillage .popup-video span {
        position: absolute;
        top: 5px;
        right: 20px;
        font-size: 50px;
        color: var(--white-color);
        font-weight: 700;
        z-index: 100;
        cursor: pointer;
    }

    section.maquillage video {
        height: 100%;
        width: 100%;
    }

    section.maquillage .content-autonome-desc {
        /* margin-top: 30px; */
        padding-right: 6px;
        margin-left: 8px;
        padding-left: 93px;
        margin-top: 0px;
    }

    @media (min-width: 1400px) {
        .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
            flex: 0 0 auto;
            width: 2%;
        }

        .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
            padding-left: 86px;
        }


        .content-image.shine {
            max-width: 681px;
            max-height: 486px;
        }

        .product-item.shine {
            margin-left: 20px;
            margin-bottom: 20px;
        }

        a.fancybox {
            max-width: 100px;
            max-height: 100px;
        }
    }

    section.maquillage .content-autonome-desc a.decouvrir {
        background-image: url(../images/bg-red.jpg);
    }

    section.maquillage .content-carousel-maquillage {
        position: relative;
    }

    section.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 85px;
        gap: 30px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner {
        height: 100%;
        position: relative;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        bottom: 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-item,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-item {
        height: 645px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .carousel-caption,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .carousel-caption {
        position: absolute;
        bottom: -26px;
        left: -10px;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner img,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner img {
        height: 500px;
        box-shadow: 4px 6px 15px -4px rgb(0 0 0 / 10%);
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .new,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .new {
        position: absolute;
        top: 10px;
        left: 10px;
        color: #f33f38;
        padding: 6px 25px;
        font-size: 13.5px;
        background: var(--white-color);
        box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
        font-family: var(--Brand_title_fonts);
        text-align: center;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise,
    .carousel-maquillage .carousel-inner .remise {
        position: absolute;
        top: 23px;
        right: 27px;
        overflow: hidden;
        height: 50px;
        width: 50px;
        line-height: 19px;
        padding: 15px 4px;
        text-align: center;
        /* background-image: url(../images/bg-remise.png); */
        background: red;
        /* background-position: center; */
        border-radius: 50%;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner .remise span,
    section.mah-nouveaute div#carouselExampleCaptions3 .carousel-inner .remise span,
    .carousel-maquillage .carousel-inner .remise span {
        color: var(--white-color);
        font-family: var(--Brand_title_fonts);
        font-size: var(--Brand_para_size);
        font-weight: 700;
        /* margin-top: 23px; */
        /* padding: 3px 58px; */
        display: inline-block;
        /* transform: rotate(45deg); */
    }


    /* end section maquillage */


    /* start section nouveaute */

    section.nouveaute {
        padding: 50px 20px 50px 20px;
        /* margin-left: 30px;
        margin-right: 30px; */

    }

    section.nouveaute .content-image {
        /* height: 552px; */
    }

    section.nouveaute .content-image img {
        width: 100%;
        /* height: 100%; */
        object-fit: cover;
    }


    section.nouveaute .content-noveaute-desc {
        position: relative;
        height: 100%;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
    }




    /* end section nouveaute */


    /* start product-cosmetique */

    section.product-cosmetique {
        padding: 0 0 50px;
    }

    section.product-cosmetique .item {
        padding: 0px 28px;
        display: inline-block;
    }

    section.product-cosmetique .item .product-item {
        /* height: 450px; */
        position: relative;
    }

    section.product-cosmetique .item .product-item img {
        height: 100%;
        background-size: cover;
        width: 100%;
    }

    section.product-cosmetique .item .product-item .item-icons {
        position: absolute;
        bottom: 50px;
        right: 0;
        left: 50%;
        transform: translateX(-50%);
        justify-content: center;
        align-items: center;
        /* display: none; */
        animation: viewicons 0.2s linear;
        width: 100%;
        text-align: center;
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        position: absolute;
        bottom: 50px;
        right: 0;
        left: 2%;
        transform: translateX(-50%);
        justify-content: center;
        align-items: center;
        /* display: none; */
        animation: viewicons 0.2s linear;
        width: 100%;
        text-align: center;
    }

    @keyframes viewicons {
        0% {
            bottom: 0;
        }

        50% {
            bottom: 20px;
        }

        100% {
            bottom: 50px;
        }
    }

    section.product-cosmetique .item:hover .item-icons {
        display: block;
    }

    section.product-cosmetique .item .product-item .item-icons .item-icons-left i {
        padding: 20px 25px;
        background: var(--white-color);
        color: var(--Heading_color);
        font-size: 22px;
        transition: all 2s;
    }

    section.product-cosmetique .item .product-item .item-icons i:hover {
        color: #acacac;
    }

    section.product-cosmetique .slick-slider {
        margin: 0 13px;
    }

    section.product-cosmetique .item .item-desc {
        padding: 26px 32px;
        text-align: center;
    }

    section.product-cosmetique .item a {
        text-decoration: none;
    }

    section.product-cosmetique .item .item-desc p {
        font-size: 20px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
    }

    section.product-cosmetique .item .item-desc h5 {
        font-size: 20px;
    }

    section.autonome .content-autonome section.product-cosmetique button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 35px;
        width: 50px;
        height: 40px;
        left: inherit;
    }

    /* end product-cosmetique */


    /* start section avis */

    section.avis-clients {
        padding: 0 0 50px 0;
        text-align: center;
        position: relative;
    }

    section.avis-clients img {
        position: absolute;
        top: 66px;
        left: 50%;
        transform: translateX(-50%);
        z-index: 1;
        background: var(--white-color);
        border-radius: 50%;
    }

    section.avis-clients .content-slider-avis {
        max-width: 80%;
        margin: 0 auto;
        position: relative;
    }

    section.avis-clients .avis-slider.slick-initialized.slick-slider {
        background-color: #f5f5f5;
        padding: 106px 0 50px;
        position: relative;
    }

    section.avis-clients .avis-slider .item {
        color: var(--Heading_color);
        position: relative;
        text-decoration: none;
    }

    section.avis-clients .avis-slider .item p {
        font-size: 20px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
        max-width: 100%;
        padding: 0 30px;
        margin: 0 auto;
    }

    section.avis-clients .avis-slider .item .author-avis {
        font-size: 18px;
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: var(--Heading_color);
        text-transform: uppercase;
        display: inline-block;
        margin-top: 54px;
        position: relative;
    }

    section.avis-clients .avis-slider .item .author-avis:after {
        position: absolute;
        content: "";
        width: 2px;
        height: 32px;
        top: inherit;
        bottom: 30px;
        background: var(--Heading_color);
        left: 50%;
        transform: translateX(1px);
    }


    section.avis-clients .avis-slider .slick-dots {
        top: 50%;
        height: 5px;
    }

    section.avis-clients .slick-prev:before {
        content: "";
        background: var(--Heading_color);
        font-size: 51px;
        position: absolute;
        left: -69px;
        width: 115px;
        height: 2px;
    }

    section.avis-clients .slick-next:before {
        background: var(--Heading_color);
        content: "";
        font-size: 51px;
        position: absolute;
        right: -69px;
        width: 115px;
        height: 2px;
    }

    span.slick-prev-index {
        position: absolute;
        top: 43%;
        left: -94px;
    }

    span.slick-next-index {
        position: absolute;
        top: 43%;
        right: -94px;
    }



    /* end section avis */


    /* start section carte mahassen */

    section.carte-mahassen {
        padding: 50px 35px 20px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        display: grid;
        grid-template-columns: 60px auto 142px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 60px;
        padding-left: 65px;
        padding-top: 39px;
    }

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* height: 100%; */
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen span.profiter {
        writing-mode: tb-rl;
        text-orientation: mixed;
        transform: rotate(180deg);
        text-align: end;
        font-size: var(--Brand_para_size);
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 700;
        color: var(--Heading_color);
    }

    section.carte-mahassen .content-carte-mahassen span.profiter .remise {
        color: #f33f38;
    }

    /* section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 189px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: -41px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    } */

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        writing-mode: vertical-rl;
        font-size: 60px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }



    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }


    .nouveaute .content-image.shine {
        max-width: 100%;
        max-height: 100%;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        /* margin-top: 100px; */
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 650px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 600px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 264px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        margin-top: 500px;
    }


    .content-carte-mahassen.carte-one {
        display: grid;
        grid-template-columns: auto 100px !important;
    }

    /*
    .content-carte-one {
        height: 1002.06px !important;
    } */


    section.carte-mahassen .content-carte-mahassen .content-carte-one button:hover {
        opacity: .5;
    }


    /* end section carte mahassen */


    /* start section mahassen live */

    section.mahassen-lives .item {
        position: relative;
        padding: 0 20px;
    }

    section.mahassen-lives .item a img {
        width: 100%;
        /* height: 100%; */
    }


    section.mahassen-lives button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0px;
        right: 10px;
    }

    section.mahassen-lives button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0px;
        right: 10px;
    }

    .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
        flex: 0 0 auto;
        width: 2%;
    }

    .col-md-12.col-lg-6.col-xl-5.col-xxl-4.modify {
        padding-left: 86px;
    }

    p.justified-text-modify {
        margin-bottom: 0px;
        padding-top: 10px;
    }

    .carousel-caption.custom-caption {
        margin-bottom: 0px;
    }

    section.autonome .content-autonome-desc a.decouvrir {
        margin-top: 0px;
    }


    .product-item.shine {
        margin-left: 20px;
        margin-bottom: 20px;
    }


    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
    }

    section.mahassen-lives button.slick-prev.slick-arrow {
        position: absolute;
        bottom: 10px;
        left: inherit;
        right: 114px;
        padding-bottom: 75px;
        top: inherit;
    }

    .carousel-caption.custom-caption {
        text-align: center;
        padding-left: 70px;

    }

    section.mahassen-lives .mahassen-live-desc .diese {
        margin-top: 0;
        margin-bottom: 30px;
        text-align: center;
        position: relative;
        height: 116px;
    }

    section.mahassen-lives .mahassen-live-desc .diese img {
        height: 100%;
    }

    section.mahassen-lives .mahassen-live-desc .diese::after {
        position: absolute;
        content: "";
        width: 531px;
        height: 286px;
        background: #fbfaf8;
        top: 23px;
        right: -206px;
        z-index: -1;
    }


    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 90px;
    }

    section.mahassen-lives .mahassen-live-desc span.live {
        position: absolute;
        bottom: 76px;
        left: 8%;
        height: 324px;
        width: 624px;
        z-index: -1;
    }

    section.mahassen-lives .mahassen-live-desc span.live img {
        width: 100%;
        object-fit: cover;
    }


    /* end section mahassen live */


    /* start section abonnez vous */


    section.abonnez-vous.no-bg {
        background: #fff;
    }



    section.abonnez-vous h5 {
        font-size: 25px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        color: var(--Heading_color);
        margin-bottom: 60px;
    }

    section.abonnez-vous .item {
        padding: 0 10px;
        position: relative;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        position: absolute;
        content: "";
        width: 56px;
        height: 40px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background-image: url(../images/playyoutube.png);
        cursor: pointer;
        pointer-events: none;
        display: none;
    }

    /* section.abonnez-vous .item img {
        width: auto;
        /* height: 100%; */
    } */

    .abonnez-vous-slider-instagram-centre-mahassen .item img {
        width: 100% !important;

    }

    .abonnez-vous-slider-visite-virtuel .item img {
        width: 100% !important;

    }

    .abonnez-vous-slider-inspirez-vous img {
        width: auto;
        height: auto;
        max-width: 100%;
        display: block;
    }


    section.abonnez-vous .slick-slider {
        margin: 0 -15px;
    }


    /* end section abonnez vous */


    /* start section abonnez vous */

    section.newsletter {
        padding: 5px 0 45px;
        text-align: center;
    }



    section.newsletter .email {
        max-width: 1050px;
        margin: 35px auto 0;
        display: grid;
        grid-template-columns: auto 238px;
        gap: 20px
    }

    section.newsletter .email input[type="email"] {
        padding: 16px;
        border: 1px solid #382e2e;
        outline: none;
        font-family: "Century-Gothic-Std", "Century Gothic";
    }



    section.newsletter .email .inscrire:hover {
        opacity: 0.5;
    }


    /* end section abonnez vous */


    /* start section icons */

    section.icons {
        padding: 50px 0;
        text-align: center;
    }

    section.icons .container-fluid {
        position: relative;
    }

    section.icons .container-fluid:after {
        position: absolute;
        content: "";
        top: 0;
        right: 0;
        bottom: 0;
        width: 15px;
        height: 100%;
        background: var(--white-color);
    }

    section.icons .container-fluid::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        bottom: 0;
        width: 15px;
        height: 100%;
        background: var(--white-color);
    }

    section.icons .item-desc img {
        margin: 30px auto 30px;
    }

    section.icons .item {
        position: relative;
        padding: 0 10px;
    }

    /* section.icons .item:after {
        position: absolute;
        content: "";
        height: 100%;
        width: 1px;
        background: #e6e6e6;
        right: 0;
        top: 0;
        bottom: 0;
    } */


    /* e6e6e6 */




    /* end section icons */


    /* start footer */

    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 60px 25px 35px;
        padding-left: 51px !important;
        justify-items: center;
        padding-right: 53px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer-content {
        padding-left: 20px !important;
        padding-right: 20px;
    }



    section.footer .footer-content h3 span {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-transform: initial;
        display: block;
        margin-top: 10px;
    }

    section.footer .footer-content .adresse {
        padding-left: 25px;
        background-image: url(../images/icon-maps.png);
        background-position: top 3px left;
        background-repeat: no-repeat;
        margin-bottom: 20px;
    }

    section.footer .footer-content .telephone a,
    section.footer .footer-content .email a {
        font-size: 15px;
        font-family: var(--Brand_title_fonts);
        text-transform: initial;
        display: block;
        color: var(--white-color);
        text-decoration: none;
    }

    section.footer .footer-content .telephone a span,
    section.footer .footer-content .email a span {
        margin: 0;
    }

    section.footer .footer-content .telephone {
        padding-left: 25px;
        background-image: url(../images/icon-tel.png);
        background-position: top 4px left;
        background-repeat: no-repeat;
        margin-bottom: 20px;
    }

    section.footer .footer-content .email {
        padding-left: 25px;
        background-image: url(../images/icon-email.png);
        background-position: top 7px left;
        background-repeat: no-repeat;
    }

    .footer-networks {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 0 21px;
    }

    .footer-networks a {
        color: var(--white-color);
    }

    .footer-networks i {
        font-size: 14px;
        font-weight: bold;
        margin-right: 15px;
        cursor: pointer;
    }

    .footer-networks .carte-banck {
        display: flex;
        gap: 15px;
    }


    /* end footer */


    /* ===============================================
            start page centre mahassen
=============================================== */


    /* start marketing */

    .header-marketing {
        height: auto !important;
        position: relative;
    }

    .header-marketing:after {
        position: absolute;
        content: "";
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        background: #00000020;
        z-index: 0;
    }

    .header-marketing img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-icons {
        position: absolute;
        top: 50%;
        right: 0;
        color: var(--white-color);
        z-index: 1;
        display: flex;
        flex-direction: column;
        gap: 20px;
        transform: translateY(-50%);
        overflow: hidden;
        width: auto;
    }

    .header-marketing .header-marketing-icons a {
        display: flex;
        background: var(--Heading_color);
        gap: 13px;
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 400;
        width: auto;
        padding: 14px;
        color: var(--white-color);
        text-decoration: none;
        align-items: center;
        position: relative;
        right: -186px;
        transition: right 2s;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons a i {
        font-size: 18px;
    }

    .header-marketing .header-marketing-desc {
        position: absolute;
        top: 50%;
        right: 50%;
        transform: translate(50%, -50%);
        text-align: center;
        color: var(--white-color);
        z-index: 1;
    }

    .header-marketing .header-marketing-desc.meilleur {
        width: 100%;
    }



    .header-marketing .header-marketing-desc h1 {
        font-size: 32px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        width: 53%;
        margin: 0 auto;
        font-size: 20px;
    }

    a.decouvre {
        font-size: 16px;
        font-weight: 400;
        font-family: var(--Brand_title_fonts);
        text-decoration: none;
        color: white;
        background: black;
        padding: 20px;
        width: 240px;
        height: 60px;
        clear: both;
        display: table;
        margin: 30px auto 0;
        text-transform: uppercase;
        transition: opacity 2s;
    }

    a.decouvre:hover {
        opacity: .5;
    }




    /* end marketing */


    /* start section nouveaute */
    .collection.mah-nouveaute.mah-Centre {
        margin-top: 50px;
    }

    section.collection.mah-nouveaute {
        position: relative;
        padding-left: 35px;
        padding-right: 35px;
    }


    .reseaux-all {
        padding-right: 20px;
    }


    .reseaux-mail {
        padding-bottom: 10px;
        padding-right: 6px;
    }

    section.collection.mah-nouveaute .content-img {
        padding-right: 168px;
        height: 702px;
    }


    section.collection.mah-nouveaute .content-img-collection {
        padding-right: 168px;
        height: 702px;
    }

    section.collection.mah-nouveaute .content-img-nouveaute {
        /* padding-right: 168px; */
    }

    section.collection.mah-nouveaute .content-img-nouveaute.shine-two-nouveaute {
        /* padding-right: 168px; */

    }

    section.collection.mah-nouveaute .content-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.collection.mah-nouveaute .content-img-nouveaute img {
        width: 100%;
        object-fit: cover;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 {
        position: absolute;
        top: 10%;
        right: 50%;
        transform: inherit;
        bottom: 90px;
        max-width: 352px;
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon {
        display: none;
    }

    section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 170px;
        gap: 30px;
        left: -700px;
    }


    /* end section nouveaute */


    /* start section hamam */

    .cont-description {
        width: 93%;
        padding-left: 20px;
        margin-top: 0px;
        padding-top: 42px;
    }

    .cont-description.brochure.mt-3 {
        padding-top: 0px
    }

    section.bloc3-app.bloc3 .cont-description {
        width: 95%;
        padding-left: 20px;
        margin-top: 0px;
        padding-top: 20px
    }

    section.bloc2-app.bloc2 .cont-description {
        width: 95%;
        padding-left: 20px;
        margin-top: 0px;
        padding-top: 94px
    }

    section.massage.coiffure .cont-description {
        width: 95%;
        padding-left: 20px;
        /* margin-left: 33px; */
        margin-top: 20px;
        padding-top: 20px !important;
    }

    section.lamarque {
        position: relative;
        padding-right: 2px;
        padding-left: 32px;
        padding-top: 70px;
        padding-bottom: 70px;
    }

    section.lamarque.soinPeau.cont-description {
        width: 100%;
        padding-left: 20px;
        /* margin-left: 33px; */
        margin-top: 50px;
    }

    .cont-description-right {
        width: 100%;
        margin-left: 11px;
        margin-top: 50px;
        padding-right: 70px;
    }

    .cont-description-categorie3 {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;

    }

    .description-content {
        max-height: 150px;
        /* Adjust this value to control how much content is shown initially */
        overflow: hidden;
        position: relative;
        transition: max-height 0.3s ease;
    }

    .description-expanded {
        max-height: none;
        /* Remove height limitation when expanded */
    }

    .read-more-btn {
        display: inline-block;
        margin-top: 10px;
        color: #007bff;
        cursor: pointer;
        text-decoration: none;
    }

    .read-more-btn:hover {
        text-decoration: underline;
    }



    .cont-description-categorie3 {
        width: 85%;

    }

    .cont-description-application {
        margin-top: 61px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 7px;
        text-align: justify;
    }

    .shine {
        position: relative;
        overflow: hidden;
    }

    .shine-esthetique {
        position: relative;
        overflow: hidden;
        max-width: 95%;
    }

    .nouveaute.Center-m .shine-esthetique {
        max-width: 100%;
    }

    section.hamam .cont-description {
        margin-top: 50px;
        padding-right: 53px;
        padding-left: 20px;
    }

    section.hamam {
        padding: 0 35px 0;
        position: relative;
        margin: 50px 0 50px;
    }

    section.hamam .hamam-img {
        background: url(../images/mahassen-centre1.jpg) left no-repeat;
        position: relative;
        top: 6%;
        right: 0;
        bottom: 0;
        left: -70px;
    }

    section.hamam .hamam-img .content-img-hammem {
        width: 250px;
        position: absolute;
        height: 250px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    section.hamam .hamam-img .content-img {
        width: 320px;
        position: absolute;
        height: 320px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    .adjustment-text-footer {
        margin-left: 20px;
        margin-right: 20px
    }


    section.hamam .hamam-img .content-img img {
        width: 100%;
    }


    /* end section hamam */


    /* start section massage */

    section.massage {
        padding: 35px 35px;
        padding: 60px 35px 35px 35px;
        position: relative;
    }

    section.massage.coiffure.marque {
        padding: 35px 35px;
        padding: 30px 35px 30px 35px;
        position: relative;
    }


    section.massage .hamam-img {
        position: relative;
        left: 13px;
        top: 43px;
    }

    .massage.coiffure.b2b-marque .hamam-img {
        left: 0;
        top: 0;
    }

    .massage.coiffure.b2b-marque .hamam-img {
        left: 0;
        top: 0;
    }

    section.massage .hamam-img-right {
        position: relative;
        /* right: 22px; */
    }


    section.massage:after {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: #f5f5f5;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: -1;
    }

    section.massage.coiffure:after {
        position: absolute;
        content: "";
        width: inherit;
        height: inherit;
        background-color: inherit;
        top: inherit;
        left: inherit;
        bottom: inherit;
        z-index: inherit;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }

    section.massage.coiffure::before {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: #f5f5f5;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
    }

    section.massage .content-img {
        text-align: center;
        width: 50%;
        /* margin: 0 auto; */
        width: 100%;
        /* height: 555px; */
        object-fit: cover;
        /* padding-right: 50px; */
    }

    section.massage.coiffure.b2b-marque .content-img {
        padding-right: 0;
        margin-right: 0;
    }

    section.massage.coiffure.b2b-marque .content-img {
        padding-right: 0;
        margin-right: 0;
    }

    section.massage .content-img img {
        width: 100%;
        /* height: 100%; */
        object-fit: contain;
    }

    button.slick-next.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
        z-index: 3;
    }

    button.slick-prev.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
        z-index: 3;
    }



    /* end section massage */


    /* start section la Marque */

    section.lamarque {
        position: relative;
        padding-right: 0px;
        padding-left: 0px;
        padding-top: 42px !important;
        padding-bottom: 0px;
    }

    .live-slider.slick-initialized.slick-slider .item {
        /* height: 594px; */
    }

    .live-slider.slick-initialized.slick-slider img {
        width: 100%;
        /* height: 100%; */
        object-fit: cover;
    }

    section.lamarque:after {
        position: absolute;
        content: "";
        width: 25%;
        height: 100%;
        background-color: transparent;
        top: 0;
        right: 50%;
        bottom: 0;
        z-index: -1;
    }

    section.lamarque .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -80px;
    }

    section.lamarque .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }

    section.lamarque .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        bottom: -80px;
    }

    section.lamarque .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }


    /* end section la Marque */


    /* start page esthetique-home */

    section.esthetique-home {
        padding: 50px 35px;
        margin-top: 50px;
        padding-top: 50px;

    }

    section.esthetique-home .content-slider-home {
        padding-left: 50px;
        position: relative;
    }

    section.esthetique-home span.count-slide-position {
        /* position: absolute; */
        /* bottom: -78px; */
        /* left: 145px; */
        font-size: 32px;
        font-family: var(--Brand_title_fonts);
        display: none;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 45px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;

    }


    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 102px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;

    }

    .content-img {
        flex: 0 0 auto;
        width: 100px;
        margin-right: 20px;
    }

    section.esthetique-home .content-img {
        height: 860px;
    }

    section.esthetique-home .content-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.esthetique-home h2 {
        font-size: 35px;
        text-align: center;
        margin-bottom: 50px;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    section.esthetique-home h3 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: 'Century-Gothic-Std';
        font-size: 25px;
        color: black;
    }

    section.esthetique-home p {
        font-size: 18px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        margin-bottom: 50px;
        text-align: justify;
        line-height: 35px;
        margin-top: 27px;
    }

    section.esthetique-home .homme-slider.slick-initialized.slick-slider .item {
        height: 100%;
    }

    section.esthetique-home .content-img-abs {
        position: relative;
        width: 100%;
        height: 100%;
    }

    section.esthetique-home .content-img-abs img {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 415px;
        height: 375px;
        object-fit: cover;
    }


    /* end page esthetique-home */


    /* ===============================================
            end page centre mahassen
=============================================== */


    /* ===============================================
            start page maquillage
=============================================== */


    /* start section collection.mah-nouveaute.maquillage */

    section.collection.mah-nouveaute.maquillage {
        background: white;
        padding: 50px 37px 50px;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: inherit;
        left: 37px;
        right: inherit;
        transform: inherit;
        bottom: 0;
        max-width: 472px;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
        position: absolute;
        top: inherit;
        left: 37px;
        right: inherit;
        transform: inherit;
        bottom: -189px;
        max-width: 472px;
        z-index: 1;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        padding-right: 0;
        height: 700px;
        max-width: 722px;
        margin-left: auto;
    }


    section.collection.mah-nouveaute.maquillage .content-img-collection {
        padding-right: 0;
        max-width: 722px;
        margin-left: auto;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 55px 0 0 20px;
    }

    section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
        bottom: 170px;
        gap: 30px;
        right: -141%;
        left: inherit;
    }


    /* end section collection.mah-nouveaute.maquillage */


    /* start collection.mahassen */

    section.collection.mahassen {
        padding: 50px 37px 50px;
        margin-top: 120px;
        background: #f5f5f5;
    }

    section.collection.mahassen h2 {
        font-size: var(--Brand_title_size_level_forth);
        font-weight: 700;
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
        text-align: center;
        margin-bottom: 50px;
    }

    section.collection.mahassen .slick-slider {
        margin: 0 -22px;
    }

    section.collection.mahassen .item {
        padding: 0 22px;
    }

    section.collection.mahassen .item .product-item {
        height: 454px;
        margin-bottom: 25px;
    }

    section.collection.mahassen .item img {
        height: 100%;
        background-size: cover;
    }

    section.collection.mahassen .item a {
        text-decoration: none;
    }

    section.collection.mahassen .item h4 {
        text-align: center;
        text-decoration: none;
        font-size: 28px;
        margin: 15px 0 15px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
    }

    section.collection.mahassen .slick-dots {
        bottom: -39px;
    }

    section.collection.mahassen .slick-dots li button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 10px;
        height: 10px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: 0;
        background: black !important;
        color: black !important;
        border-radius: 50%;
        margin: 0 auto;
    }

    section.collection.mahassen .slick-dots li.slick-active button {
        font-size: 0;
        line-height: 0;
        display: block;
        width: 25px;
        height: 25px;
        cursor: pointer;
        color: transparent;
        border: 0;
        outline: 0;
        background: transparent !important;
        color: transparent !important;
        border-radius: 50%;
        margin: 0 auto;
        border: 2px solid #989898;
    }


    /* end collection.mahassen */


    /* start section product cosmetique maquillage */

    section.product-cosmetique.maquillage {
        padding: 0px 0 40px;
        background: white;
    }

    .collection.mah-nouveaute.maquillage img {
        /* height: 700px; */
    }

    section.product-cosmetique.maquillage.maquillage2 {
        padding: 20px 0 20px 0px !important;
        background: white !important;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: var(--Brand_title_size_level_forth);
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
        text-align: center;
        margin-bottom: 50px;
    }


    /* end section product cosmetique maquillage */


    /* start section idees */

    section.idees {
        padding: 50px 37px 50px;
        background: #f5f5f5;
    }

    section.idees .slick-slider {
        margin: 0 -24px;
    }

    section.idees .item-desc {
        text-align: center;
    }


    section.idees .item {
        padding: 0px 37px;
        display: inline-block;
    }

    section.idees.soin .item {
        padding: 0px 37px;
        display: inline-block;
    }

    /* section.idees .product-item {
        height: 685px !important;
    } */

    section.idees .item .product-item:nth-child(odd) {
        margin-bottom: 45px;
    }

    section.idees .item .product-item:nth-child(even) {
        margin-top: 45px;
    }

    section.idees .item .product-item img {
        height: auto;
        background-size: cover;
    }

    section.idees .item a {
        text-decoration: none;
    }


    /* end section idees */


    /* ===============================================
            end page maquillage
=============================================== */


    /* ================== start section inscrivez-vous */

    section.inscrivez-vous {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: #4c4c4ce3;
        z-index: 5;
        display: none;
    }

    section.inscrivez-vous .container {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 45px 50px 45px 65px;
    }



    section.inscrivez-vous .content_networks-pop-up {
        display: flex;
        gap: 15px;
    }

    section.inscrivez-vous .content_networks-pop-up a {
        color: black;
        transition: all 2s;
    }

    section.inscrivez-vous .content_networks-pop-up a:hover {
        opacity: .5;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        display: grid;
        grid-template-columns: auto 130px;
        gap: 10px;
        width: 73%;
        margin-bottom: 25px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
        height: 40px;
        border: 1px solid #000;
        padding: 9px;
        outline: none;
        color: #7f7f7f;
    }



    section.inscrivez-vous .inscrivez-vous-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .content-inscrivez-vous {
        display: grid;
        grid-template-columns: 70% 30%;
        background: white;
        position: relative;
        gap: 1px;
        max-width: 930px;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark {
        position: absolute;
        top: -19px;
        right: -16px;
        padding: 10px;
        background: black;
        color: white;
        transition: opacity 2s;
        cursor: pointer;
        z-index: 1;
    }

    .content-inscrivez-vous i.fa-sharp.fa-solid.fa-xmark:hover {
        opacity: .5;
    }


    /* ================== end section inscrivez-vous */


    /* ============================================
                 start page fond de teint
============================================ */


    /* start navigayions links */

    .navigation-links {
        text-align: center;
        padding: 0 50px;
    }

    .navigation-links .container-fluid {
        padding: 166px 0;
        height: 100%;
        background: #00000020;
    }



    .navigation-links .breadcrumb {
        justify-content: center;
        margin: 0;
    }

    .navigation-links nav {
        border: none;
        color: #505050;
    }

    .navigation-links li.breadcrumb-item,
    .navigation-links li.breadcrumb-item a {
        font-family: "Century-Gothic-Std", "Century Gothic";
        height: 100%;
        font-weight: 300;
        text-decoration: none;
        white-space: nowrap;
        color: #fff;
        font-size: 14px;
        font-weight: 400;
    }

    .navigation-links li.breadcrumb-item a {
        text-decoration: none;
        text-transform: none;
    }




    /* end navigayions links */


    /* start section fond-de-tient-details */

    section.fond-de-tient-details {
        padding: 50px 33px 50px;
    }





    section.fond-de-tient-details .content-img .content-one .content-one-img {
        position: relative;
        height: 400px;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart {
        position: absolute;
        top: 20px;
        right: 20px;
        bottom: inherit;
        left: inherit;
        padding: 16px;
        color: #000;
        background: white;
        font-size: 18px;
        display: none;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img .fa-regular.fa-heart.active {
        color: red;
        display: block;
    }

    section.fond-de-tient-details .content-img .content-one .content-one-img:hover .fa-regular.fa-heart {
        display: block;
    }

    section.fond-de-tient-details .content-img .content-one-img a.fancybox img {
        width: 100%;
        object-fit: cover;
        height: 100%;
    }


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

    .select_wrap {
        margin: 40px auto 20px 0;
        position: relative;
        user-select: none;
        max-width: 573px;
    }

    .select_wrap ul {
        list-style: none;
        padding: 0;
    }

    .select_wrap .default_option {
        background: #fff;
        border-radius: 5px;
        position: relative;
        cursor: pointer;
        border: 1px solid #e4e3e3;
    }

    .select_wrap .default_option:before {
        content: "";
        position: absolute;
        top: 18px;
        right: 18px;
        width: 16px;
        height: 16px;
        border: 2px solid;
        border-color: transparent transparent #555555 #555555;
        transform: rotate(-45deg);
    }

    .select_wrap .select_ul {
        position: absolute;
        top: 56px;
        left: 0;
        width: 100%;
        background: #fff;
        border-radius: 5px;
        display: none;
        -webkit-box-shadow: 3px 3px 26px -6px rgb(165 160 160);
        -moz-box-shadow: 3px 3px 26px -6px rgba(165, 160, 160, 1);
        box-shadow: 3px 3px 26px -6px rgb(165 160 160);
    }

    .select_wrap .select_ul li {
        cursor: pointer;
    }

    .select_wrap .select_ul li:first-child:hover {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
    }

    .select_wrap .select_ul li:last-child:hover {
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .select_wrap .option {
        display: flex;
        align-items: center;
        height: 54px;
        box-sizing: border-box;
        padding: 0 15px 0 20px;
    }

    .select_wrap .option p {
        margin: 0;
        font-size: var(--Brand_para_size);
        font-family: var(--Brand_title_fonts);
        font-weight: 400;
        color: #454545;
    }

    .select_wrap .option .icon {
        background: url('../images/teinte-plan.png') no-repeat 0 0;
        width: 32px;
        height: 32px;
        margin-right: 15px;
    }

    .select_wrap .option.teinte-num0 .icon {
        background-position: 0 -10px;
    }

    .select_wrap .option.teinte-num1 .icon {
        background-position: 0 -64px;
    }

    .select_wrap .option.teinte-num2 .icon {
        background-position: 0 -120px;
    }

    .select_wrap .option.teinte-num3 .icon {
        background-position: 0 -173px;
    }

    .select_wrap .option.teinte-num4 .icon {
        background-position: 0 -227px;
    }

    .select_wrap .option.teinte-num5 .icon {
        background-position: 0 -282px;
    }

    .select_wrap .option.teinte-num6 .icon {
        background-position: 0 -335px;
    }

    .select_wrap.active .select_ul {
        display: block;
        z-index: 1;
    }

    .select_wrap.active .default_option:before {
        top: 25px;
        transform: rotate(-225deg);
    }


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

    .fond-de-tient-description .avis {
        margin-top: 15px;
    }


    /* .fond-de-tient-description {
    padding-left: 65px;
} */





    .fond-de-tient-description p {
        font-family: 'Century-Gothic-Std';
        text-align: justify;
        font-size: 15px;
        color: var(--Heading_color);
        margin-bottom: 0;
    }



    .fond-de-tient-description h5,
    .fond-de-tient-description h5 span {
        font-size: 20px;
        margin-bottom: 15px;
        text-transform: uppercase;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description span.all-avis {
        color: #737373;
        display: inline-block;
        margin: 0 20px 0 10px;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description span.rediger-avis {
        color: #737373;
        font-family: var(--Brand_title_fonts);
    }

    .fond-de-tient-description .content-img-fond-de-tient {
        margin-bottom: 30px;
    }






    /* start section slick */



    .fond-de-tient-description .product-item img {
        width: 100%;
    }

    .fond-de-tient-description .item a {
        text-align: center;
        text-decoration: none;
    }

    .fond-de-tient button.slick-prev.slick-arrow,
    .fond-de-tient button.slick-next.slick-arrow {
        display: none !important;
    }


    /* end section click */


    /* end section fond-de-tient-details */


    /* start page coupe */







    .fond-de-tient-description .grid-avis .btn-increment button.btn-increment-btn {
        width: 42px;
        outline: none;
        border: 1px solid #dad7d7;
        background: #f8f8f8;
        font-size: 23px;
        color: #6f6f6f;
    }

    .fond-de-tient-description .grid-avis .btn-increment input[type="text"] {
        width: 277px;
    }

    .fond-de-tient-description .avis .grid-btn button {
        outline: none;
        border: none;
        background: black;
        color: white;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-weight: 700;
        text-transform: uppercase;
        padding: 10px 14px;
        transition: all 2s;
        font-size: 15px;
    }

    .fond-de-tient-description .avis .grid-btn button:hover {
        opacity: .5;
    }

    .fond-de-tient-description .avis .grid-btn button img {
        display: inline-block;
        margin-right: 7px;
        margin-top: -7px;
    }

    .fond-de-tient-description p.partager {
        color: #737373;
        font-family: var(--Brand_title_fonts);
    }


    /* end page coupe */


    /* ============================================
                 end page fond de teint
============================================ */


    /* ============================================
                 start page coiffure
============================================ */

    section.nos-services-coiff {
        padding: 50px 35px;
    }

    section.nos-services-coiff .grid-nos-services-coiff {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 30px;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff {
        position: relative;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff img {
        width: 100%;
        object-fit: cover;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff h4 {
        position: absolute;
        bottom: 0;
        text-align: center;
        left: 0;
        right: 0;
        font-size: 19px;
        font-family: var(--Brand_title_fonts);
        font-weight: 700;
        text-transform: uppercase;
        background: #ffffffc7;
        margin: 0;
        padding: 16px 0;
    }

    section.nos-services-coiff .grid-nos-services-coiff .service-coiff a.service-coiff-link {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        z-index: 1;
    }

    div#coiffureCarousel {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner .carousel-item {
        height: 100%;
    }

    div#coiffureCarousel .carousel-inner img.d-block.w-100 {
        height: 100% !important;
        object-fit: cover;
    }

    section.bannierCoiff {
        padding: 50px 35px 0;
    }

    section.bannierCoiff div#coiffureCarousel2 {
        height: 280px;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner {
        height: 100%;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item {
        height: 100%;
    }

    section.bannierCoiff div#coiffureCarousel2 .carousel-inner .carousel-item img.d-block.w-100 {
        height: 100%;
        object-fit: cover;
    }


    /* ============================================
                 end page coiffure
============================================ */


    /* ============================================
                 responsive
============================================ */




    @media (min-width: 1200px) and (max-width:1676px) {

        /* start page fond de tien */
        /* section.fond-de-tient-details {
        padding: 50px 15px;
    } */
        .content-fond-de-tient {
            padding: 40px 50px 20px;
        }



        /* end page fond de tien */
    }

    @media (max-width: 767px) {

        /* start header */
        .content_slider .carousel-item {
            height: 250px !important;
        }

        .content_slider .carousel-item img.d-block.w-100 {
            object-fit: cover;
        }

        /* end header */
        /* start header icon */
        .header_logo_icons .content_lang {
            margin-bottom: 0px;
            justify-content: space-between;
        }

        .header_logo_icons .header_icons {
            justify-content: center;
            /* margin-top: 33px; */
        }

        /* end header icon */
        /* start section mahassen-lives */
        section.mahassen-lives .mahassen-live-desc span.live {
            left: 2%;
            font-size: 12rem;
        }

        section.mahassen-lives .mahassen-live-desc .diese::after {
            width: 227px;
            height: 227px;
            top: 142px;
            right: 50%;
            transform: translateX(50%);
        }

        section.mahassen-lives .mahassen-live-desc {
            margin-bottom: 50px;
        }

        section.mahassen-lives .mahassen-live-desc p {
            margin-bottom: 0;
        }

        section.mahassen-lives .mahassen-live-desc a.decouvrir {
            margin-top: 30px;
        }

        /* end section mahassen-lives */
        /* start section autonome */
        section.collection {
            padding-bottom: 50px;
            padding-top: 40px;
        }

        section.autonome .content-autonome {
            display: grid;
            grid-template-columns: auto;
        }

        section.autonome .content-autonome .picture {
            margin-bottom: 15px;
            height: 565px;
        }

        section.autonome .content-autonome-desc {
            padding-top: 50px;
        }

        section.autonome .content-autonome-desc h2 {
            font-size: 89px;
            font-family: var(--Brand_title_fonts);
            text-transform: uppercase;
            position: inherit;
            top: inherit;
            left: inherit;
            right: inherit;
            width: auto;
        }

        section.autonome .content-autonome-desc span {
            color: var(--grayLighten_color);
        }

        section.autonome .content-autonome-desc p {
            padding-right: 0;
        }

        section.autonome div#carouselExampleCaptions2 .carousel-indicators {
            position: absolute;
            top: inherit;
            right: 50%;
            transform: translateX(50%);
            flex-direction: row;
            gap: inherit;
            margin: 0;
            bottom: 0;
        }

        /* end section autonome */
        /* start section abonnez-vous */
        section.abonnez-vous {
            padding: 50px;
        }

        section.abonnez-vous .slick-slider {
            margin: 0;
        }

        /* end section abonnez-vous */
        /* start section newsletter */
        section.newsletter {
            padding: 50px 0;
        }

        section.newsletter .email {
            max-width: 100%;
            grid-template-columns: auto 159px;
            gap: 5px;
        }

        /* end section newsletter */
        /* start section maquillage */
        section.maquillage {
            padding: 50px 0;
        }

        section.maquillage .content-autonome-desc {
            margin-top: 50px;
        }

        section.maquillage .content-carousel-maquillage {
            margin-top: 50px;
        }

        section.maquillage .video-container {
            height: 545px;
        }

        section.maquillage div#carouselExampleCaptions3,
        section.autonome div#carouselExampleCaptions2 {
            position: relative;
            top: 40px;
            width: 90%;
            top: inherit;
            left: inherit;
            margin: 0 auto;
        }

        section.maquillage div#carouselExampleCaptions3 .carousel-indicators {
            bottom: -30px;
        }

        /* start section maquillage */
        /* start section nouveaute */
        section.nouveaute {
            padding: 50px 0;
        }

        section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
            font-size: 58px;
        }

        section.nouveaute .content-noveaute-desc .contnet-nouveaute {
            position: inherit;
            top: inherit;
            transform: inherit;
            left: inherit;
            margin-bottom: 50px;
        }

        /* end section nouveaute */
        /* start section nouveaute */
        section.nouveaute .content-image {
            height: 265px;
        }

        section.nouveaute .content-image img {
            width: 100%;
            height: 265px;
            object-fit: cover;
        }

        /* end section nouveaute */
        /* start section avis */
        section {
            padding-right: 0 !important;
            padding-left: 0 !important;
        }

        section.avis-clients img {
            top: 184px;
        }

        section.avis-clients .avis-slider.slick-initialized.slick-slider {
            padding: 115px 0;
        }

        section.avis-clients h2 {
            font-size: 58px;
            margin-bottom: 130px;
        }

        section.avis-clients .avis-slider .item .author-avis {
            margin-top: 80px;
        }

        section.avis-clients .avis-slider .item .author-avis:after {
            height: 32px;
        }

        section.avis-clients .slick-next:before {
            right: -22px;
            width: 35px;
        }

        section.avis-clients .slick-prev:before {
            left: -22px;
            width: 35px;
        }

        span.slick-prev-index {
            left: -23px;
        }

        span.slick-next-index {
            right: -23px;
        }

        /* end section avis */
        /* start page collection */
        section.collection .desc_collection {
            padding: 252px 0 0;
            gap: 50px;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 {
            max-width: 100%;
            height: 750px;
            margin-left: 0;
            margin-right: 0;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-inner {
            height: 100%;
        }

        section.collection .collection_hiver .content-img_collection {
            bottom: -338px;
            left: 33px;
            width: 353px;
            height: 425px;
        }

        section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
            width: 100%;
        }

        section.collection .collection_hiver .carousel-indicators {
            justify-content: end;
            margin: 0;
        }

        section.collection .collection_hiver .content-img_collection img {
            width: 70%;
            height: 250px;
            object-fit: cover;
        }

        /* end page collection */
        /* start section carte-mahassen */
        .slick-next {
            right: 0;
        }

        .slick-prev {
            left: 0;
        }

        section.carte-mahassen {
            padding: 50px 0 166px;
        }

        section.carte-mahassen.centre-m {
            padding: 50px 0;
        }

        section.carte-mahassen .content-carte-mahassen .content-carte-one p {
            max-width: 100%;
        }

        section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
            grid-template-columns: 30px auto 95px;
        }

        section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
            font-size: 100px;
            margin-left: -34px;
        }

        section.carte-mahassen .content-carte-mahassen.carte-two {
            padding-left: 30px;
        }

        /* end section carte-mahassen */
        /* start produit cosmetique */
        section.product-cosmetique .item {
            padding: 0px 5px;
        }

        section.product-cosmetique .item .item-desc {
            padding: 26px 15px;
        }

        section.product-cosmetique button.slick-next.slick-arrow {
            right: 0;
        }

        section.product-cosmetique .slick-slider {
            margin: inherit;
        }

        section.product-cosmetique .item .product-item .item-icons i {
            padding: 10px;
        }

        section p {
            /* font-size: 20px !important; */
        }

        /* start produit cosmetique */
        /* start section abonnez vous */
        section.abonnez-vous {
            margin-top: 20px;
        }

        /* start section abonnez vous */
        /* start footer */
        section.footer .footer-content {
            grid-template-columns: repeat(2, 1fr);
            gap: 30px 20px;
        }

        /* end footer */
        /* ===========================================
            start page centre mahassen
    =========================================== */
        /* start section collection.mah-nouveaute */
        section.collection.mah-nouveaute .content-img {
            padding-right: 0;
            height: 500px;
            padding-bottom: 40px;
        }

        section.collection.mah-nouveaute div#carouselExampleCaptions3 {
            position: relative;
            top: inherit;
            right: inherit;
            transform: inherit;
            bottom: 0;
            max-width: 100%;
            width: 100%;
        }

        section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-indicators {
            bottom: -37px;
            left: 0;
        }

        /* end section collection.mah-nouveaute */
        /* start section hamam */
        section.hamam {
            margin: 102px 0 0;
        }

        section.hamam .hamam-img {
            position: relative;
            top: inherit;
            right: inherit;
            bottom: inherit;
            left: inherit;
            height: 400px;
        }

        section.hamam .hamam-img .content-img {
            left: 0;
            bottom: 0;
        }

        /* start section hamam */
        /* start section esthetique-home */
        section.esthetique-home {
            padding: 75px 0 100px;
        }

        section.esthetique-home h2 {
            font-size: 60px;
            margin-bottom: 40px;
        }

        section.esthetique-home .content-slider-home {
            padding-left: 0;
        }

        section.esthetique-home .content-img {
            height: 550px;
            margin-bottom: 50px;
        }

        section.esthetique-home .content-img-abs img {
            bottom: -31px;
            right: 7px;
            width: 215px;
            height: 215px;
        }

        section.esthetique-home .slick-next {
            /* right: 0;
            left: inherit; */
            left: 298px;
        }

        section.esthetique-home .slick-prev {
            right: 180px;
            left: inherit;
        }

        section.esthetique-home span.count-slide-position {
            left: inherit;
            right: 95px;
        }

        /* start section esthetique-home */
        /* start section massage */
        section.massage {
            padding: 103px 0;
        }

        section.massage .content-img {
            margin-bottom: 35px;
        }

        section.massage.coiffure::before,
        section.massage:after {
            height: 643px;
            top: 60px;
        }

        .cont-description {
            width: 100%;
            margin-top: 35px;
        }

        /* end section massage */
        /* start section collection */
        section.collection .desc_collection {
            padding: 100px 0 0;
        }

        /* end section collection */
        /* start  section esthetique-home */
        section.esthetique-home {
            margin-top: 0;
        }

        /* end  section esthetique-home */
        /* start section lamarque */
        .live-slider.slick-initialized.slick-slider .item {
            /* height: 494px; */
            height: 100%;
        }

        section.lamarque:after {
            width: 50%;
            top: inherit;
            right: 50%;
            bottom: 10px;
            height: 620px;
        }

        /* end section lamarque */
        /* ===========================================
            end page centre mahassen
    =========================================== */
        /* ==============================================
                 start page maquillage
    ============================================== */
        /* start header-marketing */
        .header-marketing .header-marketing-desc.meilleur p {
            width: 90%;
        }

        /* end header-marketing */
        /* start section idees */
        section.idees .slick-slider {
            margin: inherit;
        }

        section.idees .item {
            padding: 0px 5px;
        }

        /* end section idees */
        /* start section collection.mahassen */
        section.collection.mahassen {
            margin-top: 0;
        }

        section.collection.mahassen .item {
            padding: 0px 5px;
        }

        section.collection.mahassen .slick-slider {
            margin: inherit;
        }

        /* end section collection.mahassen */
        /* start section mahassen-lives */
        section.mahassen-lives .item {
            padding: 0 5px;
        }

        /* end section mahassen-lives */
        /* start collection.mah-nouveaute.maquillage */
        section.collection.mah-nouveaute.maquillage .desc_collection {
            padding: 55px 0 0 0;
        }

        section.collection.mah-nouveaute.maquillage .content-img {
            max-width: 100%;
        }

        section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 {
            position: relative;
            top: inherit;
            left: inherit;
            right: inherit;
            transform: inherit;
            bottom: inherit;
            max-width: inherit;
            z-index: 1;
            margin-bottom: 30px;
        }

        section.collection.mah-nouveaute.maquillage div#carouselExampleCaptions3 .carousel-indicators {
            right: 0;
            left: 0;
            bottom: -22px;
            position: absolute;
        }

        /* end collection.mah-nouveaute.maquillage */
        /* start section abonnez-vous */
        section.abonnez-vous .item {
            padding: 0 5px;
        }

        /* end section abonnez-vous */
        /* ==============================================
                 end page maquillage
    ============================================== */
        /* ==============================================
                start pop up maquillage
    ============================================== */
        .content-inscrivez-vous {
            grid-template-columns: auto;
            width: 80%;
        }

        section.inscrivez-vous .inscrivez-vous-description {
            order: 1;
            padding: 20px;
        }

        section.inscrivez-vous .inscrivez-vous-description .email {
            grid-template-columns: auto;
            width: 100%;
        }

        section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
            height: 40px;
        }

        .inscrivez-vous-img {
            order: 0;
            height: 250px;
            padding-top: 20px;
        }

        section.inscrivez-vous .inscrivez-vous-img img {
            object-fit: scale-down;
        }

        section.inscrivez-vous h2 {
            font-size: 23px !important;
        }

        section.inscrivez-vous .inscrivez-vous-description .email input[type="email"] {
            width: 100%;
        }

        /* ==============================================
                end pop up maquillage
    ============================================== */
        /* start page fond de tient */
        .navigation-links {
            padding: 0 10px;
        }

        section.fond-de-tient-details {
            padding: 20px 0;
        }



        section.fond-de-tient-details .content-img {
            margin-bottom: 45px;
        }

        .fond-de-tient-description {
            padding-left: 0;
        }

        .content-fond-de-tient {
            padding: 40px 22px 20px;
        }

        .fond-de-tient-description .product-item {
            margin: 0 5px 18px;
            -webkit-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
            -moz-box-shadow: 3px 8px 26px -21px rgba(165, 160, 160, 1);
            box-shadow: 3px 8px 26px -21px rgb(165 160 160);
        }

        /* end page fond de tient */
        /* start page coupe */
        .fond-de-tient-description .grid-avis {
            flex-direction: column;
        }

        .fond-de-tient-description .avis .grid-btn {
            grid-template-columns: repeat(1, 1fr);
        }

        section.fond-de-tient-details .content-img .content-one {
            gap: 15px;
        }

        /* coupe page coupe */
        /* start page coiffure */
        div#coiffureCarousel {
            padding-bottom: 40px;
        }

        section.bannierCoiff {
            padding: 40px 35px;
        }

        section.nos-services-coiff {
            padding: 50px 35px 0;
        }

        section.nos-services-coiff .grid-nos-services-coiff {
            grid-template-columns: repeat(2, 1fr);
        }

        section.nos-services-coiff .grid-nos-services-coiff {
            gap: 15px;
        }

        /* end page coiffure */
        .collection .container .col-md-6.col-lg-6 {
            height: 550px;
        }
    }

    /* ============================================
                    end page centre mahassen
    ============================================ */
}



@media (min-width: 1440px) and (max-width: 1476px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 50px;
    }


}

@media (min-width: 1441px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 50px;
    }


}

@media (min-width: 768px) and (max-width: 1024px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        padding-left: 1px;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

}

@media (max-width: 480px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    /*
    .footer-qrq {
        padding-left: 50px;
    }*/
}


@media (min-width: 481px) and (max-width: 767px) {
    section.footer {
        background: var(--Heading_color);
        color: var(--white-color);
        padding: 52px 25px 25px;
        padding-right: 95px !important;
        border-bottom: 2px solid #2e2e2e;
    }

    .footer-qrq {
        display: block;
        text-align: center;
    }
}



/* @media (min-width: 1200px) and (max-width: 1676px)  */

@media screen and (min-width: 1024px) {

    section.collection .desc_collection a.decouvrir:hover,
    section.autonome .content-autonome-desc a.decouvrir:hover,
    section.maquillage .content-autonome-desc a.decouvrir:hover,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
    section.avis-clients a.decouvrir:hover,
    section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
    .cont-description a.decouvrir:hover {
        /* background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important; */
        background-size: 145px !important;
        transition: 1s all ease-out;
    }


    .blog-slider .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 34px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 142px;
        width: 60px;
        content: "";
        top: 92px;
    }

    .blog-slider .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -527px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 142px;
        width: 60px;
        content: "";
        top: 92px;
    }

    /* .carousel-maquillage .slick-next:after, .carousel-inner .slick-next:after {

        top: -80px;
    } */

    .indicators .carousel-inner {
        position: relative;
        width: 100%;
        overflow: visible;
    }

    .sliderTop .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 43%;
        display: block;
        padding: 0;
        left: auto;
        right: 60px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        /* z-index: 999; */
        right: -76px;
    }

    .col-xs-12.col-md-6.px-5.nouveau-client {
        padding-top: 45px;
    }

    .sliderTop .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        background: url(../images/btnleft.png)center no-repeat;
        height: 20px;
        width: 60px;
    }

    .sliderTop .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 58%;
        display: block;
        padding: 0;
        left: inherit;
        right: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        right: -76px;
    }

    .sliderTop .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
    }

    .carousel-innerMake .carousel-inner.item.shine {
        height: 705px;
        max-width: 410px;
        margin: 0 auto;
        left: 0;
        right: 0;
        position: relative;
        text-align: center;
        width: 100%;
        float: left;
        z-index: 999;
        overflow: visible !important;
    }

    section.maquillage div#carouselExampleCaptions2 {
        position: absolute;
        top: 40px;
        width: 480px;
        min-height: 785px;
        top: 50px;
        left: -89px;
        z-index: 0;
    }

    /* .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 35%;
        display: block;
        padding: 0;
        left: auto;
        right: -50px;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        bottom: 0;
        width: auto;
      } */

    .carousel-innerMake .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 12%;
        display: block;
        width: auto;
        height: 19px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: -41px;
    }

    .carousel-innerMake .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: 26%;
        display: block;
        width: auto;
        height: 50px;
        padding: 0;
        left: auto;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: rotate(90deg);
        right: -46px;
    }

    .carousel-innerMake .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0;
        font-weight: 300;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-innerMake .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -20px;
        right: 160px;
        width: 50px;
        height: 30px;
        left: inherit;
        z-index: 2;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-maquillage button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: -20px;
        right: 52px;
        width: 50px;
        height: 30px;
        left: inherit;
        z-index: 2;
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .carousel-maquillage .slick-prev:before {
        /* color: var(--Heading_color); */
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -103px;
        font-weight: 300;
        top: inherit !important;
        height: 20px;
    }

    .carousel-maquillage .slick-next:before {
        /* color: var(--Heading_color); */
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -103px;
        font-weight: 300;
        top: inherit !important;
        height: 20px;
    }

    .row.ancienne-collection {
        display: flex;
        justify-content: center;
    }

    .bloc-6-collection .container.anciene-co {
        text-align: center;
    }

    .item-anciennecoll {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
    }

    .img-anciennecoll {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 10px;
    }

    .img-anciennecoll img {
        max-width: 100%;
        height: auto;
        display: block;
    }

    .title-anciennecoll {
        margin-top: 10px;
        font-size: 16px;
        font-weight: bold;
    }



    .carousel-maquillage .slick-next:before {
        /* color: var(--Heading_color); */
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        top: 46px;
    }

    /* Target the next button within the specific carousel in the .autonome.home section */
    .autonome.home .carousel-inner .slick-next:before {
        height: 10px !important;
        width: 60px;
        content: "";
        left: -93px !important;
    }

    /* Target the previous button within the specific carousel in the .autonome.home section */
    .autonome.home .carousel-inner .slick-prev:before {
        height: 10px !important;
        width: 60px;
        content: "";
        left: -93px !important;
    }

    .collection.home .collection_hiver.slick-next:before,
    .carousel-inner .slick-prev:before {
        height: 10px !important;
        width: 60px;
        content: "";
        /* top: -80px !important; */
        left: -100px !important;
    }



    /* section.collection.home .collection_hiver .collection.home .collection_hiver.slick-next:before, .carousel-inner .slick-prev:before {
        height: 10px !important;
        width: 60px;
        content: "";
        left: -40px !important;
    } */

    section.autonome.home .product-maquillage-pro .product-page-acceuil.slick-initialized.slick-slider.slick-dotted.slick-next:before {
        height: 10px !important;
        width: 60px;
        content: "";
        /* top: -80px !important; */
        left: -99px !important;
    }
}

@media screen and (min-width: 1600px) {
    section.hamam .hamam-img .content-img {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }

    section.hamam .hamam-img .content-img-left {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }

    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }

    section.collection.mah-nouveaute .content-img {
        padding-right: 210px;
        height: 742px;
        width: 100%;
    }

    .sliderTop .slick-prev {
        top: 48%;
    }

}

/* tabs  page fond de tien */
section.content-tabs {
    padding: 15px 0 50px;
    height: 100%;
}

section.product-cosmetique h2 {
    font-size: 24px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 40px;
    letter-spacing: 0.02rem;
    text-align: center;
}

.tabsmahassen {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0 auto;
    text-align: center;
    justify-content: center;
    border-bottom: 2px solid #e7e7e7;
    gap: 40px;
}

.tabsmahassen li {
    padding: 10px;
    cursor: pointer;
    transition: 0.2s;
    border-bottom: 4px solid transparent;
    font-size: 17px;
    position: relative;
}

.tabsmahassen li:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: -6px;
    background: #f33f38;
    width: 0;
    height: 4px;
}

.tabsmahassen li.active:after,
.tabsmahassen li:hover:after {
    width: 100%;
}

.content {
    text-align: -webkit-center;
}

.content-tabs .content p {
    line-height: 30px;
    font-size: 14px;
    color: #000;
}

.content>div {
    padding: 45px 20px 20px;
}

.content>div:not(:first-child) {
    display: none;
}

p.descrip-product {
    padding: 22px 0 15px;
}

/*button.slid-next.slick-arrow {
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
}

button.slid-prev.slick-arrow {
    transition: opacity 0.6s ease;
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(188deg);
    background-size: 100%;
    width: 13px !important;
    height: 60px !important;
    padding: 10px;
    margin-right: 0px;
    margin-left: 0px;
    position: absolute;
    display: inline-block;
} */

/* carrousel avec fleche  */
.content_slider button.slid-next.slick-arrow:after {
    position: absolute;
    content: "";
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(270deg);
    background-size: 100%;
    opacity: 1 !important;
    width: 13px;
    height: 58px !important;
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0;
}

.content_slider button.slid-prev.slick-arrow:after {
    position: absolute;
    content: "";
    background: url(../images/btnright.png)center no-repeat;
    transform: rotate(90deg);
    background-size: 100%;
    opacity: 1;
    width: 13px;
    height: 58px !important;
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 20px 0px;
}

.collection_hiver .slide-arrow-left:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/left.png)center no-repeat;
    /* transform: rotate(90deg); */
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 5px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

.collection_hiver .slide-arrow-right:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/right.png)center no-repeat;
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 58px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

div#carouselExampleCaptions3 .slide-arrow-left:after {
    position: relative;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/left.png)center no-repeat;
    /* transform: rotate(90deg); */
    background-size: 100%;
    opacity: 1;
    width: 12px;
    /* height: 5px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

div#carouselExampleCaptions3 .slide-arrow-right:after {
    position: absolute;
    content: "";
    /* width: 17px; */
    /* height: 2px; */
    /* background-color: var(--Heading_color); */
    top: 0;
    /* transform: translateY(-50%); */
    /* left: -20px; */
    background: url(../images/right.png)center no-repeat;
    background-size: 100%;
    /* opacity: 1; */
    width: 12px;
    /* height: 58px !important; */
    padding: 20px;
    flex: 1;
    border-top: 0px solid transparent !important;
    box-sizing: initial;
    display: block;
    border-bottom: 0px solid transparent !important;
    margin: 0px 0px;
}

.content-img2 img {
    position: absolute;
    right: 0;
    z-index: 9999;
    height: 290px;
    width: 290px;
    top: -210px;
    left: auto;
}

.content-img2 {
    position: relative;
    display: block;
    right: 0;
    left: auto;
    overflow: visible !important;
    top: 0;
    height: 120px;
}

.slider__counter {
    position: absolute;
    bottom: 0;
    left: 5rem;
    z-index: 1;
    font-size: 2.5rem;
    font-weight: 600;
    color: #ce1212;
}

@media screen and (min-width: 1920px) {
    section.hamam .hamam-img .content-img {
        width: 370px;
        height: 370px;
        position: absolute;
        bottom: -40%;
        right: 9%;
    }

    section.hamam .hamam-img .content-img-left {
        width: 370px;
        height: 370px;
        position: absolute;
        bottom: -40%;
        right: 9%;
    }

    .carousel-item.shine {
        height: 100%;
        min-height: 715px;
    }

    .carousel-maquillage button.slick-next.slick-arrow,
    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -40px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 {
        max-width: 725px;
        height: 790px;
        min-height: 740px;
    }

    .carousel-maquillage .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        color: #fff;
        text-align: center;
        padding-top: 14px;
        padding-bottom: 0;
    }

    .carousel-maquillage .carousel-item.shine {
        height: 100%;
        min-height: 735px;
        /* background: white; */
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 400px;
    }



}

/* START  brochure -homme */
section.brochure-homme {
    padding: 50px 30px 50px;
    text-align: center;
    background: #f5f5f5;
    margin-top: 10px;
}

.content-img.brochure img {
    top: 80px;
    position: relative;
    max-width: 70%;
    z-index: 1;
    left: 0;
}

.content-img.brochure {
    position: relative;
}

/* end brochure-homme */
/* START FORFAIT   */
.top-forfait {
    position: relative;
}

section.forfait-homme {
    padding: 50px 30px 50px;
    text-align: center;
    margin-top: 10px;
    position: relative;
}

span.btn-forfait {
    background: #f33f38;
    width: 90px;
    height: 32px;
    position: absolute;
    bottom: 0;
    z-index: 3;
    color: white;
    font-size: 17px;
    line-height: 30px;
    text-transform: uppercase;
}

section.forfait-homme h2 {
    font-size: var(--Brand_title_size_level_five);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 25px;
}

.cont-forfait {
    border: 1px solid #dbdbdb;
    padding: 25px 10px;
    max-width: 532px;
    margin: 0 auto;
    min-height: 300px;
}

.cont-forfait p {
    font-size: var(--Brand_para_size);
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    line-height: 31px;
    margin-bottom: 30px;
}

.content-encart img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    max-width: 532px;
    position: relative;
}




.price-container {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    align-content: stretch;
    justify-content: center;
}

.prixcentred {
    text-align: center;
}

.cont-forfait h4 {
    color: #1a2e35;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    margin-bottom: 20px;
}

/* start section forfait */
/* start section coiffure-hom */

section.coiffure-hom-blogs {
    padding-top: 20px;
    padding-left: 30px;
    padding-right: 30px;
    padding-bottom: 30px;
    position: relative;

}

.content-one-img img {
    width: 100%;
    height: auto;
}

.blog-slider img {
    width: 100%;
    height: auto;
}

.sliders-section {
    padding: 20px 0;
}

.sliders-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.sliders-wrapper.sliders {
    margin-right: 20px;
}

.slider-container {
    flex: 1;
}

.blog-slider {
    width: 100%;
}



.blog-slider img {
    width: 100%;
    height: auto;
}

.shine-partenaire {
    max-width: 150px;
    margin: auto;
}

.image-partenaire {
    width: 100%;
    height: auto;
    max-width: 150px;
}





/* .bloc3-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
} */

section.coiffure-hom .hamam-img {
    position: relative;
}

section.bloc5-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 10px;
    padding-right: 22px;
}

section.bloc5-app .content-img-left img {
    min-width: 100%;
}

/*start bloc-2 page applcation */

section.bloc2-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc2-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc2-app {
    padding: 35px 35px;
    padding: 35px 35px 10px 35px;
    position: relative;
}

section.bloc2-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc2-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-2 page applcation */

/*start bloc-7 page applcation */

section.bloc7-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 10px;
}

section.bloc7-app .content-img-left img {
    min-width: 100%;
}

/*end bloc-7 page applcation */

/*start bloc-4 page applcation */

section.bloc4-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc4-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc4-app {
    padding: 10px 35px 35px 35px;
    position: relative;
}

section.bloc4-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc4-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-4 page applcation */


/*start bloc2-app-btb page applcation */

section.bloc2-app-btb.content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc2-app-btb {
    padding: 50px 35px;
    position: relative;
}

section.bloc2-app-btb {
    padding: 35px 35px;
    padding: 35px 35px 35px 35px;
    position: relative;
}

section.bloc2-app-btb .application-img-btb {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc2-app-btb .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc2-app-btb page applcation */


/*start bloc-6 page applcation */

section.bloc6-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc6-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc6-app {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc6-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc6-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-6 page applcation */

/*start bloc-8 page applcation */

section.bloc8-app .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc8-app {
    padding: 50px 35px;
    position: relative;
}

section.bloc8-app {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc8-app .application-img {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc8-app .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc-8 page applcation */

/*start bloc3-app-btb page applcation */

section.bloc3-app-btb .content-img img {
    width: 100%;
    object-fit: contain;
}

section.bloc3-app-btb {
    padding: 50px 35px;
    position: relative;
}

section.bloc3-app-btb {
    padding: 35px 35px;
    padding: 60px 35px 35px 35px;
    position: relative;
}

section.bloc3-app-btb .application-img-btb {
    position: relative;
    left: 13px;
    top: 43px;
}

section.bloc3-app-btb .content-img {
    text-align: center;
    width: 50%;
    width: 100%;
    object-fit: cover;
    padding-right: 50px;
}

/* end bloc3-app-btb page applcation */



section.bloc5-app .application-img {
    position: relative;
}

section.bloc3-app .img-bloc3-app {
    position: relative;
    padding-top: 18px;
}

section.coiffure-hom:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.coiffure-hom.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.coiffure-hom.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.nouveaux-produit-actualite {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    margin: 20px 0;
    padding-left: 30px;
}

.justify-content-center {
    justify-content: center !important;
}

section.coiffure-hom .content-img {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc2-app .content-img {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc3-app .content-img {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;

}

section.coiffure-hom .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 0px;

}

img.image-partenaire {
    width: auto !important;
    height: auto;
}

section.application-img .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;
}

section.bloc3-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;

}

section.bloc2-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;

}

.content-img-left {
    flex: 0 0 auto;
}



section.coiffure-hom .content-img img {
    min-width: 100%;
    /* height: 100%; */
    /* object-fit: cover;
    min-height: 365px; */
}

section.application-img .content-img-left img {
    min-width: 100%;
}

section.application-img .content-img img {
    min-width: 100%;
}

section.bloc2-app .img-bloc2-app {
    position: relative;
    left: 13px;
    top: 43px;
}

section.coiffure-hom .content-img-left img {
    min-width: 100%;
    /* height: 100%; */
    /* object-fit: cover;
    min-height: 365px; */
}

section.bloc2-app .content-img img {
    min-width: 100%;
    height: 100%;
}

/* section.bloc4-app .content-img img {
    min-width: 100%;
    height: 100%;
} */

.img-bloc1-application-mahassen img {
    max-width: 100%;
}


section.img-bloc2-app .content-img-left img {
    min-width: 100% !important;
    height: 100% !important;
}

section.bloc2-app .content-img img {
    width: 100%;
    object-fit: contain;
}




.content-img-left img {
    max-width: 100%;
    height: auto;
}

.content-img-left img {
    width: 60px;
    object-fit: cover;
    margin-right: 10px;
}

/* end section coiffure-hom */
/* start section product cosmetique maquillage */

section.product-cosmetique.maquillage {
    padding: 50px 0 40px;
    background: white;
}



button.decouvrir {
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    padding: 8px 11px;
    background: var(--white-color);
    margin-top: 14px;
    transition: opacity 2s;
    text-transform: uppercase;
}

section.product-cosmetique.maquillage.maquillage2 {
    padding: 50px 0 20px;
    padding-bottom: 20px;
    background: white;
}

section.product-cosmetique.maquillage h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 20px;
    margin-top: 20px
}


/* end section product cosmetique maquillage */
/* start product-cosmetique homme */
section.product-cosmetique.recomd {
    padding: 50px 20px 20px;
    margin-bottom: 40px;
}

section.product-cosmetique.recomd .item .product-item {
    height: 100%;
    position: relative;
}

section.product-cosmetique.recomd .slick-initialized .slick-slide {
    /* padding: 0 20px; */
}

/* END  product-cosmetique homme */
/* start product-cosmetique BRUSHING*/
section.product-cosmetique.brushing {
    padding: 50px 0 50px;
}

.price-container {
    display: flex;
    gap: 10px;
    align-items: center;
}

.initial-price {
    color: #838383;
    font-size: 14px;
    text-decoration: line-through;
}

.promo-price {
    color: #000;
    font-size: 16px;
    font-weight: bold;
}


section.product-cosmetique.brushing .item .product-item {
    height: 100%;
    position: relative;
    margin: 0 20px;
}

section.product-cosmetique.brushing button.btn-ajouter-brush.shine {
    outline: none;
    border: none;
    background: black;
    color: white;
    font-size: var(--Brand_para_size);
    font-family: "Century-Gothic-Std", "Century Gothic";

    font-weight: 300;
    text-transform: uppercase;
    padding: 6px 0;
    transition: all 2s;
    margin: 0 auto;
    width: 168px;
    font-size: 14px;
    display: flex;
    justify-content: center;
}

section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart {
    position: absolute;
    top: 20px;
    right: auto;
    bottom: inherit;
    left: 15px;
    padding: 16px;
    color: #000;
    background: white;
    font-size: 18px;
    display: none;
}

/* section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart{position: absolute;
top: 2px;
left: 21px !important;
padding-right:11px;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 25px;
font-size: 13px;
box-shadow: 4px 6px 15px -4px rgba(0, 0, 0, 0.1);
box-shadow: 0px 3px 15px -4px rgba(0, 0, 0, 0.1);
font-family: var(--Brand_title_fonts);
text-align: center;
flex-direction: column} */

section.product-cosmetique.brushing .item .product-item .fa-regular.fa-heart.active {
    color: red;
    display: block;
}

section.product-cosmetique.brushing .item .product-item:hover .fa-regular.fa-heart {
    display: block;
}

/* END product-cosmetique BRUSHING*/
/* start product-cosmetique */
section.product-cosmetique {
    padding: 0 0 20px;
}

section.product-cosmetique .item {
    padding: 0;
    display: table;
    margin: 0 auto;
}

section.product-cosmetique .item .product-item {
    /* height: 400px; */
    position: relative;
}

section.product-cosmetique .item .product-item img {
    height: 100%;
    background-size: cover;
    width: 100%;
}

section.product-cosmetique .item .product-item .item-icons {
    position: absolute;
    bottom: 50px;
    right: 0;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    /* display: none; */
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}

section.product-cosmetique .item .product-item .item-icons-left {
    position: absolute;
    bottom: 294px;
    top: 20px;
    right: 0;
    left: 11%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}



section.product-cosmetique .item .product-item .item-icons-left-nouveaute {
    position: absolute;
    bottom: 294px;
    top: 20px;
    right: 0;
    left: 10%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
    animation: viewicons 0.2s linear;
    width: 100%;
    text-align: center;
}


@keyframes viewicons {
    0% {
        bottom: 0;
    }

    50% {
        bottom: 20px;
    }

    100% {
        bottom: 50px;
    }
}

section.abonnez-vous .container-fluid .abonnez-vous-slider .item .shine .item-icons {
    display: block;
}

section.abonnez-vous .container-fluid .abonnez-vous-slider .item .shine .item-icons i {
    padding: 20px 25px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 22px;
    transition: all 2s;
}


section.product-cosmetique .item:hover .item-icons {
    display: block;
}

section.product-cosmetique .item:hover .item-icons-left {
    display: block;
}

section.product-cosmetique .item .product-item .item-icons-left-nouveaute i {
    padding: 8px 8px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons i {
    padding: 10px 12px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
}

section.product-cosmetique .item .product-item .item-icons-left i {
    padding: 10px 12px;
    background: var(--white-color);
    color: var(--Heading_color);
    font-size: 15px;
    transition: all 2s;
    margin-left: 10px;
}

section.product-cosmetique .item .product-item .item-icons i:hover {
    color: #acacac;
}

section.product-cosmetique .item .product-item .item-icons-left i:hover {
    color: #acacac;
}

section.product-cosmetique .slick-slider {
    margin: 0 13px;
}

section.product-cosmetique .item .item-desc {
    padding: 18px 32px 17px;
    text-align: center;
}

section.product-cosmetique .item a {
    text-decoration: none;
    color: var(--Heading_color);
}

section.product-cosmetique .item .item-desc h4 {
    font-size: 17px;
}

section.product-cosmetique .item .item-desc p {
    font-size: 17px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: var(--Heading_color);
    margin-bottom: 10px;
}

section.product-cosmetique .item .item-desc h5 {
    font-size: 16px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    margin-bottom: 5px;
}

.cont-descriptionn h2 {
    font-size: 27px;
}


section.product-cosmetique.dernier-article-vus button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: -40px;
    right: 35px;
    width: 50px;
    height: 107px;
    left: inherit;
}

p.description-product-b2b {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 18px !important;
    transition: color 0.3s ease;
    color: black;
}

section.tendance.b2b {
    padding: 50px 20px 20px;
    margin-bottom: 40px;
}

ul.slick-dots {
    display: none !important;
}

.description-product-b2b:hover {
    color: gray;
}


section.idees.soin button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: -40px;
    right: 35px;
    width: 50px;
    height: 50px;
    left: inherit;
}

section.idees button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: -40px;
    right: 35px;
    width: 50px;
    height: 50px;
    left: inherit;
}

section.bloc2-app-btb .content-img img {
    min-width: 100% !important;

}

section.bloc3-app-btb .content-img-left img {
    min-width: 100% !important;

}

/* end product-cosmetique */
/* start section Note  */
section.note {
    padding: 10px 0 0;
    margin: 0 auto;
}


.contentnote {
    max-width: 1140px;
    margin: 0 auto;
    padding: 70px 0px 50px;
}

.contentnote img {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -45px;
    max-width: 85px;
}

.contentnote {
    position: relative;
}

.note_img {
    margin: 0 auto;
    background: #c8c7c7;
    width: 95%;
}

.img-taller {
    /* i should return the to 400px */
    /* height: 400px; */
    height: auto;
    width: auto;
    object-fit: cover;
}

.bloc {
    margin-bottom: 50px;
}

.img-shorter {
    /* height: 250px; */
    width: auto;
    object-fit: cover;
}


section.note h2 {
    font-size: 27px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    margin-bottom: 49px;
    padding-top: 25px;
    text-align: center;
}

section.note p {
    text-align: center;
    font-size: 14px;
    line-height: 35px;
}

/* END section Note  */
section.creation-coupe .content-img img {
    height: 100%;
    min-height: 100%;
    object-fit: cover;
    min-height: 100%;

}

section.creation-coupe .content-img-guide img {
    position: relative;
    top: inherit;
    max-width: 100%;
    bottom: -60px;
    right: 0;
    display: block;
}

section.creation-coupe .content-img-guide {
    position: relative;
    top: -33px;
}

/* section.creation-coupe .cont-description {
    margin-top: 50px;
} */

section.creation-coupe {
    padding: 10px 20px 10px;
    position: relative;

}

section.creation-coupe .creation-img {
    background: url(../images/coupe-top.jpg) left no-repeat;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    bottom: 10px;
    left: 45%;
    max-width: 870px;
    min-height: 430px;
}

section.creation-coupe .creation-img .content-img {
    width: 310px;
    height: 290px;
    position: absolute;
    bottom: -90px;
    right: 10%;
}

section.creation-coupe .creation-img .content-img img {
    width: 100%;
    height: 100%;
}

.content-encart a.decouvrir {
    font-size: 17px;
    text-decoration: none;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    padding: 15px 15px 15px 0;
    letter-spacing: 0.02rem;
    background: transparent !important;
    background-position: center;
    animation: change 3s linear infinite;
    position: relative;
    font-family: var(--Brand_title_fonts);
    background: transparent !important;
}

.shop_number {
    background: red;
    color: #fff;
    border-radius: 50%;
    width: 13px;
    height: 13px;
    font-size: 9px;
    text-align: center;
    line-height: 14px;
    position: absolute;
    bottom: 9px;
    right: -5px;
}

.fav_number {
    position: absolute;
    top: 2px;
    right: -6px;
    width: 12px;
    height: 12px;
    background: red;
    color: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    font-size: 8px;
    line-height: 18px;
}

.menu_scrol.sticky .fav_number {
    top: 2px;
}

.shop {
    position: relative;
}

.shop_cart {
    position: absolute;
    background: var(--white-color);
    width: 267px;
    border-radius: 2px;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.13);
    text-align: left;
    z-index: 1;
    right: 0;
    padding: 13px;
    display: none;
    top: 41px;
    right: 0;
    z-index: 9999;
}

/* .sticky .shop:hover + .shop_cart {
    top: 60px !important;

}

.shop:hover + .shop_cart {
    top: 99px !important;
    opacity: 1;
    display: block;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
} */

.Cart-Container {
    background-color: #ffffff;
}

.Header {
    display: flex;
    justify-content: space-between;
    align-items: self-start;
}

.Heading {
    font-size: 16px;
    font-weight: 700;
    color: #2F3841;
    margin-bottom: 12px;
}

.ActionRemoveAll {
    font-size: 14px;
    font-weight: 600;
    color: #E44C4C;
    cursor: pointer;
    border-bottom: 1px solid #E44C4C;
}

.Cart-Items {
    margin-top: 8px;
    display: grid;
    grid-column-gap: 13px;
    padding-bottom: 8px;
    grid-template-columns: 50px auto auto;
}

.image-box img {
    max-width: 100%;
}

.image-box {
    margin-right: 8px;
    width: 100%;
}

.title {
    padding-top: 0;
    font-size: 13px;
    font-weight: 600;
    color: #202020;
    margin-bottom: 4px;
}

.counter {
    font-size: 15px;
}

.subtitle {

    font-size: 18px;
    font-family: ‘Open Sans’;
    font-weight: 600;
    color: #909090;
}

hr {
    width: 90%;
    float: right;
    margin-right: 5%;
}

.total {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

.Subtotal {
    font-size: 16px;
    font-weight: 700;
    color: #202020;
}

.cart-items {
    font-size: 14px;
    font-weight: 500;
    color: #909090;
}

.total-amount {
    font-size: 17px;
    font-weight: 900;
    color: #202020;
}

.Checkout-button {
    margin-top: 5px;
    width: 75%;
    height: 39px;
    border: none;
    background: black;
    /* border-radius: 20px; */
    cursor: pointer;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    display: table;
    margin: 17px auto 0;
}

.Checkout_delete {
    color: red;
    margin-left: 2px;
}

.counter span {
    margin-right: 2px;
    margin-left: 2px;
}

.counter {
    font-size: 14px;
    font-weight: 600;
    color: #202020;
}

h1.titre-cart {
    font-size: 32px;
    margin-bottom: 50px;
}

h3.titre-2-cart {
    font-size: 25px;
    padding-top: 21px;
}

.btn-2-cart {
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 0;
}

.btn-1-cart {
    padding: 8px 20px;
    font-size: 15px;
    line-height: 19px;
}

.btn-1-cart {
    padding: 8px 20px;
    font-size: 15px;
    line-height: 19px;
}

.img-product-carte {
    max-width: 100px;
}

a.title-product-carte {
    color: #000000;
    text-decoration: none;
    font-size: 17px;
    display: table-cell;
    /* height: 38px; */
    vertical-align: bottom;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

a.close-carte {
    color: #a7a7a7;
    vertical-align: middle;
    height: 39px;
    padding: 5px 10px;
    font-size: 16px;
}

.button-space {
    margin-right: 10px;
}

td {
    padding: 29px 20px !important;
}

td:first-child {
    padding: 29px 0 !important;
}


th.product-name {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-price {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-quantity {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-subtotal {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

th.product-remove {
    font-weight: 400;
    color: #000000;
    padding-bottom: 13px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}




.price-product-carte {
    display: table-cell;
    vertical-align: middle;
    /* height: 50px; */
    font-size: 17px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.btn-carte {
    justify-content: space-between;
}

th {
    font-family: "Century-Gothic-Std", "Century Gothic";
}

input#subscribeSrEmailExample1 {
    /* border-top-left-radius: 20px;
    border-bottom-left-radius: 20px; */
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding: 5px 20px;
}

button#subscribeButtonExample2 {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    border-radius: 0;
    /* border-top-right-radius: 20px;
    border-bottom-right-radius: 20px; */
}

button#subscribeButtoncheckout {
    /* border-radius: 20px; */
}

.total-product-carte {
    display: table-cell;
    vertical-align: middle;
    font-size: 17px;
    height: 50px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.quant-td {
    width: 17%;
}

td.cart_td {
    padding: 29px 30px 28px 0px !important;
}

.th-Subtotal {
    padding: 30px 30px 30px 30px !important;
}

.rounded-lg {
    border-radius: 0.4375rem !important;
}

.bg-gray-1 {
    background-color: #f5f5f5 !important;
}


/* ===============================================
start page nos magasins
=============================================== */
.search-magasin h2 {
    font-size: 20px !important;
    padding-bottom: 0 !important;
    line-height: 15px !important;
    margin-top: 25px;
    margin-left: 0;
    font-family: "grafik";
    font-weight: 700 !important;
}

.form-group {
    margin-bottom: 1rem;
}

select.form-control:not([size]):not([multiple]) {
    /* height: calc(1.25rem + 2px); */
}

.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    color: var(--bs-body-color) !important;
    line-height: 25px;
    padding-bottom: 3px;
    /* margin-bottom: 15px; */
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 20px;
}

.informations {
    background: #f3f3f3;
    padding: 15px 30px;
    font-family: "grafik";
}

/* ===============================================
END  page nos magasins


/* ----------------------- START form nos magasins ---------*/
/* ----------------------- -------------------------*/
@-webkit-keyframes slide-in-blurred-left {
    0% {
        -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        -webkit-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0) scaleY(1) scaleX(1);
        transform: translateX(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

@keyframes slide-in-blurred-left {
    0% {
        -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
        -webkit-transform-origin: 100% 50%;
        transform-origin: 100% 50%;
        -webkit-filter: blur(40px);
        filter: blur(40px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0) scaleY(1) scaleX(1);
        transform: translateX(0) scaleY(1) scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-filter: blur(0);
        filter: blur(0);
        opacity: 1;
    }
}

.custom-checkbox-grey [type=checkbox]:checked~label,
.custom-checkbox-grey [type=checkbox]:checked~span+label,
.custom-checkbox-grey [type=checkbox]:not(:checked)~label,
.custom-checkbox-grey [type=checkbox]:not(:checked)~span+label,
.custom-checkbox-white [type=checkbox]:checked~label,
.custom-checkbox-white [type=checkbox]:checked~span+label,
.custom-checkbox-white [type=checkbox]:not(:checked)~label,
.custom-checkbox-white [type=checkbox]:not(:checked)~span+label {
    font-weight: 400;
    font-style: normal;
    color: #4b4b4b;
    cursor: pointer;
    letter-spacing: .4px;
    font-variant-ligatures: none;
    padding-left: 26px;
    position: relative;
    display: inline-block;
    line-height: 20px;
}

#store-locator .department-filters .options label {
    display: inline-block;
    line-height: 17px;
}

#store-locator .department-filters .options {
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    font-size: 12px;
    display: none;
    border-top: 1px solid #e7e7e7;
}

#store-locator fieldset.search-simple {
    background: #e7e7e7;
    width: 100%;
    padding: 25px 25px;
}

#store-locator label.label {
    font-weight: 600;
    font-style: normal;
    color: #3a3a3a;
    font-size: 13px;
    letter-spacing: 2px;
    font-variant-ligatures: none;

}

#store-locator .department-filters .options>li {
    width: 50%;
}

#store-locator .department-filters .options>li:nth-child(odd) {
    float: left;
    clear: left;
}

#store-locator .icon-toggle:after,
#store-locator .icon-toggle:after {
    font-size: 5px;
    color: #999;
    display: inline-block;
    margin-left: 4px;
    position: relative;
    top: -2px;
    content: "\f10b";
}

.filter-check {
    height: 16px;
    position: absolute;
    opacity: 0;
    pointer-events: none;
    right: 20px;
    top: 16px;
    width: 16px;
    z-index: 10;
}

#store-locator .department-filters .toggle {
    cursor: pointer;
    display: inline-block;
    color: #999;
    background-color: transparent;
    border: 0;

    font-size: 14px;
}

#store-locator .department-filters .close,
#store-locator .department-filters .reset,
#store-locator .department-filters .toggle {
    padding: 20px 15px;
    font-weight: 400;
    font-style: normal;
}

#store-locator .department-filters .close,
#store-locator .department-filters .reset {
    cursor: pointer;
    display: none;
    color: #1b1b1b;
}

.icon-toggle:after,
.icon-toggle:after {
    font-size: 5px;
    color: #999;
    display: inline-block;
    margin-left: 4px;
    position: relative;
    top: -2px;
}

#store-locator .department-filters .active-filters {
    display: none;
}

#store-locator .department-filters.active .options {
    display: block;
}

#store-locator .department-filters .options {
    background: #fff;
    position: absolute;
    left: 0;
    right: 0;
    font-size: 12px;
    display: none;
    border-top: 1px solid #e7e7e7;
}

#store-locator .department-filters .options {
    background: #fff;
    /* position: relative; */
    left: 0;
    right: 0;
    font-size: 12px;
    /* display: block; */
    border-top: 1px solid #e7e7e7;
}

#store-locator .department-filters .options li {
    display: block;
    padding: 10px 2px;
    border-bottom: 1px solid #e7e7e7;
    min-height: 50px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    align-items: center;
}

.filter-check {
    height: 16px;
    position: absolute;
    opacity: 0;
    pointer-events: none;
    right: 20px;
    top: 16px;
    width: 16px;
    z-index: 10;
}

.custom-checkbox-grey [type=checkbox]:checked,
.custom-checkbox-grey [type=checkbox]:not(:checked),
.custom-checkbox-white [type=checkbox]:checked,
.custom-checkbox-white [type=checkbox]:not(:checked) {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    pointer-events: none;
}

.custom-checkbox-grey [type=checkbox]:checked~label:before,
.custom-checkbox-grey [type=checkbox]:checked~span~label:before,
.custom-checkbox-grey [type=checkbox]:not(:checked)~label:before,
.custom-checkbox-grey [type=checkbox]:not(:checked)~span~label:before,
.custom-checkbox-white [type=checkbox]:checked~label:before,
.custom-checkbox-white [type=checkbox]:checked~span~label:before,
.custom-checkbox-white [type=checkbox]:not(:checked)~label:before,
.custom-checkbox-white [type=checkbox]:not(:checked)~span~label:before {
    content: "";
    display: block;
    position: absolute;
    background: #f5f5f5;
    height: 16px;
    left: 1px;
    top: 2px;
    width: 16px;
}

h4.content-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--primary-title);
    text-transform: capitalize;
    text-align: left;
    margin-bottom: 12px;
}


p.pera.line-clamp-2 {
    font-size: 14px;
    font-weight: 500;
    color: var(--tertiary-title);
    text-transform: capitalize;
    text-align: left;
}

span.stock-status {
    color: red;
}

fieldset.search-filters-department {
    padding-left: 25px;
}

a.btn.btn-top.btn-border.connexion-card:hover {
    border-color: black;
}

fieldset.search-filters-department span.icon-toggle i {
    font-size: 8px;
}

/* STORE  location nos magasins */
.search-results {
    background: #e7e7e7;
    padding: 25px 25px;
}

.search-results li.store-item {
    background: #f4f4f4;
    padding: 20px;
    margin: 15px 0px;
}

.search-results .store-infos {
    margin-top: -10px;
}

.scroll {
    overflow-x: hidden;
    overflow-y: auto;
    height: 100vh;
    scroll-behavior: auto;
}

ol#stores {
    list-style-type: none;
    padding: 20px;
    margin-bottom: 0;
}

store-item-bg {
    background: #f5f5f5;
    padding: 30px 20px 20px;
}

.store-item .store-item-content,
.store-item .store-item-content {
    padding: 0 0 30px 60px;
    position: relative;
}

.store-item .store-item-content .store-infos .name a,
.store-item .store-item-content .store-infos .name a {
    color: #3a3a3a;
    font-weight: bold;
    font-style: normal;
    font-size: 13px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-item-content .store-position,
.store-item .store-item-content .store-position {
    width: 50px;
    float: left;
    margin: 0 10px 0 0;
    text-align: center;
    position: absolute;
    top: 0;
    left: 0;
}

.store-item p.address {
    color: #565656;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-item-content .store-infos .email a,
.store-item .store-item-content .store-infos .phone a,
.store-item .store-item-content .store-infos .email a,
.store-item .store-item-content .store-infos .phone a {
    margin: 5px 0 0;
    color: #565656;
    font-weight: 400;
    font-style: normal;
    font-size: 12px;
    margin: 0 0 5px;
    text-transform: none;
    text-decoration: none;
}

.store-item .store-details-toggle,
.store-item .store-details-toggle a {
    border-top: 1px solid #dbd8d6;
    font-style: normal;
    color: #999;
    line-height: 18px;
    font-size: 12px;
    position: relative;
    padding-top: 15px;
    text-decoration: none;
    display: flex;
    justify-content: space-between;

}

.t-hasfindinstore .icon-plus:before,
.t-solrstorefinder .icon-plus:before,
.t-storedetail .icon-plus:before {
    content: '';
    width: 2px;
    height: 10px;
    background-color: #999;
    position: absolute;
    top: 0;
    left: 4px;
}

.t-hasfindinstore .icon-plus:after,
.t-solrstorefinder .icon-plus:after,
.t-storedetail .icon-plus:after {
    content: '';
    width: 10px;
    height: 2px;
    background-color: #999;
    position: absolute;
    left: 0;
    top: 4px;
}

.store-item .store-details,
.store-item .store-details {
    display: none;
}

.store-item .store-item-content:after,
.store-item .store-item-content:before,
.store-item .store-item-content:after,
.store-item .store-item-content:before {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden;
}

/* ----------------------- ENDDD form nos magasins ---------*/

iframe.myMap {
    height: 100%;
    min-height: 102vh;
}

.map {
    position: relative;
    height: 100%;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance: textfield;
}

a.new_compte {
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 27px 0 0;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
}

a.new_compte:hover {
    border-color: #000;
}

button.connexion {
    text-align: left;
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 44px 0 0;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

button.register {
    text-align: left;
    border-radius: 6px;
    width: 100%;
    background: black;
    color: white;
    margin: 2px 0px 20px 0px;
    display: table;
    text-align: center;
    font-size: 16px;
    padding: 8px 0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

button.swal2-confirm.swal2-styled {
    background-color: #000 !important;
}

button.swal2-confirm.swal2-styled:hover {
    background-color: #000 !important;
}

button.register:hover {
    border-color: #000;
}

button.connexion:hover {
    border-color: #000;
}

.checkout a {
    text-decoration: none;
}

input.checkout_radio {
    float: left;
    width: 25px;
    height: 25px;
    outline: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    margin-right: 10px;
    position: relative;
    border: 2px solid #e6e6e6;
    transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

input.checkout_radio:checked {
    border-color: #ce0b2b;
    background-color: #ce0b2b;
}

input.checkout_radio:checked:before {
    opacity: 1;
}

input.checkout_radio:before {
    top: 50%;
    left: 50%;
    opacity: 0;
    color: #ffffff;
    font-size: 14px;
    /* content: ""; */
    font-weight: 400;
    position: absolute;
    transition: 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transform: translate(-50%, -50%);
    font-family: "Font Awesome 5 Pro";
}

label.checkout_radio {
    display: contents !important;
}

button.btn.btn-primary-dark-w.btn-block.btn-pill.font-size-20.mb-3 {
    background: black;
    color: #ffffff;
}

/*************************************************************************************/
/* carrousel logo nos marques */
/* .logo-item {
    background: url(../images/bg-gucci.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-item.dior {
    background: url(../images/bg-dior.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-item.chanel {
    background: url(../images/bg-chanel.jpg) 50% 50% no-repeat;
    margin: 0 auto;
    max-width: 278px;
    height: 245px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-size: cover;
}
.logo-desc {
    background: #d5b665;
    color: white;
    max-width: 196px;
    text-align: center;
    height: 38px;
    align-items: center;
    padding: 6px 0px;
    margin: 0 auto;
    margin-top: -20px;
    z-index: 5;
    position: relative;
    font-size: 17px;
}
.content-img img {
    width: 100%;
}
.header-marketing-brushing img {
    min-height: 250px;
}
section.content-tabs-brushing .tabsmahassen {font-size: 20px;}
section.creation-coupe .creation-img img {
    width: 100%;
    height: auto;
    position: relative;
    bottom: -70px;
    right: 0;
}
section.collection .desc_collection a.decouvrir:hover,
section.autonome .content-autonome-desc a.decouvrir:hover,
section.maquillage .content-autonome-desc a.decouvrir:hover,
section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir:hover,
section.avis-clients a.decouvrir:hover,
section.mahassen-lives .mahassen-live-desc a.decouvrir:hover,
.cont-description a.decouvrir:hover {
    background: url(../images/bg-pink.jpg) 50% 50% no-repeat !important;
    background-size: 145px !important;
    transition: 1s all ease-out;
} */

/* Nos collabs */
/* @media screen and (min-width: 1600px)  {
    section.nos-collab {
        padding: 85px 20px 110px 18rem;
        }
    section.hamam .hamam-img .content-img {
        width: 360px;
        height: 360px;
        position: absolute;
        bottom: -15%;
        right: -80px;
    }
    .contentSlider {
        display: flex;
        width: 100%;
        justify-content: space-between;
    }
    section.collection.mah-nouveaute .content-img {
        padding-right: 210px;
        height: 742px;
        width: 100%;
    }
    .sliderTop .slick-prev {

        top: 48%;
        right: -55px;
    }
    .content-img {}

    .content-text2 {}
    .carousel-maquillage button.slick-next.slick-arrow { bottom: -20px;}
    .carousel-maquillage button.slick-prev.slick-arrow { bottom: -20px;}

}

section.nos-collab {
    padding: 85px 20px 47px 140px;
    background: url(../images/bg-collab.jpg)left no-repeat;
    background-size: cover;
    color: white;
    text-align: center;
}
section.nos-collab h2 {
    font-size: var(--Brand_title_size_level_five);
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: #fff;
    margin-bottom: 25px;
    letter-spacing: 0.02rem;
    text-align: center;
}
.collab-item img {
    object-fit: cover;
    max-width: 100%;
    height: 313px;
}
.bonplantarifs-item img {
    object-fit: cover;
    max-width: 100%;
    height: 472px;
    left: 0;
    right: auto;
} */

/* section page bon PLAN */
section.bonplan {
    padding: 50px 35px;
    position: relative;
    margin-right: 30px;
    margin-left: 20px;
    height: 550px;
}

section.bonplan .fidelite span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: 0;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

section.bonplan .fidelite-bon-plan span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: -154px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

.bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
    writing-mode: vertical-rl;
    font-size: 60px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: rgb(124 124 124 / 29%);
    margin-top: -154px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}


section.bonplan .content-img {
    width: 82%;
    float: left;
}

section.bonplan .contents-img {
    width: 78%;
    float: left;
}

section.bonPlan-img .content-bonplan h2.title-droite {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: rgb(0, 0, 0);
}


section.bonPlan-img .content-bonplan h2 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: white;
}

section.bonPlan-img .content-bonplan img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

section.bonPlan-img {
    padding: 50px 35px 50px;
}

section.bonplan .fidelite {
    width: 20%;
    float: right;
}

.bonplantarifs-item img {
    object-fit: cover;
    max-width: 100%;
    height: 272px;
    left: 0;
    right: auto;
    object-position: left;
}

section.bonPlan-img .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

section.bonplan .fidelite span {
    font-size: 30px;
}

/* section.bonplan .content-img img {
    width: 100%;
    min-height: 401px;
    min-width: 447px;
    object-fit: cover;
} */

section.bonplan .contents-img img {
    width: 100%;
    min-height: 470px;
    object-fit: cover;
}


section.bonPlan-img-section-bottom {
    padding: 10px 35px 10px 50px;
}

.bonPlan-img-section-bottom.centre .remise-bonplan {
    left: 45px;
}

.remise-bonplan {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgba(224, 43, 43, 0.8);
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 50%;
    font-weight: bold;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
}

.remise {
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: rgb(99 89 89 / 21%);
    color: #ffffff;
    padding: 10px 15px;
    border-radius: 50%;
    font-weight: bold;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
}

section.bonPlan-img {
    padding: 10px 35px 0px 50px;
}

.custom-row-spacing {
    margin-left: -5px;
    margin-right: -5px;
}

.description-categorie3 {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

.description-note-categorie3 {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 29px;
}

.custom-gap-reduction {
    gap: 5px;
}

.fidelite-one-acceuil {
    margin-top: -250px;
    margin-left: -8rem !important;
}

.fidelite-two-acceuil {
    margin-top: -10px;
    margin-left: -2rem !important;
    /* top: 50px; */
}

.fidelite-two-acceuil {
    font-size: 1.5rem;
    margin-left: 20px;
    display: flex;
    align-items: center;
    /* top: 50px; */
}


.custom-row-spacing>[class*='col-'] {
    padding-left: 5px;
    padding-right: 5px;
}


section.bonPlan-img-section-bottom .content-bonplan h2 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 22px;
    color: rgb(243, 243, 243);
}

section.bonplan .fidelite {
    width: 20%;
    float: right;
}

@media screen and (min-width: 320px) {


    .collab-item img {
        max-width: 100%;
        /* Ensure images do not exceed their container */
        display: block;
        padding-left: 50px;
        padding-right: 50px;
    }

    .content-bonplan {
        position: absolute;
        top: 10px;
        padding: 20px 20px;
        z-index: 3;
        display: block;
        width: 100%;
        max-width: 600px;
    }

    .nos-collab {
        text-align: center;
        /* Center align text within the section */
    }

    .collab-slider {
        display: flex;
        justify-content: center;
        /* Center the slider within the container */
    }

    .bonplantarifs-item img {
        object-fit: cover;
        max-width: 100%;
        height: 272px;
        left: 0;
        right: auto;
        object-position: left;
    }

    section.bonPlan-img .remise {
        position: absolute;
        top: 23px;
        right: 27px;
        overflow: hidden;
        height: 50px;
        width: 50px;
        line-height: 19px;
        padding: 15px 4px;
        text-align: center;
        background: red;
        border-radius: 50%;
        color: white;
    }

    section.bonplan .fidelite span {
        font-size: 62px;
    }


    section.bonplan .fidelite-bon-plan span {
        font-size: 62px;
    }


    /* section.bonplan .content-img img {
        width: 100%;
        min-height: 401px;
        object-fit: cover;
    } */

    section.bonplan .contents-img img {
        width: 100%;
        min-height: 470px;
        object-fit: cover;
    }
}

section.bonPlan-img button.slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    right: 35px;
    width: 50px;
    height: 50px;
    left: inherit;
    bottom: inherit;
    z-index: 2;
}

section.bonPlan-img button.slick-prev.slick-arrow {
    position: absolute;
    top: inherit;
    right: 95px;
    width: 50px;
    height: 50px;
    left: inherit;
    bottom: -50px;
    z-index: 2;
}

section.bonPlan-img .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    font-weight: 300;
    background: url(../images/btnleft.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}

section.bonPlan-img .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    bottom: 0;
    font-weight: 300;
    background: url(../images/btnright.png)center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
}


/**************END BONPLAN****************/

/********Catalogue****************/


section.catalogBloc {
    padding: 20px 0;
    position: relative;
    text-align: center;
}



section.catalogBloc:after {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: -1;
}

section.catalogBloc.coiffure:after {
    position: absolute;
    content: "";
    width: inherit;
    height: inherit;
    background-color: inherit;
    top: inherit;
    left: inherit;
    bottom: inherit;
    z-index: inherit;
}

section.catalogBloc.coiffure::before {
    position: absolute;
    content: "";
    width: 25%;
    height: 100%;
    background-color: #f5f5f5;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.cont-descriptionn {
    width: 100%;
    margin-top: 40px;
    text-align: center;
}

section.product-cosmetique .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

.item .remise {
    /* position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white; */
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 30px;
    border: 2px solid #e10202;
    background-color: #e10202;
    border-radius: 4px;
    margin: 15px;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 16px;
}

section.autonome .remise {
    position: absolute;
    top: 23px;
    right: 27px;
    overflow: hidden;
    height: 50px;
    width: 50px;
    line-height: 19px;
    padding: 15px 4px;
    text-align: center;
    background: red;
    border-radius: 50%;
    color: white;
}

/********popup search****************/
section.inscrivez-vous.recherche {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #4c4c4ce3;
    z-index: 55;
    display: none;
    padding-top: 47px;
}


.search-container {
    margin-top: 100px;
}

.recherche .content-inscrivez-vous {
    display: block;
    border-color: #eee;
    background-color: #eeeeee69;
    color: #495057;
    position: relative;
    max-width: 930px;
}

.card-forgot-password {
    margin-left: 50px;
    margin-right: 50px;
    margin-top: 100px;
}


section.inscrivez-vous.recherche .inscrivez-vous-description {
    padding: 45px 50px 45px 65px;
}

section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
    position: absolute;
    top: 100px;
    right: 100px;
    padding: 10px;
    background: white;
    color: #0e0e0e;
    transition: opacity 2s;
    cursor: pointer;
    z-index: 1;
}

section.inscrivez-vous.recherche .form-control {
    display: block;
    display: block;
    width: 600px;
    min-height: calc(1.5em + .75rem + 2px);
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    height: 50px;
    background-color: #eeeeee69 !important;
    color: #495057;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}




section.inscrivez-vous.recherche .form-control:focus {
    color: #495057;
    border: 1px solid #ced4da;
    background-color: #eeeeee69;
    box-shadow: none;
    border-color: #eee;
    outline: 0;
    box-shadow: none;
    border-bottom: 1px solid #fff;
}

section.inscrivez-vous.recherche input#article_name::placeholder {
    color: #495057;
    text-transform: none;
    font-size: 18px;
}

section.inscrivez-vous.recherche .form-group {
    margin-bottom: 1rem;
    display: flex;
    justify-content: end;
}

section.inscrivez-vous.recherche .has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 22px;
    height: 12px;
    line-height: 59px;
    text-align: right;
    pointer-events: none;
    color: #495057;
    font-size: 21px;
}

section.inscrivez-vous.recherche div#article_list h3 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#historique h5 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#cat_list h3 {
    font-size: 17px;
    padding-bottom: 10px;
    margin: 0;
    color: red;
}

section.inscrivez-vous.recherche div#article_list {
    margin-bottom: 8px;
    /* border-bottom: 1px solid #d9d9d9; */
    padding-bottom: 13px;
    margin-right: 26px;
}

section.inscrivez-vous.recherche div#cat_list {
    margin-bottom: 8px;
    /* border-bottom: 1px solid #d9d9d9; */
    padding-bottom: 13px;
    margin-right: 26px;
    padding-right: 58px;
}


section.inscrivez-vous.recherche li.list-group-item a {
    color: var(--bs-list-group-color);
}

/* section.inscrivez-vous.recherche .results {
    background: #fff;
    padding: 0px 20px 30px 28px;
} */
.header-marketing-desc .results {
    background: #fff;
    padding: 30px 20px 30px 28px;
}

/* section.inscrivez-vous.recherche .result-search {
    height: 148px;
    overflow-x: scroll;
} */

.list {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: flex-start;
    align-content: space-around;
    flex-direction: row-reverse;
    flex-wrap: wrap;
    justify-content: flex-end;
}

h2.main-title {
    color: red;
    padding-bottom: 20px;
}

.result-search::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.result-search::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.result-search::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

section.inscrivez-vous.recherche .list-group-item {
    position: relative;
    /* display: block; */
    padding: 0 0 20 10px;
    color: var(--bs-list-group-color);
    text-decoration: none;
    background-color: transparent;
    border: none;
}

.list-group-item {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
}

section.inscrivez-vous.recherche li.list-group-item a:hover {
    color: #969696;
    transition: 1s all ease-in;
}

.list {
    padding-top: 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
}

.login-container {
    display: none;
    /* Other styles */
}

/********popup search****************/

/********popup avis****************/

.avis .content-inscrivez-vous {
    display: block;
    /* grid-template-columns: 70% 30%; */
    background: white;
    position: relative;
    gap: 1px;
    width: 600px;
}

.avis .inscrivez-vous-description {
    padding: 43px 31px 35px 35px;
}

.avis textarea#avisdesc {
    width: 333px;
    border: 1px solid #d9d9d9;
    padding: 2px 24px 2px;
    line-height: 24px;
}

.avis textarea#avisdesc::placeholder {
    color: #a6a6a6;
    padding-top: 10px;
    font-size: 15px;
}

section.inscrivez-vous.avis .inscrivez-vous-description h2 {
    font-size: 25px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 700;
    color: var(--Heading_color);
    margin-bottom: 28px;
    letter-spacing: 0.02rem;
}

.avis button#send-avis {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 0 17px 0 17px;
    text-align: center;
}

.avis button#send-avis:hover {
    opacity: 0.5;
}

/********popup avis****************/

/********filtre catégorie****************/

.filter fieldset {
    border: none;
}

.filter fieldset>.filter label {
    display: inline-block;
    width: 100px;
    font-weight: bold;
    vertical-align: top;
    font-size: 1rem;
    line-height: 28px;
}

/* .filter fieldset > .filter label::after {
    content: ":";
} */
.filter select,
.filter details {
    display: inline-block;
    width: 250px;
    background-color: white;
    cursor: pointer;
}

.filter select,
.filter summary {
    border: 1px solid var(--lt-gray);
    border-collapse: collapse;
    border-radius: 0;
    padding: 8px 4px 7px;
    width: 220px;
    background-color: #f7f7f7;
    cursor: pointer;
    color: var(--bs-body-color);
    font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}

.filter summary i {
    font-size: 15px;
    padding-left: 11px;
}

/* .filter details[open] > .filter summary::marker {
    color: var(--blue);
} */

.filter select:focus,
.filter summary:focus,
.filter summary:active {
    box-shadow: 0 0 5px 1px var(--blue);
}

.filter ul {
    list-style: none;
    margin: 0px;
    padding: 14px;
    margin-top: 12px;
    border: 1px solid var(--dk-gray);
    box-shadow: 0 0 5px 1px var(--lt-gray);
    border: 1px solid #e2e2e2;
    overflow-y: scroll;
    height: 200px;
    width: 220px;
    position: absolute;
    z-index: 1;
    background: #fff;
}

.filter ul::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.filter ul::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.filter ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

.filter li {
    margin: 0px;
    padding: 0px;
}

.filter li>.filter label {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

.filter li>.filter label:hover,
.filter li>.filter label:has(input:checked) {
    background-color: var(--dk-gray);
    color: white;
}

.filter input[type="checkbox"] {
    margin-right: 10px;
}

.filter .card {
    border: none;
    margin: 35px 205px 0;
}

.filter .card-footer {
    background: transparent;
    border: none;
    padding: 0;
}

.filter .card-footer button {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 14px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    border-radius: 0;
    padding: 8px 39px;
    width: 100%;
}

.filter .card-footer button:hover {
    opacity: 0.5;
}

.filter input[type="checkbox"]:checked {
    accent-color: #000;
}

/* filtre page b2b */
.product-cosmetique fieldset {
    border: none;
}

.product-cosmetique fieldset>.product-cosmetique label {
    display: inline-block;
    width: 100px;
    font-weight: bold;
    vertical-align: top;
    font-size: 1rem;
    line-height: 28px;
}

.product-cosmetique select,
.product-cosmetique details {
    display: inline-block;
    width: 250px;
    background-color: white;
    cursor: pointer;
}

.product-cosmetique select,
.product-cosmetique summary {
    border: 1px solid var(--lt-gray);
    border-collapse: collapse;
    border-radius: 0;
    padding: 8px 4px 7px;
    width: 220px;
    background-color: #f7f7f7;
    cursor: pointer;
    color: var(--bs-body-color);
    font-size: 16px;
    text-align: center;
    text-transform: uppercase;
    list-style: none;
}

.product-cosmetique summary i {
    font-size: 15px;
    padding-left: 11px;
}

/* .filter details[open] > .filter summary::marker {
    color: var(--blue);
} */

.product-cosmetique select:focus,
.product-cosmetique summary:focus,
.product-cosmetique summary:active {
    box-shadow: 0 0 5px 1px var(--blue);
}

.product-cosmetique ul {
    list-style: none;
    margin: 0px;
    padding: 14px;
    margin-top: 12px;
    border: 1px solid var(--dk-gray);
    box-shadow: 0 0 5px 1px var(--lt-gray);
    border: 1px solid #e2e2e2;
    overflow-y: scroll;
    height: 200px;
    width: 220px;
    position: absolute;
    z-index: 1;
    background: #fff;
}

.product-cosmetique ul::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #fff;
    margin-right: 30px;
}

.product-cosmetique ul::-webkit-scrollbar {
    width: 5px;
    background-color: #fff;
}

.product-cosmetique ul::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #7f7f7f;
}

.product-cosmetique li {
    margin: 0px;
    padding: 0px;
}

.product-cosmetique li>.product-cosmetique label {
    cursor: pointer;
    display: inline-block;
    width: 100%;
}

.product-cosmetique li>.product-cosmetique label:hover,
.product-cosmetique li>.product-cosmetique label:has(input:checked) {
    background-color: var(--dk-gray);
    color: white;
}

.product-cosmetique input[type="checkbox"] {
    margin-right: 10px;
}

.product-cosmetique .card {
    border: none;
    margin: 0;
}

.product-cosmetique .card-body {
    margin: 0 39% 45px;
}

.product-cosmetique .card-footer {
    background: transparent;
    border: none;
    padding: 0;
}


.product-cosmetique .card-footer button {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    border-radius: 0;
    padding: 10px 39px;
}

.product-cosmetique .card-footer button:hover {
    opacity: 0.5;
}

.product-cosmetique input[type="checkbox"]:checked {
    accent-color: #000;
}

.item-desc button {
    border: none;
    padding: 7px 70px 5px;
    background: #f5f5f5;
    color: #000000;
    font-size: 17px;
}

.item-desc img {
    /* max-width: 100%; */
}

/* .detail-contact .icons-detail-contact a img {
    margin-right: 60px;
    width: 23px;
} */

.reseaux-mail.d-flex.align-items-center {
    width: 20px;
    margin-right: 16px;
}

.detail-contact {
    display: flex;
    align-items: center;
    margin-top: 20px;
    margin-left: 83px;
}

.bloc-right-contact {
    margin: 0 0 0 100px;
}

.cont-description p {
    margin-bottom: 28px;
}


.cont-description-right p {
    margin-bottom: 28px;
}

.item-descc img {
    padding-right: 10px;
    width: 37px;
}

.detail-socialmedia {
    margin-top: 30px;
    margin-left: 83px;
}

.icons-rs {
    padding: 0 45px;
}

.rs-contact {
    display: flex;
    align-items: center;
    margin-top: 26px;
}

.rs-contact a {
    padding-right: 9px;
}


/*  page no-marques */
section.nos-collab {
    padding: 60px 0 75px;
}

h2.title-collab {
    text-align: center;
    color: #fff;
    text-transform: uppercase;
    margin-bottom: 28px;
}

section.nos-collab p {
    color: #fff;
    line-height: 35px;
    font-size: 18px;
    text-align: center;
    padding: 0 25%;
    line-height: 28px;
}

section.nos-collab h2 {
    text-align: center;
    color: #fff;
    margin-bottom: 15px;
    text-transform: uppercase;
    font-size: 28px;
}

.logo-item:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    background: #ffffffdb;
    width: 100%;
    height: 100%;
}

.logo-item:after {
    position: absolute;
    content: "";
    left: 10px;
    right: 10px;
    bottom: 10px;
    top: 10px;
    border: 2px solid #000;
}

.logo-item {
    height: 350px;
    width: 350px;
    position: relative;
    display: flex;
    margin: 0 auto;
    justify-content: center;
    align-items: center;
}

.img-logo-item {
    position: relative;
}

.logo-desc {
    display: flex;
    margin: -35px 90px 0;
    background: #000000;
    z-index: 2;
    position: relative;
    color: #fff;
    text-transform: none;
    padding: 9px 10px;
    text-align: center;
    justify-content: center;
    align-items: center;
}

.logo-desc p {
    margin: 0;
    font-size: 18px;
    line-height: 21px;
}


/* page collection */
.bloc-1-collection {
    padding: 60px 0;
    text-align: center;
    /* Center align the content */
}




.video-bloc2-collection img {
    display: table;
    margin: 0 auto;
    max-width: 100%;
}

.video-bloc2-collection::after {
    position: absolute;
    content: "";
    width: 120px;
    height: 120px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playlive.png);
    cursor: pointer;
    pointer-events: none;
    /* animation: scale 1s linear infinite; */
    border-radius: 50%;
}

.video-bloc2-collection {
    position: relative;
}


.grid-wrapper-colletion>div {
    display: flex;
    justify-content: center;
    align-items: center;
    /* max-width: 100%; */
}

.grid-wrapper-colletion>div>img {
    width: auto;
    height: auto;
    object-fit: cover;
    border-radius: 0px;
}

.grid-wrapper-colletion {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
    grid-auto-rows: 471px;
    grid-auto-flow: dense;
    /* max-width: 100%; */
}

.grid-wrapper-colletion .wide {
    grid-column: span 2;
}

.grid-wrapper-colletion .tall {
    grid-row: span 2;
}

.grid-wrapper-colletion .big {
    grid-column: span 2;
    grid-row: span 2;
}

.bloc-3-collection {
    padding: 20px 24px;
    /* max-width: 2172px; */
}

/* .container.adjust-bloc-collection_hiver {
    max-width: 1271px;
} */

.title-recommandation {
    text-align: center;
    margin-bottom: 35px;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.img-recommandation {
    display: table;
    margin: 0 auto;
}

.img-recommandation img {
    border: 1px solid #d4d4d4a1;
    padding: 15px;
    max-width: 100%;
}

.bloc-5-collection {
    padding: 40px 0;
    margin-right: 49px;
    margin-left: 20px;
    width: 100%;
}

.bloc-6-collection.actualité {
    padding: 40px 0;
}

.bloc-4-collection {
    padding: 20px 0;
}

.title-bloc5-collection {
    text-align: center;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.date-conseil {
    padding: 14px 0 9px;
    font-size: 14px;
    color: #b0b0b0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.date-conseil i {
    padding-right: 6px;
}


.actualité-blogs .box-blogs.Card .titre-conseil {
    font-size: 23px;
    line-height: 27px;
    text-align: center;
    font-family: Century-Gothic-Std, "Century Gothic";
    font-weight: 600;
}

.actualité-blogs.blogs .box-blogs.Card .titre-conseil {
    line-height: 35px;

}

.actualité-blogs .box-blogs.Card .titre-conseil {
    padding-top: 50px;
    padding-bottom: 30px;
}



.img-recommandation img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}

.content-conseil {
    font-family: Century-Gothic-Std, "Century Gothic";
    line-height: 31px;
    text-align: justify;
    font-size: 18px !important;
}

.actualité-blogs .box-actualité.Card .btn-box-blogs {
    text-align: center;
    margin-top: 20px;
}

.item-conseil {
    border: 1px solid #d4d4d4a1;
    padding: 20px;
}

.img-conseil img {
    max-width: 100%;
}

.title-anciennescoll {
    text-align: center;
    margin-bottom: 35px;
    font-size: 30px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    color: var(--Heading_color);
    letter-spacing: 0.02rem;
}

.title-anciennecoll {
    position: absolute;
    content: "";
    color: #fff;
    text-align: center;
    top: 0;
    margin: 30px auto 0;
    left: 0;
    right: 0;
    font-size: 22px;
    text-transform: uppercase;
    text-shadow: 0 0 30px #fff;
}

.item-anciennecoll {
    position: relative;
}

/* page espace-client */
.header-marketing-desc input.form-control {
    width: 800px;
    margin-top: 35px;
    border: none;
    border-radius: 19px;
    padding: 7px 38px;
    text-transform: none;
}

.page-espace-client {
    padding: 70px 0 40px;
}

.imgItem-espace-client img {
    max-width: 100%;
}

.item-espace-cleint {
    position: relative;
    margin-bottom: 23px;
}

.titleItem-espace-client {
    position: absolute;
    bottom: 0;
    padding: 0px 17px;
    height: 77px;
}

.titleItem-espace-client a {
    color: #fff;
    font-family: var(--Brand_title_fonts);
    font-weight: bold;
    text-transform: uppercase;
    font-size: 22px;
    line-height: 24px;
}

.imgItem-espace-client {
    position: relative;
}

.imgItem-espace-client:before {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000000;
    background: -moz-linear-gradient(left, #0000008c 0%, #ffffff0f 100%);
    background: -webkit-linear-gradient(left, #0000008c 0%, #ffffff0f 100%);
    background: linear-gradient(to right, #0000008c 0%, #ffffff0f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#ffffff', GradientType=1);
}

.sidebar-espace-client {
    border: 1px solid #f2f2f2;
}

.title-espace-client {
    background: #000;
    color: #fff;
    padding: 18px 25px 15px;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 600;
}

.nameprop-espace-client {
    border: 1px solid #f2f2f2;
    padding: 20.8px 23px;
    font-size: 18px;
    font-weight: 600;
}

.nameprop-espace-client a {
    color: var(--Heading_color);
}

.nameprop-espace-client a:hover {
    color: var(--red_color);
}

@media (max-width:1400px) {
    .titleItem-espace-client a {
        font-size: 20px;
        line-height: 21px;
    }

    .titleItem-espace-client {
        height: 90px;
    }
}

@media (max-width:991px) {
    .content-espace-client {
        margin-top: 55px;
    }
}


/* page suivi commande */
.form-suivi-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.form-suivi-commande input[type="number"],
.form-suivi-commande input[type="email"] {
    width: 100%;
    border: 1px solid #c1c1c1;
    padding: 4px 20px;
}

.title-suivi-commande {
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 25px;
}

.groupForm-suivi-commande {
    margin-bottom: 35px;
}

.groupForm-suivi-commande label {
    margin-bottom: 9px;
    color: #8e8e8e;
    text-transform: uppercase;
    font-size: 13px;
}

.btn-suivi-commande {
    display: table;
    margin: 0 auto;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
}

.btn-suivi-commande a {
    color: #fff;
}

.btn-suivi-commande:hover {
    cursor: pointer;
}

.imgmap-suivi-commande {
    width: 324px;
    height: 260px;
}

.position-suivi-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.imgmap-suivi-commande img {
    width: 100%;
    height: 260px;
}

.btn-suivi-commande {
    display: table;
    margin: 0 auto 12px;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
}


@media (max-width:991px) {
    .content-suivi-commande {
        margin-top: 72px;
    }
}

/* page prob commande */
.subtitle-prob-commande {
    text-align: center;
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 16px;
}

.title-prob-commande {
    text-align: center;
    font-size: 23px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 30px;
}

.form-prob-commande {
    border: 2px solid #f2f2f2;
    padding: 21px 21px 40px;
    display: table;
    margin: 0 auto;
}

.groupForm-prob-commande {
    display: grid;
}

.content-prob-commande input[type="text"],
.content-prob-commande input[type=number],
.content-prob-commande textarea,
.content-prob-commande select {
    width: 600px;
    border: 1px solid #c1c1c1;
    padding: 4px 10px;
}

.groupForm-prob-commande {
    display: grid;
    margin-bottom: 17px;
}

.content-prob-commande label {
    margin-bottom: 7px;
    color: #8e8e8e;
    text-transform: uppercase;
    font-size: 13px;
}

.content-prob-commande select {
    font-size: 15px;
}

.btn-prob-commande {
    display: table;
    margin: 37px auto 0;
    background: var(--Heading_color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    padding: 9px 62px;
}

.btn-prob-commande a {
    color: #fff;
}

.btn-prob-commande:hover {
    opacity: 0.5;
}

.content-prob-commande input[type="text"]:focus-visible,
.content-prob-commande input[type=number]:focus-visible,
.content-prob-commande textarea:focus-visible,
.content-prob-commande select:focus-visible {
    outline: none;
    box-shadow: 0 0 10px #c1c1c17d;
}


/* page application beauté */
.header-marketing .ban-app {
    top: 50%;
    right: 25%;
}

.logo-app img {
    max-width: 100%;
    width: auto;
}

.name-app {
    color: var(--Heading_color);
    font-size: 16px;
    font-weight: lighter;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
    padding-top: 13px;
    margin-bottom: 48px;
    letter-spacing: 1.5px;
}

.color-content-app {
    color: var(--red_color);
    font-size: 50px;
    text-transform: uppercase;
    font-weight: 700;
    line-height: 60px;
}

.btn-app {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    margin: 35px auto 0;
    padding: 12px 0;
}

.btn-app a {
    color: #fff;
}

.btn-app:hover {
    opacity: 0.5;
}

.content-app {
    color: var(--Heading_color);
}

.page-app {
    padding: 50px 35px 20px;
}

.title-bloc1-app {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    text-align: center;
}

.content-bloc1-loyality p {
    font-family: 'Century-Gothic-Std';
    line-height: 26px;
    font-size: 17px;
    padding-left: 30px;
    padding-right: 30px;

}

.content-bloc1-app p {
    margin: 0 0 46px 0;
    font-family: 'Century-Gothic-Std';
    line-height: 26px;
    font-size: 17px;
}


.img-bloc1-app img {
    max-width: 100%;
}

.img-bloc1-application-mahassen img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}



.bloc2-app {
    /* padding: 65px 0 30px; */
    padding: 60px 35px 35px 35px;
    position: relative;
}

.bloc3-app {
    padding: 60px 35px 35px 35px;
    position: relative;
}

.bloc2-app {
    padding: 60px 35px 35px 35px;
    position: relative;
}

.row.app-1 {
    display: flex;
    align-items: center;
}

/* .content-bloc2-app p {
    text-align: center;
} */

.description-detail-actualite {
    text-align: justify;
    padding-left: 50px;
    padding-right: 50px;
}

.title-bloc2-app {
    text-align: justify;
    font-weight: 700;

    font-size: 29px;
    margin-bottom: 17px;
}

.liste-bloc2-app li {
    font-size: 17px;
    font-weight: 600;
    margin-bottom: 4px;
}

.product-slider-idees .product-item img {
    /* width: 100%;
    height: auto; */
    /* max-width: 300px;
    max-height: 200%; */
    object-fit: cover;

}

.product-slider-idees .item {
    width: 33.33%;
    padding: 10px;
}

.product-slider-idees {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

ul.liste-bloc2-app {
    margin-left: 40px;
}

.img-bloc2-app {
    margin: 0 auto;
    display: table;
}



.title-bloc2-app {
    text-align: justify;
    font-weight: 700;
    font-family: 'Century-Gothic-Std';
    font-size: 29px;
    margin-bottom: 17px;
}

.content-bloc2-app {
    margin-left: 20px;
    width: 85%;
    font-family: 'Century-Gothic-Std';
}

.description {
    text-align: justify;
    font-family: 'Century-Gothic-Std' !important;
    font-size: 14px;
    margin-bottom: 17px;
}





.description-bloc1 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.content-bloc1-app {
    /* margin-left: 20px; */
    text-align: justify;
    /* margin-right: 20px; */
}

.custom-image {
    width: 100%;
    /* height: 300px; */
    height: 214px;
    object-fit: cover;
}

.description-bloc5 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

section.coiffure-hom {
    padding: 60px 35px 60px 35px;
    position: relative;
}

section.img-bloc3-app .content-img-left {
    text-align: center;
    padding-top: 19px;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
    margin-left: 50px;
}

.bloc2-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc3-app {
    text-align: center;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
}

.content-bloc3-app p {
    text-align: center;
}

section.bloc3-app {
    position: relative;
    padding: 35px 35px 35px 35px;
}

section.bloc3-app .content-img-left img {
    min-width: 100%;
    height: 100%;
}

.bloc3-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.img-bloc4-app img {
    max-width: 100%;
}

.title-bloc8-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.title-bloc4-app {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
}

.description-bloc4 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}

.description_histoire_marque {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 15px;
    margin-bottom: 17px;
}

.description-bloc7 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


.description-bloc8 {
    text-align: center;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
    text-transform: uppercase;
}


.content-bloc4-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc4-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc7-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc7-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc6-app {
    margin-left: 20px;
    width: 85%;
}


.actualité-blogs .box-blogs.Card .image-box-actualité img {
    max-width: 100%;
}



.btn-box-blogs {
    text-align: center;
    margin-top: 20px;
}

.actualité-blogs .box-blogs.Card {
    box-shadow: rgb(219, 219, 219) 0px 0px 10px;
    background: rgb(255, 255, 255);
    padding: 29px 35px 33px;
    margin: 0px 16px 51px;
}

.content-bloc6-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc8-app {
    margin-left: 20px;
    width: 85%;
}

.content-bloc8-app p {
    text-align: justify;
    width: 85%;
}

.btn-bloc4-app {
    background: var(--Heading_color);
    color: var(--white-color);
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    letter-spacing: 0.02rem;
    transition: opacity 2s;
    outline: none;
    border: none;
    text-transform: uppercase;
    display: table;
    margin: 38px auto 0;
    padding: 9px 31px;
}

.btn-bloc4-app a {
    color: #fff;
}

.btn-bloc4-app:hover {
    opacity: 0.5;
}

.bloc4-app {
    padding: 10px 35px 35px 35px !important;
    position: relative;
}

.bloc4-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc5-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}


.img-bloc5-app img {
    max-width: 100%;
}

.img-bloc6-app img {
    max-width: 100%;
}

.bloc5-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc5-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.img-bloc8-app img {
    max-width: 100%;
}

.title-bloc8-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.content-bloc8-app p {
    text-align: justify;
}

.title-bloc6-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.description-bloc8 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.description-bloc6 {
    text-align: justify;
    font-family: 'Century-Gothic-Std';
    font-size: 14px;
    margin-bottom: 17px;
}

.content-bloc8-app p {
    text-align: justify;
    width: 85%;
}

.content-bloc6-app p {
    text-align: justify;
}

.img-bloc6-app {
    display: table;
    margin: 0 auto;
}

.content-bloc6-app {
    margin-left: 20px;
}

.bloc6-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc6-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.title-bloc7-app {
    text-align: justify;
    font-weight: 700;
    font-size: 29px;
    margin-bottom: 17px;
    line-height: 32px;
}

.content-bloc7-app p {
    text-align: justify;
}

.content-bloc6-app p {
    text-align: justify;
}

.bloc7-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}

.bloc7-app:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 70%;
    height: 1px;
}

.bloc7-app {
    position: relative;
    padding: 33px 0 33px;
}

.img-bloc2-app img {
    max-width: 100%;
}

.content-bloc8-app p {
    margin: 0 20px 0 2px;
    text-align: justify;
}

.img-bloc3-app img {
    max-width: 100%;
}

.bloc8-app {
    padding: 60px 35px 35px 35px !important;
    position: relative;
}


@media (max-width:991px) {
    .color-content-app {
        font-size: 37px;
    }

    .content-app {
        font-size: 13px;
    }

    .color-content-app {
        font-size: 37px;
    }

    .name-app {
        font-size: 13px;
    }

    .header-marketing .ban-app {
        right: 16%;
    }
}

@media (max-width:767px) {
    .content-bloc2-app {
        margin-left: 0;
    }

    .content-bloc4-app {
        margin-left: 0;
    }

    .content-bloc6-app {
        margin-left: 0;
    }

    .content-bloc8-app {
        margin: 0;
    }
}

.big-content-b2b {
    width: 100%;
}



/* page actualités */


section.actualité {
    padding: 70px 0;
}

.box-actualité {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
    /* height: 915px; */
}

.image-box-actualité {
    display: table;
    margin: 0 auto;
    max-width: 100%;
}

.image-box-actualité img {
    width: 100%;
    height: auto;
}

ol.breadcrumb {

    justify-content: center;
}

.title-box-actualité {
    text-align: justify;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
    font-weight: 500;
    color: #000;
    margin: 23px 0 7px;
    text-align: center;
}

.detail-box-actualité {
    display: flex;
    justify-content: center;
}



.user-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    font-weight: 400;
    margin-right: 31px;
    color: #f33f38;
}

.date-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    font-weight: 400;
    color: #f33f38;
}

.content-box-actualité {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 16px;
    text-align: center;
    padding: 28px 28px 0;
    line-height: 28px;
    font-weight: 400;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.btn-box-actualité a {
    display: table;
    margin: 17px auto 0;
    color: var(--Heading_color);
    font-family: "Century-Gothic-Std", "Century Gothic";
    letter-spacing: 0.02rem;
    position: relative;
    padding-bottom: 4px;
    transition: all .4s;
}

.btn-box-actualité a:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: var(--Heading_color);
    transition: all .4s;
}

.btn-box-actualité a:hover:after {
    background: #f33f38;
}

.btn-box-actualité a:hover {
    color: #f33f38;
}


@media (max-width:1199px) {
    .box-actualité {
        margin: 0 4px;
        padding: 18px 15px 29px;
    }

    .content-box-actualité {
        padding: 28px 17px 0;
    }
}

@media (max-width:991px) {
    .title-box-actualité {
        font-size: 24px;
        margin: 23px 0 13px;
        line-height: 30px;
    }

    .content-box-actualité {
        padding: 28px 10px 0;
    }

    .box-actualité {
        margin: 0 55px 35px;
        padding: 18px 15px 29px;
    }

    .live-slider .box-actualité {
        margin: 0 55px 35px;
        padding: 18px 15px 29px;
    }

    .banner-img {
        overflow: hidden;
        position: relative;
        margin: 0 auto;
        width: 100%;
    }

}

.div_slide_index {
    position: relative;
    height: 100vh;
    width: 100vw;
}

@media (max-width: 500px) {

    .sidebar-logo i,
    .navbar .bx-menu {
        margin-right: 0;
    }

    .slider-wrapper .content {
        position: absolute;
        top: auto;
        bottom: 150px;
        left: 0;
        width: 400px;
        color: #fff;
        right: 0;
        display: table;
        margin: 0 auto;
        text-align: center;
    }
}

@media (max-width: 500px) {
    .slider .slick-dots .animated-dot {
        left: 8%;
    }
}

@media (max-width: 482px) {
    .slider-progress {
        width: 300px;
    }

    .slider .slick-dots .animated-dot {
        left: 11%;
    }
}

.video-hero {
    /* height: 100vh; */
    height: calc(67vh - 48px);
    position: relative;
}

.small-image {
    max-width: 368px;
    max-height: 411px;
}


.small-image-right {
    max-width: 368px;
    max-height: 411px;
}

.maps img {
    width: 26px;
}

div#recherche_prod_cat img {
    width: 14px;
}

.heart {
    position: relative;
}

.user img {
    width: 12px;
}

.shop img {
    width: 12px;
}

.telheader img {
    width: 13px;
    margin-right: 5px;
    margin-top: -3px;
}

.telheader {
    margin-right: 9px;
}

.content-log img {
    width: 185px;
    padding-top: 5px;
}

.header_logo_icons .laguages span {
    font-size: 12px;
}

.item-desc p {
    font-size: 14px;
}

section.footer .footer-content h5 {
    font-size: 17px;
}

div#cart {
    position: relative;
}

.title-left,
.title-right {
    margin-bottom: 52px;
}

.bloc-left-form,
.bloc-right-form {
    padding: 0 60px;
    padding-top: 44px;
}

h1.title-top {
    margin-bottom: 45px;
}

.col-xs-12.col-md-6.px-5.nouveau-client {
    padding-top: 40px;
}

.form-label {
    font-size: 15px;
}

@media (max-width:1600px) {
    .logo-desc {
        margin: -35px 50px 0;
    }
}

@media (max-width:1366px) {
    section.autonome .content-autonome-desc {
        padding-top: 120px;
    }
}

@media (min-width:1367px) and (max-width:1400px) {
    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }
}

@media (max-width:1400px) {
    section.autonome .content-autonome-desc h2 {
        top: 45px;
    }



    section.autonome .content-autonome-desc h3 {
        padding-left: 30px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 30px; */
    }

    section.collection .desc_collection h2 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 25px;
        color: var(--Heading_color) !important;
    }

    section.collection .desc_collection h4 {
        font-weight: 400;
        text-transform: uppercase;
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 25px;
        color: var(--Heading_color) !important;
    }
}

section.collection .desc_collection p,
section.autonome .content-autonome-desc p,
section.lamarque .cont-description p,
section.lamarque.soinPeau .cont-description-la p,
section.nouveaute .content-noveaute-desc .contnet-nouveaute p {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-align: justify;
    line-height: 32px;
    /* margin-bottom: 27px;
    line-height: 35px;
    margin-top: 25px; */
}

section.maquillage .content-autonome-desc h2 {
    font-size: 27px;
}

section.autonome div#carouselExampleCaptions2 .carousel-caption p,
section.maquillage .content-carousel-maquillage .carousel-caption p,
section.collection.mah-nouveaute div#carouselExampleCaptions3 .carousel-caption p {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.maquillage .content-autonome-desc p {
    font-size: 15px;
    line-height: 29px;
}

img.small-image {
    margin-top: 34px;
}

img.small-image-right {
    margin-top: 34px;
}

.marque img.small-image {
    margin-top: 0px;
}

.marque img.small-image-right {
    margin-top: 0px;
}

.content-autonome-desc a.decouvrir {
    margin-top: 19px;
}

section.nouveaute .content-noveaute-desc .contnet-nouveaute h2 {
    font-size: 25px;
}

section.product-cosmetique .item .item-desc p {
    font-size: 16px;
}

section.product-cosmetique .item .item-desc h5 {
    font-size: 16px;
}

section.product-cosmetique .item .item-desc h4 {
    font-size: 16px;
    line-height: 23px;
}

section.mahassen-lives .mahassen-live-desc p {
    margin-bottom: 0;
}

section.avis-clients h2 {
    font-size: 27px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
    font-size: 26px;
}

section.mahassen-lives .mahassen-live-desc h2,
.cont-description h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
    color: black;
}

section.mahassen-lives .mahassen-live-desc h2,
.cont-description-right h2 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
    color: var(--Heading_color);
}

section.carte-mahassen .content-carte-mahassen .content-carte-one p {
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    margin-bottom: 50px;
    text-align: justify;
    line-height: 35px;
    margin-top: 25px;
}

section.carte-mahassen .content-carte-mahassen .content-carte-one button {
    font-size: 13px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description p {
    font-family: "Century-Gothic-Std", "Century Gothic";
    margin-bottom: 10px;
    text-align: justify;
    line-height: 35px;
    margin-top: 25px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description-right p {

    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 35px;
}

section.mahassen-lives .mahassen-live-desc p,
.cont-description-right p {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 15px;
    text-align: justify;
    line-height: 35px;
}

section.abonnez-vous h2 {
    font-size: 25px;
}

section.abonnez-vous h5 {
    font-size: 23px;
}

section.newsletter h2 {
    font-size: 25px;
}

section.newsletter span {
    font-size: 23px;
}

section.icons .item-desc h5 {
    font-size: 14px;
}

.item-desc p {
    font-size: 13.5px;
}

section.footer .footer-content h3 {
    font-size: 15.5px;
}

section.maquillage .content-autonome-desc {
    padding-right: 6px;
    margin-left: 80px;
    padding-left: 93px;
    padding-top: 20px;
    margin-top: 0px;
}

/* .container-fluid.adjust-container-section-hammem-spa {
    margin-left: 80px;
} */

section.product-cosmetique .item .item-desc {
    padding: 10px 10px;
}

.item.shine {
    margin-bottom: 20px;
}

.product-cosmetique .card-body {
    margin: 0 34% 45px;
}

/*Bon plan b2b*/


.content-image-bonplan-b2c {
    position: relative !important;
}

.ontent-image-bonplan-b2c img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}


.bonplan-col8,
.bonplan-col4 {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    padding-top: 20px;
}

.content-image-bonplan-b2c-first,
.content-image-bonplan-b2c-second {
    position: relative !important;
    flex: 1 !important;
}

.content-image-bonplan-b2c-first img,
.content-image-bonplan-b2c-second img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
}

.content-bonplan {
    padding: 15px !important;
}



/*End Bon plan b2b*/

.item-desc button {
    font-size: 15px;
    padding: 7px 44px 5px;
}

section.product-cosmetique .item .product-item {
    height: auto;
}

section.product-cosmetique .item .product-item img {
    height: auto;
    background-size: cover;
    width: auto;
}

section.product-cosmetique .item .product-item video {
    height: auto;
    background-size: cover;
    width: 100%;
    max-width: 100%;
}

.logo-desc {
    margin: -35px 32px 0;
}

.logo-item {
    height: 320px;
    width: 100%;
}


@media (max-width:1300px) {
    section.maquillage .content-autonome-desc h2 {
        font-size: 26px;
    }
}

@media (max-width:1200px) {
    section.autonome .content-autonome-desc h2 {
        padding-left: 150px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 80px;
        margin-left: 30px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 21px;
    }

    .bottom-desc-img img {
        max-width: 100%;
    }

    .title-right,
    .title-left {
        font-size: 20px;
        margin-bottom: 40px;
    }

    .form-label {
        font-size: 15px;
    }

    .title-top {
        font-size: 35px;
        margin-bottom: 50px;
    }

    .logo-item {
        height: 280px;
        width: 100%;
    }
}

@media (max-width:1199px) {
    .content_slider .carousel-caption h1 {
        font-size: 28px;
    }

    .content_slider .carousel-caption p {
        font-size: 15px;
        max-width: 600px;
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 270px;
    }

    .filter select,
    .filter summary {
        width: 136px;
        font-size: 15px;
    }

    section.product-cosmetique h2 {
        font-size: 26px;
    }

    .cont-description {
        width: 100%;
    }

    .form-label {
        font-size: 14px;
    }

    .title-right,
    .title-left {
        font-size: 19px;
        margin-bottom: 40px;
    }

    .logo-item {
        height: 280px;
        max-width: 350px;
    }

    .logo-desc {
        margin: -35px 50px 0;
    }

    .titre-conseil {
        font-size: 19px;
        line-height: 23px;
        height: 85px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item {
        padding: 0 15px;
    }

    .carousel-caption {
        bottom: 0;
        left: 0;
        position: relative;
    }

    .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -50px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -50px;
    }

    section.collection .desc_collection .spa.maquillage {
        height: 90px;
    }

    .mah-nouveaute .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: 35px;
    }

    .mah-nouveaute .carousel-maquillage button.slick-next.slick-arrow {
        bottom: 35px;
    }

    section.esthetique-home p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        margin-bottom: 50px;
        text-align: justify;
        line-height: 35px;
        margin-top: 25px;
        color: black;
    }

    section.esthetique-home h2 {
        font-size: 35px;
    }

    section.esthetique-home h3 {
        font-size: 29px;
    }

    td.cart_td {
        padding: 29px 10px 28px 0px !important;
    }
}

@media (max-width:991px) {
    section.inscrivez-vous .inscrivez-vous-description {
        padding: 45px 30px 45px 28px;
    }

    section.inscrivez-vous .inscrivez-vous-description h2 {
        font-size: 19px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        font-size: 15px;
        line-height: 22px;
    }


    section.maquillage .content-autonome-desc {
        margin-top: 132px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 637px !important;
    }

    .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -45px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: -45px;
    }

    section.autonome .content-autonome-desc h2 {
        padding-left: 0;
    }

    .content_slider .carousel-caption p {
        max-width: 500px;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 35px;
    }

    nav .navbar .links li .sub-menu .nav-n1 {
        display: block;
        margin: 10px 0 0 20px;
    }

    nav .navbar .links li .sub-menu .nav-n1 h4 {
        font-size: 14.5px;
        margin-bottom: 7px;
        margin-top: 19px;
    }

    .navbar .links li .sub-menu a {
        font-size: 13.5px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child i.fa-solid.fa-chevron-right {
        padding: 11px 11px 8px;
        font-size: 10px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child a {
        white-space: initial;
        line-height: 20px;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image {
        display: block;
    }

    nav .navbar .links li .sub-menu ul.ul-nav-n1.have-image .content-image {
        max-width: 100%;
        height: auto;
        margin-bottom: 0;
        margin-top: 15px;
    }

    nav .navbar .links li .sub-menu .nav-n1 ul.ul-nav-n1 li.nav-n1-has-child ul.ul-nav-n2 {
        position: relative;
        right: 0;
        top: 0;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 25px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 18px;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        margin: 145px auto 0;
    }

    section.collection.mah-nouveaute.maquillage .contents-img {
        margin: 145px auto 0;
    }

    section.maquillage div#carouselExampleCaptions3 .carousel-inner {
        overflow: visible;
    }

    section.product-cosmetique.maquillage {
        padding-top: 33px;
        padding-bottom: 10px;
        background: white;
        margin-top: 15px !important;
    }

    section.collection .desc_collection .spa img {
        width: 600px;
        height: auto;
        margin: 0 auto;
        display: table;
    }

    section.product-cosmetique .item .product-item {
        height: auto;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item {
        padding: 0 10px;
    }

    .carousel-maquillage.slick-initialized.slick-slider .carousel-caption {
        bottom: -12px;
        left: 0;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 15px;
    }

    .filter .card {
        margin: 35px 72px 0;
    }

    .collab-item {
        padding: 0 20px;
    }

    section.product-cosmetique h2 {
        font-size: 26px;
    }

    .content-img.brochure img {
        width: 400px;
        max-width: none;
    }

    .content-img img {
        width: 370px;
        max-width: none;
    }

    .massage.coiffure .row {
        display: flex;
        flex-direction: column-reverse;
    }

    .cont-description-right {
        margin-top: 50px;
    }

    .coiffure-hom .row {
        display: flex;
        flex-direction: column;
    }

    .coiffure-hom .col-md-6 {
        width: 100%;
        margin-top: 0;
    }

    .massage.coiffure .col-md-6 {
        width: 100%;
    }

    .massage.coiffure .col-md-6.order-md-2 {
        order: 1;
    }

    section.coiffure-hom {
        padding: 10px 35px 35px 35px;
        position: relative;
    }

    section.massage {
        padding: 35px 35px;
        position: relative;
    }

    .massage.coiffure .col-md-6.order-md-1 {
        order: 2;
    }

    section.forfait-homme h2 {
        font-size: 30px;
    }

    .content-encart a.decouvrir {
        font-size: 17px;
    }

    section.forfait-homme h2 {
        font-size: 35px;
    }

    .content-encart a.decouvrir {
        font-size: 17px;
    }

    .cont-forfait h4 {
        font-size: 20px;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 26px;
    }

    .bloc-right-contact {
        margin: 0 90px;
    }

    .product-cosmetique .card-body {
        margin: 0 28% 45px;
    }

    .shop_cart {
        right: -125px;
    }

    .bloc-left-form,
    .bloc-right-form {
        padding: 40px 30px;
    }

    .fidelite-bon-plan {
        font-size: 1.5rem;
        margin-left: 20px;
        display: flex;
        align-items: center;
        height: 573.05px !important;
        /* top: 50px; */
    }

    .fidelite-bon-plan {
        /* margin-top: -138px; */
        margin-left: -8rem !important;
        top: 50px;
    }

    section.bonplan .fidelite-bon-plan {
        width: 20%;
        float: right;
    }

    .card-forgot-password {
        max-width: 75%;
    }

    .forgot-password-logo {
        padding: 40px;
    }

    .logo-desc {
        margin: -35px 101px 0;
    }

    .title-bloc1-collection {
        margin: 0 30px 10px;
        font-size: 17px;
    }

    .description-detail-actualite {
        text-align: justify;
        padding: 0px;
    }

    .title-recommandation {
        font-size: 28px;
    }

    .slider__counter {
        font-size: 2rem;
    }

    .logo-desc {
        margin: -35px 247px 0;
    }

    .item-anciennecoll {
        display: table;
        margin: 0 auto 20px;
    }

    .quant-td {
        width: 23%;
    }

}

@media (max-width:767px) {

    section.mahassen-lives button.slick-prev.slick-arrow,
    section.mahassen-lives button.slick-next.slick-arrow {
        bottom: 0px;
    }

    section.collection.mah-nouveaute.maquillage .content-img {
        margin: 0px auto 0;
    }

    section.collection.mah-nouveaute.maquillage {
        padding: 50px 37px 30px;
    }



    .filter li label {
        font-size: 14px;
    }

    .sliderTop .slick-prev:before {
        bottom: 0;
        left: 97px;
        width: 58px;
    }

    section.maquillage div#carouselExampleCaptions3 {
        height: 600px;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 0;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        transform: translateX(0%);
    }

    section.avis-clients h2 {
        margin-bottom: 50px;
    }

    .slider__counter {
        bottom: -3px;
        left: auto;
        right: 5rem;
    }

    section.esthetique-home h3 {
        font-size: 27px;
    }

    section.collection.mah-nouveaute .desc_collection {
        padding: 50px 0 169px;
    }

    .content-img.brochure img {
        top: 35px;
    }

    .contents-img.brochure img {
        top: 35px;
    }

    .item-conseil {
        margin-bottom: 20px;
    }

    .product-cosmetique select,
    .product-cosmetique summary {
        width: 100%;
    }

    .product-cosmetique select,
    .product-cosmetique details {
        width: 100%;
        display: table;
        margin: 0 auto 10px;
    }

    .quant-td {
        width: 30%;
    }

    th.product-name {
        padding-bottom: 8px;
    }
}

@media (max-width:729px) {
    .sliderTop .slick-prev:before {
        left: 75px;
    }

    .logo-desc {
        margin: -35px 146px 0;
    }
}

@media (min-width:501px) and (max-width:767px) {
    .politique h3.titre-plitique {
        margin-bottom: 25px;
    }

}

@media (max-width:500px) {
    .header-marketing .header-marketing-desc h1 {
        font-size: 20px !important;
        padding-top: 10px;

    }

    .politique h3.titre-plitique {
        font-size: 18px;
        line-height: 25px;
        margin-bottom: 25px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 16px;
        width: 80%;
    }

    .header-marketing .header-marketing-desc h1 {
        font-size: 27px;
    }

    section.collection .desc_collection .spa img {
        width: 100%;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 26px;
    }

    .header_logo_icons .header_icons {
        /* margin-top: 18px; */
    }

    section.collection .desc_collection h2 {
        font-size: 24px;
    }

    section.collection .desc_collection h4 {
        font-size: 24px;
    }

    section.idees .item .item-desc h4 {
        font-size: 21px;
    }

    section.idees .item .item-desc p {
        font-size: 15px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 64px;
        margin-left: 0px;
    }

    section.lamarque .slick-prev:before {
        bottom: 24px;
    }

    section.lamarque .slick-next:before {
        bottom: 24px;
    }

    section.abonnez-vous h2 {
        font-size: 22px;
        margin-bottom: 12px;
    }

    section.newsletter h2 {
        font-size: 22px;
    }

    section.newsletter span {
        font-size: 21px;
    }

    section.abonnez-vous h5 {
        font-size: 21px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) {
        grid-template-columns: 61px auto 89px;
        height: max-content !important;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 24px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 30px;
        font-size: 45px;
    }

    .content-log img {
        width: 188px;
        padding-top: 0;
    }

    .sliderTop .slick-prev:before {
        left: 23px;
    }

    section.maquillage .content-autonome-desc h2 {
        font-size: 25px;
        margin-top: 50px;
        font-weight: 400;

    }

    section.product-cosmetique .item {
        padding: 0px 8px;
    }

    section.idees h2 {
        font-size: 27px;
        margin-bottom: 20px;
    }

    /* .fidelite-mahassen .carte-mahassen .content-carte-mahassen.carte-two {
        height: 650px;
    } */

    section.collection.mah-nouveaute .desc_collection {
        padding: 50px 0 0px;
    }

    .filter select,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter .card-footer button {
        padding: 8px 103px;
    }

    .filter select,
    .filter details {
        display: table;
        margin: 0 auto;
    }

    .logo-desc {
        margin: -35px 103px 0;
    }

    section.nos-collab p {
        padding: 0 4%;
        line-height: 25px;
        font-size: 16px;
    }

    .title-anciennescoll {
        margin-bottom: 24px;
        font-size: 26px;
        line-height: 30px;
    }

    .header-marketing .header-marketing-desc p {
        font-size: 15px;
    }

    .item-desc button {
        padding: 7px 33px 5px;
    }

    a.title-product-carte {
        font-size: 15px;
        line-height: 18px;
    }

    .price-product-carte {
        font-size: 15px;
    }

    .quant-td {
        width: 27%;
    }

    .rounded-circle.faplus {
        padding: 0;
    }

    .rounded-circle.faminus {
        padding: 5px;
    }


}

@media (max-width:482px) {
    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 62px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 24px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        font-size: 47px;
    }

    section.newsletter h2 {
        font-size: 24px;
    }

    section.idees h2 {
        font-size: 26px;
    }

    section.massage {
        padding: 0 0 103px;
    }

    section.massage {
        padding: 0 0 0;
    }

    section.massage .content-img {
        margin-bottom: 0;
    }

    section.massage .content-img {
        height: 300px;
    }

    section.massage .contents-img {
        margin-bottom: 0;
    }

    section.massage .contents-img {
        height: 300px;
    }
}

@media (max-width:480px) {
    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 22px;
    }

}

@media (max-width:395px) {
    .header-marketing .header-marketing-desc h1 {
        font-size: 22px;
    }

    .header-marketing .header-marketing-desc.meilleur p {
        font-size: 15px;
    }

    section.collection .desc_collection h2 {
        font-size: 25px;
    }

    section.collection .desc_collection h4 {
        font-size: 25px;
    }

    section.product-cosmetique.maquillage h2 {
        font-size: 21px;
    }

    .product-item .new {
        padding: 6px 13px;
    }

    section.product-cosmetique .remise {
        right: 14px;
        height: 44px;
        width: 44px;
    }

    section.idees h2 {
        font-size: 21px;
    }

    section.mahassen-lives .mahassen-live-desc h2 {
        font-size: 21px;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-top: 25px;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        font-size: 15px;
    }

    section.abonnez-vous h2 {
        font-size: 21px;
    }

    section.abonnez-vous h5 {
        font-size: 17px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 20px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        font-size: 32px;
    }

    .content-log img {
        width: 170px;
    }

    .header_logo_icons .mahassen-live span:first-of-type {
        font-size: 14px;
    }

    .content-log img {
        width: 165px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite span {
        font-size: 46px;
    }

    section.newsletter span {
        font-size: 18px;
    }

    section.inscrivez-vous .inscrivez-vous-description {
        padding: 30px 21px 30px 21px;
    }

    section.inscrivez-vous .inscrivez-vous-description h2 {
        font-size: 17px;
        margin-bottom: 12px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:first-of-type {
        line-height: 19px;
        margin: 0 0 18px;
    }

    section.inscrivez-vous .inscrivez-vous-description .email button.inscrire.shine {
        font-size: 13px;
    }

    section.inscrivez-vous .inscrivez-vous-description p:last-of-type {
        margin: 0 0 10px;
        line-height: 20px;
    }

    .inscrivez-vous-img {
        padding-top: 0;
    }

    section.inscrivez-vous .inscrivez-vous-description .email {
        margin-bottom: 19px;
    }

    .sliderTop .slick-prev:before {
        left: -7px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 25px !important;
    }

    section.autonome .content-autonome-desc h2 {
        font-size: 30px;
    }

    section.maquillage .content-autonome-desc h2 {
        font-size: 25px !important;
    }

    section.avis-clients h2 {
        font-size: 23px;
    }



    section.newsletter h2 {
        font-size: 20px;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2 {
        font-size: 24px;
    }

    section.esthetique-home h2 {
        font-size: 28px;
    }

    .filter .card {
        margin: 35px 0 0;
    }

    section.product-cosmetique h2 {
        font-size: 22px;
    }

    .select_wrap select {
        margin-bottom: 11px;
    }

    .fond-de-tient-description button.btn-ajouter.ajouter {
        /* max-width: 257px; */
    }

    .header-marketing .header-marketing-desc p {
        font-size: 16px;
    }

    .logo-desc {
        margin: -26px 24px 0;
    }

    section.nos-collab p {
        padding: 0 10%;
    }

    .content-img.brochure img {
        width: 265px;
    }

    .contents-img.brochure img {
        width: 265px;
    }

    section.forfait-homme h2 {
        font-size: 30px;
    }

    .content-img img {
        width: 100%;
    }

    .contents-img img {
        width: 100%;
    }

    .box-actualité {
        margin: 0 0 35px;
    }

    .content-bloc1-collection {
        padding: 0 0 40px;
    }

    .grid-wrapper-colletion {
        display: block;
    }

    .grid-wrapper-colletion>div>img {
        margin-bottom: 10px;
    }

    .title-anciennescoll {
        font-size: 23px;
    }

    .img-anciennecoll img {
        max-width: 100%;
    }

    .title-bloc5-collection {
        font-size: 27px;
    }

    .title-recommandation {
        font-size: 27px;
    }

    .product-cosmetique .card-body {
        margin: 0 0px 45px;
    }

    .bloc-right-contact {
        margin: 0 25px;
    }

    .shop_cart {
        right: -58px;
    }

    .title-top {
        font-size: 32px;
    }

    h1.title-top {
        margin-bottom: 25px;
    }

    .title-right,
    .title-left {
        font-size: 17px;
    }

    section.inscrivez-vous.recherche .inscrivez-vous-description {
        padding: 45px 0px 45px 0;
    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        right: 36px;
    }

    #cart-block .input-group {
        width: 85%;
    }

    th.product-thumbnail {
        display: none;
    }

    .rounded-circle.faplus {
        padding: 0;
    }

    .rounded-circle.faminus {
        padding: 2px;
    }

    .quant-td {
        width: 32%;
    }
}





.select-box {
    position: relative;
    display: block;
    width: 13%;
    font-size: 15px;
    color: #60666d;
}

.select-box__current {
    position: relative;
    cursor: pointer;
    outline: none;
    width: 170px;
}

.select-box__current:focus+.select-box__list {
    opacity: 1;
    -webkit-animation-name: none;
    animation-name: none;
}

.select-box__current:focus+.select-box__list .select-box__option {
    cursor: pointer;
}

.select-box__current:focus .select-box__icon {
    transform: translateY(-50%) rotate(180deg);
}

.select-box__icon {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
    width: 11px !important;
    opacity: 1;
    transition: 0.2s ease;
    color: #000;
}

.select-box__value {
    display: flex;
}

.select-box__input {
    display: none;
}

.select-box__input:checked+.select-box__input-text {
    display: block;
}

.select-box__input-text {
    display: none;
    width: 100%;
    margin: 0;
    padding: 6px 15px;
    background-color: #f8f8f8;
    font-size: 15px !important;
}

.select-box__list {
    position: absolute;
    width: 100%;
    padding: 0;
    list-style: none;
    opacity: 0;
    -webkit-animation-name: HideList;
    animation-name: HideList;
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-timing-function: step-start;
    animation-timing-function: step-start;
    box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
}

.select-box__option {
    display: block;
    padding: 8px 15px;
    background-color: #fff;
    font-size: 14px;
    color: #000;
    position: relative;
    z-index: 3;
}

.select-box__option:hover,
.select-box__option:focus {
    color: #000;
    background-color: #f8f8f8;
}

@-webkit-keyframes HideList {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

@keyframes HideList {
    from {
        transform: scaleY(1);
    }

    to {
        transform: scaleY(0);
    }
}

.couleur-select {
    display: flex;
    margin-bottom: 19px;
}

span.select-title {
    font-size: 14px;
    padding: 0 12px 0 0;
}


@media (max-width:1600px) {
    .select-box {
        width: 18%;
    }
}

@media (max-width: 1200px) {
    .select-box {
        width: 21%;
    }
}

@media (max-width: 1199px) {
    .fond-de-tient-description button.btn-ajouter.ajouter {
        /* max-width: 257px; */
    }

    /*
    .small-image {
        max-width: 868px;
        max-height: 411px;
    } */

    img.small-image {
        margin-top: 120px;
    }

    img.small-image-right {
        margin-top: 120px;
    }

    .marque img.small-image {
        margin-top: 0px !important;
    }

    .marque img.small-image-right {
        margin-top: 0px !important;
    }

    .col-md-12.col-lg-6.col-xl-3.col-xxl-3.modify {
        display: none;
    }
}

@media (max-width: 991px) {
    .select-box {
        width: 12%;
    }
}

@media (max-width: 767px) {
    .select-box {
        width: 15%;
    }
}

@media (max-width: 600px) {
    .select-box {
        width: 19%;
    }
}

@media (max-width: 395px) {
    .select-box {
        width: 36%;
    }
}

div#cart-block form h4 {
    margin-bottom: 30px;
}

form label {
    padding-bottom: 7px;
    font-size: 15px;
}

h1.titre-chekout {
    font-size: 30px;
}

h3.titre-2-chekout {
    font-size: 24px;
}

/*****************************************************************/

/*****************Footer********************/
section.footer button {
    position: relative;
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 1em;
    background: #D80015;
    color: #ffffff;
    cursor: pointer;
    opacity: 1;
    outline: none;
    transition: opacity 0.35s ease-out, width 0.5s ease-out, background 0.25s ease-out;
    height: 40px;
    font-family: 'FoundersGrotesk';
    margin-top: 12px;
}

section.footer input::placeholder {
    font-size: 13px;
    padding-left: 4px;
}

section.footer form {
    position: relative;
    width: 282px;
}

section.footer input {
    height: 40px;
    width: 100%;
    background: transparent;
    border: none;
    padding: 0 7px;
    border: 1px solid #fff;
    color: #fff;
}

section.footer a {
    text-decoration: none;
    color: white;
}

.color-noir {
    color: black;
}


.footer-icons {
    position: fixed;
    bottom: 5%;
    right: 5px;
    z-index: 10;
    margin-bottom: 1px;
    margin-right: 0;
    display: block;
}

.footer-icons a {
    position: relative;
    margin-left: 0;
    display: block;
    color: #f33f38 !important;
    font-size: 24px;
    width: 38px;
    height: 38px;
    line-height: 38px;
    text-align: center;
}

.footer-icons a.messanger {

    color: #0e94c9 !important;
    margin-bottom: 2px;
}

.footer-icons a.whatsup {
    /* background: #25D366; */
    color: #25D366 !important;
}


/***********************************************************************************/

.nav-pageCategorie .active>.page-link,
.page-link.active {
    z-index: 3;
    color: var(--bs-pagination-active-color) !important;
    background-color: #e2c7ca;
    border-color: transparent;
    border-radius: 0px;
    border: 1px solid #6f6f6f;
    color: black;
}

.nav-pageCategorie .page-item:last-child .page-link {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.nav-pageCategorie nav {
    margin: 0 auto;
    display: block;
    /* width: 168px; */
}

.nav-pageCategorie a.page-link {
    color: black;
    margin: 0 10px;
    background-color: transparent;
}

.nav-pageCategorie .page-item:first-child .page-link {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.nav-pageCategorie .page-link:focus {
    z-index: 3;
    color: var(--bs-pagination-focus-color);
    background-color: transparent;
    outline: 0;
    box-shadow: none;
}





.product-detail-color input[type=radio] {
    display: none;
}

.product-detail-color {
    margin-bottom: 16px;
}

.product-detail-color label {
    display: inline-block;
    width: 28px;
    height: 28px;
    margin-right: 5px;
    cursor: pointer;
    position: relative;
}

.product-detail-color label:after {
    position: absolute;
    content: "";
    left: -4px;
    right: 0;
    bottom: -4px;
    border: 2px solid transparent;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    line-height: 42px;
    margin: auto;
    opacity: 0;
}

.product-detail-color input[type="radio"]:checked+label:after {
    opacity: 1;
    border: 2px solid #000;
}

.product-detail-color label span {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: transform 0.2s ease-in-out;
}


/* start page nos marque */
.col-xl-3.col-lg-4.col-md-6.col-sm-12.nos-marque {
    padding-top: 25px;
    padding-bottom: 25px;
}

.row.nos-marque {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 50px;
    padding-right: 20px;
    padding-left: 20px;
}


.logo-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

/* End page nos marque */




.select-product-detail {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 11px;
}

div.selector-area {
    box-sizing: border-box;
    padding: 10px 0;
    position: relative;
}

label.selector {
    box-sizing: border-box;
    display: block;
    padding: 13px 11px;
    width: 100%;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.5px;
    border: 1px solid #f3f2f2;
    color: #6c6c6c;
}

.option-show-value:after {
    position: absolute;
    display: block;
    content: "";
    width: 7px;
    height: 7px;
    top: 64px;
    right: 5%;
    border-bottom: 2px solid #6c6c6c;
    border-right: 2px solid #6c6c6c;
    border-radius: 1px;
    transform: rotate(45deg) translateY(-50%);
    transition: all 0.3s ease-in-out;
    transition-delay: 0.1s;
    transform-origin: 50% 0;
}

input.selector:checked+label.selector>.option-show-value:after {
    transform: rotate(-135deg) translateY(-50%) !important;
}

input.selector,
input.selector~.option-list {
    display: none;
}

input.selector:checked~.option-list {
    width: 100%;
    position: absolute;
    display: block;
    margin-top: 5px;
    background: #fff;
    z-index: 2;
    border: 1px solid #f3f2f2;
}

ul.option-list,
li.option {
    list-style: none;
    padding: 0;
}

li.option>label {
    display: block;
    padding: 9px 11px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 13.5px;
    color: #6c6c6c;
}

li.option:hover>label {
    background: rgba(255, 255, 255, .7);
    color: #000;
}

input.option-value,
span.option-show-value {
    display: none;
}

input.option-value:checked+.option-show-value {
    display: initial;
    vertical-align: middle;
}

.rs-connexion {
    display: table;
    margin: 23px auto 0;
}

.btn-fcb {
    color: #3b5998;
    background-image: linear-gradient(to bottom, transparent 20%, white 20%, white 93%, transparent 93%);
    font-size: 30px;
    padding: 0;
    border: 1px solid #bcbbbb;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    line-height: 45px;
    margin-right: 20px;
}

.btn-fcb:hover {
    color: #3b5998;
    background-image: linear-gradient(to bottom, transparent 20%, white 20%, white 93%, transparent 93%);
    border: 1px solid #bcbbbb;
}

.btn-google {
    background: conic-gradient(from -45deg, #ea4335 110deg, #4285f4 90deg 180deg, #34a853 180deg 270deg, #fbbc05 270deg) 73% 55%/150% 150% no-repeat;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
    font-size: 35px;
    padding: 0;
    /* border: 1px solid #bcbbbb; */
    border-radius: 50%;
    width: 45px;
    height: 45px;
    line-height: 45px;
}

/* .btn-google:hover {
    border: 1px solid #bcbbbb;
} */

a.btn.btn-top.btn-fcb {
    font-size: 37.5px !important;
    color: none;
}

.cart-vide {
    display: table;
    margin: 0 auto;
    padding: 50px 0;
    text-align: center;
}

.icon-cart-vide i {
    font-size: 30px;
    font-weight: 300;
    padding-bottom: 20px;
}

.cart-vide h3 {
    font-size: 30px;
    padding-bottom: 11px;
}

a.btn-panier-vide {
    background: #000;
    color: #fff;
    padding: 10px 30px;
    text-transform: uppercase;
    font-size: 13px;
    display: table;
    margin: 32px auto 0;
}

.shipping-cart {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-right: 25px;
    margin-top: 25px;
}

.shipping-cart-left {
    display: flex;
    gap: 20px;
}

.title-shipping-cart {
    font-size: 14px;
    text-transform: uppercase;
    color: #818181;
}

.contenu-shipping-cart p {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 11px;
}

.ref-shipping-cart {
    font-size: 14px;
    color: #b1b1b1;
}

.prix-shipping-cart span {
    display: block;
    color: #f00;
}

.prix-shipping-cart {
    font-size: 14px;
    font-weight: 500;
    text-align: right;
}

.btns-shipping-cart {
    text-align: right;
    margin-top: 12px;
    margin-right: 25px;
}

.btns-shipping-cart a {
    color: #000;
    font-size: 14px;
    font-weight: 600;
    margin-left: 40px;
}

.selector-titre {
    padding-bottom: 8px;
    font-size: 15px;
}

.stars .fa-star {
    color: #c4c4c4;
    font-size: 13px;
}

.stars .fa-star.gold {
    color: #ffc200;
}

.border-top.chechkout {
    border-top: none !important;
}

.condition-utilisation {
    text-align: justify;
}

.email-container {
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #dddddd;
}

.header {
    text-align: center;
}

.gift-card-image {
    display: block;
    margin: 0 auto;
    max-width: 100%;
    height: auto;
}

.content {
    margin: 20px 0;
}

.footer {
    margin-top: 20px;
    font-size: 12px;
    color: #888888;
    text-align: left;
}


.border-bottom.chechkout {
    border-top: none !important;
}



.gal-img-2 img {
    width: 100% !important;
}

.gal-img2-two {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 20px;
}

.description-application {
    font-size: 15px;
    line-height: 29px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

p.MsoNormal {
    font-size: 15px;
    line-height: 29px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

section.bloc2-app .content-img-application-one {
    text-align: center;
    margin: 0 auto;
    width: 100%;
    object-fit: cover;
}

section.bloc2-app .content-img-application-one {
    text-align: center;
    width: 100%;
    object-fit: cover;

}

.content-img-application-one {
    flex: 0 0 auto;
    width: 100px;
    margin-right: 20px;
}

.gal-img2-one {
    margin-bottom: 20px;
}

.gal-img2-three {
    margin-top: 20px;
}

.form-connexion .form-control {
    border: 1px solid #e2e2e2;
    padding: 8px 12px;
    margin-bottom: 14px !important;
}

div#cart-block .title-right {
    margin-bottom: 23px;
}

.field-mail {
    margin: 24px 0 29px;
}

section.footer p {
    font-size: 14px;
    font-family: "Century-Gothic-Std", "Century Gothic";
}




.img-app {
    margin-top: 16px;
    margin-bottom: 20px;
}

p.content-qrq {
    text-align: center;
}

.rating-review {
    display: inline-block;
    margin-bottom: 19px;
}

.star-review {
    float: left;
}

.star-review label {
    color: #c4c4c4;
    font-size: 7px;
    display: inline-block;
    float: right;
}

.form-avis {
    text-align: left;
    margin-top: 40px;
}

.star-review label:before {
    margin: 5px;
    font-size: 2em;
    font-family: FontAwesome;
    content: "\f005";
    display: inline-block;
}

.star-review input {
    display: none;
}

.star-review input:checked+label:hover,
.star-review input:checked~label:hover,
.star-review label:hover~input:checked~label,
.star-review input:checked~label:hover~label {
    color: #ffc200;
}

.star-review input:checked~label,
.star-review:not(:checked) label:hover,
.star-review:not(:checked) label:hover~label {
    color: #ffc200;
}

.rating-review span {
    display: block;
    font-size: 14px;
    padding-bottom: 3px;
}


.input_commentaire {
    border: 1px solid var(--c-grey-200);
    border-radius: 0 !important;
    height: 102px !important;
    padding: 7px 12px !important;
    width: 100%;
}

.btn-avis button {
    border: none;
    border-radius: 0;
    text-transform: uppercase;
    padding: 9px 23px;
    margin-top: 25px;
    font-size: 14px;
}

.title-avis {
    font-weight: 700;
    margin-bottom: 20px;
}

.comment-avis label {
    padding-bottom: 9px;
    font-size: 14px;
}

.input_commentaire:focus-visible {
    outline: none;
}

.timeline-item-wrapper {
    border: 1px solid var(--c-grey-200);
    padding: 25px;
    display: flex;
    gap: 14px;
}

.content-timeline {
    width: 100%;
}

.star-timeline i.gold {
    color: #ffc200;
}

.star-timeline i {
    font-size: 13px;
    color: #c4c4c4;
}

.descrp-timeline {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid var(--c-grey-200);
    padding-bottom: 9px;
}

.img-qrq {
    display: table;
    margin: 0 auto 13px;
}

section.politique {
    padding: 100px 100px 20px;
}

h3.titre-plitique {
    font-weight: 400;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    font-size: 25px;
    text-align: center;
    margin-bottom: 50px;
}

section.politique p {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    line-height: 27px;
    text-align: justify;
    margin-bottom: 27px;
}

section.politique h5 {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std";
    font-size: 21px;
    margin-bottom: 22px;
    margin-top: 40px;
    display: block;
}

section.politique ul {
    margin-bottom: 28px;
}

section.politique ul li {
    font-size: 15px;
    font-family: var(--Brand_title_fonts);
    font-weight: 400;
    color: var(--Heading_color);
    line-height: 27px;
    text-align: justify;
    margin-bottom: 8px;
}


@media(max-width: 1566px) {
    section.autonome .content-autonome-desc p {
        padding-top: 50px;
    }
}


/* blog section */
.blog-slider img {
    width: 100%;
    object-fit: cover;
    max-height: 300px;
}

.blog-section .slick-slide {
    margin: 0 10px;
}

.blog-section .slick-prev,
.blog-section .slick-next {
    color: #333;
    z-index: 1;
}

section.blog-section {
    margin-top: 50px;
    margin-left: 20px;
    margin-right: 20px;
}

.blog-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 20px;
}

.blog-section h2 {
    margin: 0;
    font-size: 2rem;
    font-weight: bold;
}

.Bon-plan-title {
    padding-bottom: 20px;
    font-family: 'Century-Gothic-Std';
    text-align: center;
    margin-top: 8px;
}

.brochure-image {
    max-width: 100%;
    height: auto;
    width: 50%;
    display: block;
    margin: 0 auto;
}


.collection_hiver {
    margin-top: 57px !important;
}

section.actualité-blogs {
    padding: 40px 0;
}



/* End section blog */


@media(max-width: 1366px) {
    section.autonome .content-autonome-desc h2 {
        top: 30px;
        margin-top: 20px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        top: 30px;
        margin-top: 20px;
        font-size: 26px;

    }



    section.autonome .content-autonome-desc p {
        /* padding-right: 40px !important; */
        font-family: 'Century-Gothic-Std';
    }

    section.autonome .content-autonome-desc {
        padding-top: 50px;
    }

    p.justified-text-modify {
        margin-bottom: 0px !important;
    }


    /* detail actualiteé */
    .description-actualite {
        text-align: justify;
        margin: 0 auto;
        /* Optional: to center the entire block */
        max-width: 800px;
        /* Optional: to limit the width of the text block */
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    .description-actualite p {
        margin-bottom: 15px;
        /* Optional: to add space between paragraphs */
        font-family: "Century-Gothic-Std", "Century Gothic";
    }

    .bloc-1-collection {
        display: flex;
        justify-content: center;
    }

    .bloc-1-collection {
        padding: 40px 0;
        text-align: center;
    }

    .content-bloc1-collection {
        width: 100%;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: center;
        padding-left: 50px;
        padding-right: 50px;
    }

    .centered-content {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        text-align: center;
    }

    .bloc-2-collection {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .video-bloc2-collection {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }


    .title-bloc1-collection {
        text-align: center;
        background: var(--grayLighten_color);
        font-family: "Century-Gothic-Std", "Century Gothic";
        color: black;
        margin: 0 30px;
        font-size: 19px;
        padding: 10px;
        text-transform: uppercase;
    }

    .container.adjust-conseil-container {
        max-width: 1226px;
    }

    .custom-card-conseil {
        width: 100%;
        margin: 0 auto;
        max-width: 400px;
        padding: 20px;
        box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    }





    /* .content-bloc1-collection {
        font-size: 20px;
        font-weight: 400;
        color: black;
        line-height: 30px;
        text-align: justify;
        max-width: 800px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .description-actualite {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 20px;
        font-weight: 400;
        color: black;
        justify-content: center;
        align-items: center;
    } */

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: auto;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }


}





/* ******************************Start responsive ***********************************************************************/
/*responsive home */

@media (min-width: 396px) and (max-width: 420px) {
    .sliderTop .slick-prev::before {
        left: -7px;
    }
}

@media (min-width: 500px) and (max-width: 700px) {
    .sliderTop .slick-prev::before {
        left: 40px;
    }
}

@media (min-width: 360px) and (max-width: 369px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 35px;
        bottom: 250px;
    } */

    .carousel-inner .slick-next::before {
        right: 50px;
        bottom: 217px;
    }
}

@media (min-width: 370px) and (max-width: 388px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 32px;
        bottom: 250px;
    }

    .carousel-inner .slick-next::before {
        right: 37px;
        bottom: 217px;
    }
}

@media (min-width: 389px) and (max-width: 400px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 32px;
        bottom: 220px;
    }

    .carousel-inner .slick-next::before {
        right: 25px;
        bottom: 187px;
    }
}

@media (min-width: 401px) and (max-width: 415px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 25px;
        bottom: 230px;
    }

    .carousel-inner .slick-next::before {
        right: 15px;
        bottom: 197px;
    }
}

@media (min-width: 416px) and (max-width: 435px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 18px;
        bottom: 150px;
    } */

    .carousel-inner .slick-next::before {
        right: 0px;
        bottom: 117px;
    }
}

@media (min-width: 436px) and (max-width: 470px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 12px;
        bottom: 140px;
    } */

    .carousel-inner .slick-next::before {
        right: -25px;
        bottom: 107px;
    }
}

@media (min-width: 471px) and (max-width: 505px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: 0px;
        bottom: 120px;
    }

    .carousel-inner .slick-next::before {
        right: -50px;
        bottom: 87px;
    }
}

@media (min-width: 505px) and (max-width:546px) {
    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 65px;
    }

    .carousel-inner .slick-next::before {
        right: -70px;
        bottom: 33px;
    }
}

@media (min-width: 547px) and (max-width:767px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 65px;
    } */

    .carousel-inner .slick-next::before {
        right: -70px;
        bottom: 33px;
    }

    div#carouselExampleCaptions1 button.slick-prev.slick-arrow {

        right: calc(50% - 120px) !important;
        transform: translateX(50%);
    }
}

@media (min-width: 551px) and (max-width: 767px) {
    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        bottom: 33px;
    } */

    /* div#carouselExampleCaptions1 button.slick-next.slick-arrow {
        right: calc(50% - 30px) !important;
        transform: translateX(50%);
    } */
    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 600px !important; */
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }

    section.autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -34px !important;
        font-weight: 300;
        left: -12px;
        background: url(../images/btnright.png) center no-repeat important;
        height: 12px !important;
        width: 60px;
        content: "";
    }


    section.collection.home .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 59px !important;
        width: 60px;
        content: "";
        top: 33px !important;
        left: 10px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }

    section.collection.home .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: #000000;
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 295px !important;
        width: 107px;
        content: "";
        top: -186px !important;
        left: 10px;
    }


    section.avis-clients {
        padding: 0px 0 50px 0;
        text-align: center;
        position: relative;
    }

    section.autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0 !important;
        left: -266px !important;
        font-weight: 300 !important;
        background: url(../images/btnleft.png) center no-repeat !important;
        height: 17px !important;
        width: 60px !important;
        content: "";
        top: -37px !important;
    }


    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 50px;
        z-index: 11111144;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
    }


    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 100px;
        width: 60px;
        content: "";
        top: -60px;
    }

    section.newsletter {
        padding: 30px 0 45px;
        text-align: center;
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -41px;
        font-weight: 300;
        width: 51px;
        height: 100px !important;
        background: url(../images/btnleft.png) center no-repeat;
        height: 84px;
        width: 60px;
        content: "";
        top: -24px;
    }

    .carousel-maquillage .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 42px;
        left: 33px;
    }


}

@media (min-width:551px) and (max-width:670px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 650px !important;
    }

}

@media (min-width:671px) and (max-width:725px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 670px !important;
    }
}

@media (min-width:618px) and (max-width:725px) {
    .carousel-inner .slick-next::before {
        right: -120px !important;
    }
}

@media (min-width:726px) and (max-width:767px) {
    .carousel-inner .slick-next::before {
        right: -150px !important;
    }
}

@media (min-width: 360px) and (max-width: 550px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: auto !important;
    }
}

@media (min-width: 481px) and (max-width: 501px) {
    section.collection .collection_hiver .content-img_collection {
        bottom: -250px
    }
}

@media (min-width: 502px) and (max-width: 550px) {
    section.collection .collection_hiver .content-img_collection {
        bottom: -270px
    }
}

@media (max-width: 395px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        font-size: 25px;
        padding-left: 0px;
    }
}

@media (min-width: 396px) and (max-width: 767px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        font-size: 27px !important;
        padding-left: 0px !important;
        top: 0px;
    }
}


@media (min-width: 396px) and (max-width:400px) {
    .mahassen-lives {
        margin-top: 300px !important;
    }
}

@media (min-width: 396px)and (max-width:767px) {
    section.mahassen-lives .mahassen-live-desc {
        margin-top: -150px;
    }

}

@media (min-width: 360px)and (max-width:400px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: -10px;
    }

    section.abonnez-vous {
        margin-top: 10px;
    }
}

@media (min-width: 400px)and (max-width:500px) {
    .abonnez-vous {
        margin-top: -100px !important;
    }

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .mahassen-lives .slick-list .item.shine .fancybox img {
        height: 400px;

    }
}

@media (min-width: 481px)and (max-width:767px) {
    section.collection .desc_collection {
        padding: 180px 0 0;
    }

    section.autonome .content-autonome .picture {
        height: 450px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        height: auto !important;
        object-fit: cover;
    }

    .carousel-innerMake .slick-prev {
        top: 10%;
    }

    .carousel-innerMake .slick-next {
        right: 5px;
        top: 35%;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 70px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: auto;

    }
}

@media (min-width: 501px)and (max-width:767px) {
    section.maquillage .content-autonome-desc h2 {
        margin-top: 50px;
    }
}

@media (min-width: 501px)and (max-width:530px) {
    .mahassen-lives {
        margin-top: 40px !important;
    }
}

@media (min-width: 531px)and (max-width:560px) {
    .mahassen-lives {
        margin-top: 20px !important;
    }

    .container-fluid.mahassen-lives-container {
        padding-top: 20px;
    }
}

/* @media (min-width: 561px)and (max-width:767px) {
    .mahassen-lives {
        margin-top: 0px !important;
    }
} */

@media (min-width: 501px)and (max-width:767px) {

    .abonnez-vous {
        margin-top: -20px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 50px;
    }

    .carte-mahassen.centre-m .col-md-12.col-lg-6 .content-carte-mahassen.carte-two .content-carte-one {
        display: flex;
        flex-direction: column;
    }

    .carte-mahassen.centre-m .col-md-12.col-lg-6 .content-carte-mahassen.carte-two .content-carte-one .content-img.shine {
        order: -1;
    }
}

@media (min-width: 545px)and (max-width:599px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: -40px;
    }
}

@media (min-width: 600px)and (max-width:767px) {

    section.mahassen-lives button.slick-next.slick-arrow,
    section.mahassen-lives button.slick-prev.slick-arrow {
        bottom: -40px;
    }

    .live-slider.slick-initialized.slick-slider .item {
        height: auto;
    }
}

@media (max-width: 569px) {

    .same-height {
        flex-direction: column;
        align-items: center;
    }

    .content-img-categorie3 {
        margin-bottom: 20px;
    }

    .same-height-img {
        width: 100%;
        height: auto;
    }
}



@media (min-width: 569px) and (max-width: 892px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }
}

@media (max-width: 852px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }
}


@media (max-width: 568px) {
    .contents-img {
        display: block;
    }

    .content-one {
        display: block;
        width: 100%;
    }

    .content-one-img {
        width: 100%;
        margin-bottom: 20px;
    }
}


@media (min-width: 501px) and (max-width:547px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;
        margin-top: -50px !important;
    }
}

@media (min-width: 548px)and (max-width:600px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;
        /* margin-top: 20px !important; */
    }
}

@media (min-width: 601px)and (max-width:767px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 0px !important;

    }
}

@media (min-width: 651px)and (max-width:767px) {
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        max-height: 700px !important;

    }
}

@media (min-width: 423px)and (max-width:430px) {
    /* .mahassen-lives {
        margin-top: 270px !important;
    } */
}

@media (min-width: 431px)and (max-width:445px) {
    /* .mahassen-lives {
        margin-top: 270px !important;
    } */
}

@media (min-width: 446px)and (max-width:461px) {
    /* .mahassen-lives {
        margin-top: 245px !important;
    } */
}

@media (min-width: 462px)and (max-width:480px) {
    /* .mahassen-lives {
        margin-top: 240px !important;
    } */
}

@media (min-width: 481px)and (max-width:495px) {
    /* .mahassen-lives {
        margin-top: 290px !important;
    } */
}

@media (min-width: 496px)and (max-width:500px) {
    .mahassen-lives {
        /* margin-top: 320px !important; */
    }
}

/*start responsive footer*/
@media (max-width:767px) {
    section.footer .footer-content {
        padding-left: 0px;
        display: block !important;
        text-align: center;
    }

    section.footer .footer-content .resp-footer {
        margin-top: 25px;
    }

    section.footer .footer-content span {
        line-height: 30px;
    }

    section.footer .footer-content div .maps.text-end {
        margin-top: 0px;
    }

    section.footer .align-items-center {
        justify-content: center;
    }

    .bi.bi-envelope {
        margin-bottom: -10px;
    }

    .flex-newsletter {
        display: flex;
        justify-content: center;
    }

    .footer-qrq .text-app {
        text-align: center;
    }

    .footer-qrq .img-app {
        text-align: center;
    }

    section.mahassen-lives .item::after {
        top: 35%;
    }

    section.footer {
        padding: 20px 25px 50px !important;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    .collection_hiver {
        margin-top: 0px !important;
    }

    .collection .container .collection_hiver {
        height: 530px !important;
    }
}

/*end responsive footer*/
@media (min-width:768px) and (max-width:991px) {

    section.collection .desc_collection h2,
    section.collection .desc_collection h4 {
        font-size: 24px;
    }

    .collection_hiver {
        margin-top: 0px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item img {
        height: 500px !important;
    }

    section.collection .collection_hiver .content-img_collection {
        bottom: 100px;
        left: 0px;
        height: auto !important;
        width: 45% !important;
    }

    /* .carousel-inner button.slick-next.slick-arrow {
        left: 285px;
        top: 529px;
    } */

    .carousel-inner .slick-prev::before {
        bottom: 117px;
        left: 0px;
    }

    .autonome {
        margin-top: -80px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 20px; */
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 45px;
    }

    .maquillage img.small-image {
        margin-top: 0px;
        max-width: 100%;
        max-height: 100%;
    }

    .maquillage img.small-image-right {
        margin-top: 0px;
        max-width: 100%;
        max-height: 100%;
    }

    section.maquillage {
        padding: 50px;
    }

    section.maquillage .content-video {
        display: flex;
        justify-content: center;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 50px;
    }

    section.nouveaute {
        padding: 100px 10px 70px;
    }

    section.nouveaute.Center-m {
        padding: 50px 10px 70px;
    }


    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    section.product-cosmetique {
        padding: 20px 0 20px;
    }

    section.mahassen-lives button.slick-prev.slick-arrow,
    section.mahassen-lives button.slick-next.slick-arrow {
        bottom: -40px;
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        top: 20px;
        bottom: 0;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - -30px) !important;
        transform: translateX(50%);
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(49% - 75px) !important;
        transform: translateX(100%);
    }

    section.avis-clients {
        padding: 20px 0 50px 0;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 50px;
    }

    .autonome .content-autonome .content-autonome-desc,
    .autonome .content-autonome .picture.shine.col-md-9 {
        width: 50%;
    }

    section.mahassen-lives {
        padding: 20px 73px 47px 30px;
    }

    section.newsletter {
        padding: 0px 0 45px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen .content-carte-one div span,
    .content-carte-mahassen.carte-two .content-carte-one div span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        text-align: justify;
        font-size: 15px !important;
    }

    .carte-mahassen .content-carte-one {
        display: flex;
        flex-direction: column;
    }

    .carte-mahassen .content-img.shine {
        order: -1;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        display: grid;
        grid-template-columns: auto 100px;
        padding-left: 0px;
        padding-top: 0px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        max-height: 750px;
    }

    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    .footer-qrq {
        padding-left: 50px;
        padding-top: 20px;
        display: block;
        text-align: center;
    }

    .footer-qrq .text-app {
        text-align: center;
    }

    .footer-qrq .img-app {
        text-align: center;
        margin-top: 35px !important;
    }

    .footer-qrq .flex-newsletter {
        display: flex;
        justify-content: center;
        margin-top: 30px;
    }

    section.autonome .content-autonome .picture img {
        height: 400px;
    }

}

@media (min-width:768px) and (max-width:991px) {
    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .fancybox img {
        width: 100%;
        object-fit: cover;
    }

    .maquillage.home .content-video {
        display: block;

    }

    .maquillage.home .row .col-md-12.modify {
        padding-right: calc(var(--bs-gutter-x)* .5);
        padding-left: calc(var(--bs-gutter-x)* .5);
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: auto !important;
    }

    section.maquillage.home .content-autonome-desc {
        padding-left: 0 !important;
        padding-top: 0 !important;
        margin-left: 0 !important;
    }

    section.maquillage.home .container-fluid.adjust-container-section-hammem-spa .col-md-4 {
        flex: 0 0 auto;
        width: 100%;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one {
        grid-template-columns: auto 100px !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-img.shine,
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        margin-bottom: 40px;
        max-height: 800px;
        width: 100% !important;
    }
}

@media (min-width:768px) and (max-width:825px) {
    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 45px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: auto;
        position: relative;
    }
}

@media (min-width:826px) and (max-width:991px) {
    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        padding-top: 110px;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 550px;
        position: relative;
    }
}

@media (min-width:992px) and (max-width:1023px) {
    .massage.coiffure.mah-Centre .carousel-maquillage button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -220px !important;
        left: -115px !important;
    }

    .carousel-inner .slick-prev::before {
        bottom: -65px;
        left: -25px;
    }

    .carousel-inner button.slick-next.slick-arrow {
        bottom: -98px;
        left: 280px;
    }

    .carousel-innerMake .slick-prev {
        right: 5px;
        top: 20%;
    }

    .carousel-innerMake .slick-next {
        top: 40%;
        right: 16px;
    }

    .carousel-item.shine .custom-caption {
        top: 60%;
    }

    section.footer .footer-content {
        grid-template-columns: repeat(4, 1fr);
        padding-left: 0px;
    }

    section.collection .desc_collection {
        padding: 70px 0 0 40px;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 20px 0 0 0px;
    }

    section.collection.mah-nouveaute.mah-Centre .col-md-2 {
        width: 40%;
    }

    section.collection.mah-nouveaute.mah-Centre .col-md-1 {
        width: 60%;
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        left: 90px !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        right: 30px !important;
    }

    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .carousel-inner .slick-prev::before {
        top: 50px;
    }

    .carousel-inner .slick-next::before {
        top: 150px;
    }

    .carousel-inner button.slick-next.slick-arrow {
        left: 290px;
        z-index: 3;
    }

    section.autonome.home .carousel-inner.product-page-acceuil button.slick-next.slick-arrow {
        left: 400px;
        z-index: 3;
    }

    section .autonome.home .product-maquillage-pro .carousel-inner button.slick-next.slick-arrow {
        left: 554px;
        z-index: 3;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 305px !important;
    }

    .carousel-innerMake .slick-prev {
        right: -2px;
        top: 20%;
    }

    .carousel-innerMake .slick-next {
        top: 40%;
        right: -7px;
    }

    .carousel-item.shine .custom-caption {
        top: 65%;
    }
}

@media (min-width:992px) and (max-width:1165px) {
    .container {
        max-width: 850px;
    }

    section.collection .collection_hiver .content-img_collection {
        left: -15px;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: 650px !important;
    }

    #carouselExampleCaptions1 .indicators .carousel-inner {
        overflow: initial;
    }



    .autonome {
        margin-top: 0px;
    }

    section.autonome .content-autonome {
        grid-template-columns: 55% 60%;
    }

    section.nouveaute {
        padding: 50px 10px 50px 10px;
    }

    .product-cosmetique .slick-next.slick-arrow {
        right: calc(50% - 92px) !important;
        transform: translateX(100%);
    }

    section.product-cosmetique .item .product-item .item-icons-left {
        bottom: 0;
        top: 20px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite span {
        margin-top: 400px;
    }

    .product-cosmetique .slick-prev.slick-arrow {
        right: calc(50% - 29px) !important;
        transform: translateX(50%);
    }

    .nouveaute .col-md-7,
    .nouveaute .col-md-5 {
        width: 50% !important;
    }

    section.maquillage {
        padding: 50px 0px;
    }

    img.small-image {
        margin-top: 0px;
    }

    img.small-image-right {
        margin-top: 0px;
    }

    .small-image {
        max-width: 100%;
        max-height: 100%;
    }

    .small-image-right {
        max-width: 100%;
        max-height: 100%;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 0px !important;
        margin-left: 0 !important;
        padding-left: 100px !important;
        margin-right: 0 !important;
        padding-right: 100px !important;

    }

    .mahassen-lives .col-lg-4 {
        width: 40%;
    }

    .mahassen-lives .col-lg-8 {
        width: 60%;
    }

    section.abonnez-vous {
        margin-top: 0;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-bottom: 0px !important;
    }

    section.abonnez-vous {
        padding: 10px 30px 10px;
    }

    .marque-abonnez section.abonnez-vous {
        padding: 0px 30px 10px;
    }

    .footer .container-fluid {
        display: flex;
    }

    section.footer .footer-content h3 {
        font-size: 13px;
        line-height: 25px;
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    section.footer .img-qrq img {
        width: 20%;
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .footer-qrq {
        padding: 0 0px 0px 10px;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .img-app img {
        width: 90px !important;
    }

    section.footer form {
        width: 200px;
    }

    section.footer .footer-content {
        gap: 20px;
        padding-left: 0px !important;
    }

    .resp-footer {
        width: 100%;
    }

    .flex-newsletter {
        display: flex;
        justify-content: center;
    }

    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }
}

@media (min-width:992px) and (max-width:1024px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 25px; */
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 80px !important;
    }

    section.autonome.home .content-autonome-desc {
        padding-left: 0px !important;
    }
}

@media (min-width:1025px) and (max-width:1199px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 50px; */
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 120px !important;
    }

    section.autonome .content-autonome .picture img {
        height: 450px !important;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
        padding-left: 80px !important;
    }

    section.autonome.home .content-autonome-desc {
        padding-left: 0px !important;
    }

}

@media (min-width:1200px) {
    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer .container-fluid {
        display: flex;
    }

    .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-qrq img {
        width: 20%;
    }

    section.footer .footer-content h3 {
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    .resp-footer.flex {
        width: 200px;
    }

    section.footer .img-qrq img {
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .flex-newsletter {
        justify-content: center;
        display: flex;
    }

    section.footer form {
        width: 220px;
    }

    .bi.bi-telephone {
        margin-top: 10px;
    }

    .bi.bi-envelope {
        margin-top: 20px;
    }

    .autonome {
        margin-top: -70px;
    }

}

@media (min-width: 350px) and (max-width: 639px) {
    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    /*
    .footer .container-fluid {
        display: flex;
    }*/
    .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-qrq img {
        width: 20%;
    }

    section.footer .footer-content h3 {
        white-space: nowrap;
    }

    section.footer .footer-content span {
        font-size: 12px;
    }

    /*
    .resp-footer.flex{
        width: 200px;
    }*/
    section.footer .img-qrq img {
        display: flex;
        justify-content: center;
    }

    section.footer .img-qrq {
        display: flex;
        justify-content: center;
    }

    .img-app,
    .text-app {
        text-align: center;
    }

    .flex-newsletter {
        justify-content: center;
        display: flex;
    }

    section.footer form {
        width: 220px;
    }

    .bi.bi-telephone {
        margin-top: 10px;
    }

    .bi.bi-envelope {
        margin-top: 2px;
    }

    .autonome {
        margin-top: -70px;
    }

    .autonome.home {
        margin-top: 0px !important;
    }



}


@media (min-width:1200px) and (max-width:1350px) {
    .autonome {
        margin-top: -70px;
    }

    .autonome.home {
        margin-top: 0px !important;
        margin-bottom: 30px !important;
    }

    .abonnez-vous {
        padding: 0px 30px 35px !important;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption p,
    section.autonome div#carouselExampleCaptions2 .carousel-caption h4 {
        font-size: 13px;
    }

}

@media (min-width:1400px) {
    .carousel-inner .slick-prev::before {
        /* left: -60px; */
    }

    .carousel-inner .slick-next::before {
        right: -60px;
    }

    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: -20px !important;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-next::before {
        right: 57px !important;
    } */

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 60px; */
        margin-top: -40px;
    }

}


@media (min-width:1567px) and (max-width:1800px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 120px !important; */

    }
}

@media (min-width:1800px) {
    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 148px !important; */

    }
}

@media (min-width:1677px) {
    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-top: 100px;
    }

    /* section.collection {
        padding-bottom: 300px !important;
    } */

    section.collection .collection_hiver .content-img_collection {
        bottom: -200px !important;
        left: -50px;
        height: 500px;
    }

    section.autonome {
        margin-right: 30px;
        margin-left: 30px;
        height: calc(70vh) !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome {
        display: grid;
        grid-template-columns: 59% 63%;
        position: relative;
    }

    section.autonome .content-autonome-desc {
        padding-top: 70px;
    }

    section.autonome .content-autonome .picture {
        height: 765px;
        margin-top: 20px;
    }

    section.autonome .content-autonome .picture img {
        height: 70%;
        width: 100%;
        max-width: 84%;
        object-fit: cover;
    }

    section.autonome div#carouselExampleCaptions2 {
        height: 725px;
        position: relative;
    }

    button.slick-prev.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    button.slick-next.slick-arrow {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .content-img {
        margin-bottom: 45px;
        max-height: 750px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-one {
        display: grid;
        grid-template-columns: auto 100px;
        padding-left: 65px;
        padding-top: 1px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-top: 35px;
        max-height: 750px;
    }


    .video-wrapper {
        display: flex;
    }

    section.abonnez-vous:not(.instagram) .item::after {
        display: none;
    }

    section.footer .footer-content {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 60px;
    }

    .footer .container-fluid {
        justify-content: center;
    }
}

@media (max-width:415px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        height: 450px;
    }
}

@media (min-width:416px) and (max-width:480px) {
    section.collection .collection_hiver div#carouselExampleCaptions1 {
        height: 550px;
    }

    section.collection .desc_collection {
        padding: 10px 0 0;
    }
}

@media (min-width: 551px) and (max-width:767px) {
    /* section.collection .collection_hiver .content-img_collection {
        bottom: -350px !important;
    } */

    section.collection .desc_collection {
        padding: 300px 0 0 !important;
    }
}

@media (min-width: 1677px) {
    section.maquillage.home {
        margin-top: 100px !important;
    }
}

/*start responsive page soin peau*/
@media (max-width: 500px) {
    .header-marketing {
        /* height: 150px; */
        position: relative;
    }

    .content_slider {
        padding: 0px;
    }

    .header-marketing img {
        width: 100%;
        height: auto;
        object-fit: initial;
    }


    section.collection.mah-nouveaute.maquillage {
        background: white;
        padding: 50px 5vw 65px;
    }

    section.collection.mah-nouveaute {
        position: relative;
        padding-left: 5vw;
        padding-right: 5vw;
    }

}

@media (min-width: 1024px) and (max-width: 1677px) {
    section.collection.mah-nouveaute.maquillage {
        padding: 40px 4vw;
    }

}

@media (min-width: 768px) and (max-width: 1024px) {
    section.collection.mah-nouveaute.maquillage {
        padding: 30px 4vw;
    }

    /* .col-lg-5, .col-lg-6 {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 20px;
    } */
    .desc_collection p {
        font-size: 16px;
    }




    .row.page-checkout {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: flex-start;
    }


    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -99px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: auto;
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 38px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    }

}

@media (max-width: 768px) {
    section.collection.mah-nouveaute.maquillage {
        padding: 20px 3vw;
    }

    .content-img-collection img,
    .spa img {
        width: 100%;
        height: auto;
    }

    .desc_collection p {
        font-size: 14px;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    .header-marketing {
        height: auto;
        position: relative;
    }

    .header-marketing img {
        width: 100%;
        height: 100%;
        object-fit: initial;
    }

}

@media (max-width: 767px) {
    section.collection .desc_collection .spa.maquillage {
        margin-top: -40px;
        height: 0 !important;
    }

    section.product-cosmetique.maquillage {
        padding: 20px 0px 20px 0px;
        margin-top: 15px !important;
        margin-bottom: 20px;
    }

    .product-slider-idees .slick-list .slick-slide {
        display: flex;
        justify-content: center;
    }

    .product-slider-idees .product-item.shine img {
        max-height: 300px !important;
    }

    section.collection .desc_collection .spa img {
        width: 100% !important;
    }

    section.collection.mah-nouveaute.maquillage .desc_collection {
        padding: 20px 0px 0px 0px !important;
    }


    .idees .product-slider-idees.slick-dotted .slick-prev:before {
        color: black;
        opacity: .99;
        font-size: 30px;
    }

    .idees.soin .product-slider-idees.slick-dotted .slick-prev:before {
        color: black;
        opacity: .99;
        font-size: 30px;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.lamarque::after {
        display: none;
    }

    .idees.soin .product-slider-idees.slick-dotted .slick-next:before {
        color: black;
        opacity: 0.99;
        font-size: 30px;
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -10px !important;
        font-weight: 300;
        /* background: url(../images/btnrright.png) center no-repeat; */
        height: 257px;
        width: 60px;
        content: "";
        top: inherit !important;
        background: url(../images/btnright.png) center no-repeat;
    }


    .idees .product-slider-idees.slick-dotted .slick-next:before {
        color: black;
        opacity: 0.99;
        font-size: 30px;
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 0px !important;
        font-weight: 300;
        /* background: url(../images/btnrright.png) center no-repeat; */
        height: 257px;
        width: 60px;
        content: "";
        top: inherit !important;
        background: url(../images/btnright.png) center no-repeat;
    }


}

@media (max-width: 435px) {
    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 0%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -10%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }

    /* .idees.soin .product-slider-idees.slick-dotted .slick-next {
        right: 0%;
        overflow: initial;
        z-index: 9999;
        top: 20%;
        width: 0;
    } */

    /* .idees.soin .product-slider-idees.slick-dotted .slick-prev {
        left: -10%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    } */
}

@media (min-width: 436px) and (max-width: 560px) {


    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -10%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }
}

@media (min-width: 561px) and (max-width: 767px) {
    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 0%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: -6%;
        overflow: initial;
        z-index: 9999;
        top: 35%;
        width: 0;
    }

    .row.page-checkout {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: flex-start;
    }
}

@media (max-width: 395px) {
    .mahassen-lives.soin {
        /* margin-top: -80px !important */
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -16px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 9px;
        width: 60px;
        content: "";
        top: inherit;
    }

    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 2px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 9px;
        width: 60px;
        content: "";
        top: inherit;
    }

    .autonome.home .carousel.slide .slick-prev::before{
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -29px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 1px;
    }

    .autonome.home .carousel.slide .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 12px;
        width: 60px;
        content: "";
        top: 0px;
    }
}

@media (min-width: 396px) and (max-width: 767px) {
    .mahassen-lives.soin {
        /* margin-top: -50px !important; */
        padding-bottom: 0px !important;
    }

    section.mahassen-lives .mahassen-live-desc {
        margin-top: 0px;
    }

    section.lamarque {
        padding-top: 20px !important;
    }

    .row.page-checkout {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: flex-start;
    }
}

@media (min-width:1201px) {
    .header-marketing.application .ban-app {
        top: 40%;
        right: 10%;
    }
}

@media (min-width:991px)and (max-width:1200px) {
    .header-marketing {
        height: auto;
        position: relative;
    }

    .header-marketing-desc.ban-app.application-beauty .name-app {

        margin-left: -50px;
    }

    .header-marketing-desc.ban-app.application-beauty .btn-app {
        margin: -40px 0 0;
        padding: 5px 2px;
        margin-left: -50px;

    }

    .header-marketing-desc.ban-app.application-beauty .logo-app img {
        margin-right: 25px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app {
        width: 70%;
    }

    .header-marketing-desc.ban-app.application-beauty {
        right: 10%;
        top: 40%;
    }
}

@media (min-width:768px)and (max-width:991px) {
    section.collection.mah-nouveaute.maquillage .content-img-collection {
        max-width: 100%;
    }

    section.product-cosmetique.maquillage {
        padding: 20px 0 20px 0px;
    }

    .idees .product-slider-idees.slick-dotted .slick-next {
        right: 50%;
        overflow: initial;
        z-index: 9999;
        width: 0;
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -8px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 8px;
    }


    section.product-cosmetique .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 8px;
    }

    .idees .product-slider-idees.slick-dotted .slick-prev {
        left: 40%;
        overflow: initial;
        z-index: 9999;
        TOP: 105%;
        width: 0;
    }

    .idees .product-slider-idees.slick-dotted .slick-next:before,
    .idees .product-slider-idees.slick-dotted .slick-prev:before {
        color: black;
        opacity: .99;
        font-size: 30px;
    }

    section.mahassen-lives.soin {
        margin-top: -50px;
    }

    section.lamarque {
        padding: 0px 35px !important;
        top: 0px;
        margin-top: 70px;
    }

    section.abonnez-vous {
        padding: 10px 30px 50px;

    }


    section.lamarque:after {
        display: none;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    section.newsletter.soin {
        padding-top: 100px;
    }

    .product-slider-idees.soin .product-item img {
        max-height: 400px !important;
    }
}

@media (min-width:992px) {
    .product-slider-idees.soin {
        display: flex;
        justify-content: center;
    }

    .lamarque .slick-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media (min-width:992px)and (max-width:1024px) {
    .mahassen-lives.soin {
        margin-top: -50px;
    }

}

/*End responsive page soin peau*/
/*Start responsive page bon plan*/
@media (min-width:767px) {
    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 {
        width: 50% !important;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-prev {
        left: -60px;
        top: 110%;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-next {
        top: 110%;
        right: 0;
    }

    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-prev::before,
    .sliders-section .container-fluid .sliders-wrapper.sliders .slider-container.col-md-6 .slick-next:before {
        opacity: .90;
        color: black;
    }

}

/*End responsive page bon plan*/
@media (min-width:1400px) and (max-width:1676px) {

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2,
    section.collection .desc_collection h2 {
        font-size: 28px !important;
    }
}

@media (min-width:1400px) {
    section.collection .desc_collection h2 {
        padding-bottom: 15px;
    }

    section.collection .desc_collection {
        padding: 100px 30px 0px 30px;
        display: grid;
        justify-content: start;
        align-content: baseline;
        gap: 40px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 16px !important;
        line-height: 32px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 16px !important;
        line-height: 32px;
        text-align: justify;
    }

}

@media (min-width:1400px) and (max-width:1500px) {
    section.autonome .content-autonome-desc p {
        padding-top: 20px !important;
        margin-bottom: 10px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
    }
}

@media (min-width:1500px) {
    section.autonome .content-autonome-desc p {
        padding-top: 20px !important;
        margin-bottom: 20px;

    }

    section.autonome .content-autonome-desc {
        padding-top: 100px !important;
    }

    .newsletter {
        margin-top: 50px;
    }
}

@media (min-width:1677px) {

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2,
    section.collection .desc_collection h2 {
        font-size: 32px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }

    section.collection .desc_collection a.decouvrir,
    section.autonome .content-autonome-desc a.decouvrir,
    section.maquillage .content-autonome-desc a.decouvrir,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute a.decouvrir,
    section.avis-clients a.decouvrir,
    section.bloc2-app.bloc2 .cont-description a.decouvrir,
    section.bloc3-app.bloc3 .cont-description a.decouvrir,
    section.mahassen-lives .mahassen-live-desc a.decouvrir,
    .cont-description a.decouvrir {
        font-size: 18px !important;
    }

    section.collection .desc_collection {
        padding: 50px 50px 0px 50px !important;
    }

    section.lamarque.soinPeau .cont-description-la {
        padding-top: 50px !important;
    }

    section.lamarque .cont-description {
        padding-top: 94px !important;
    }

    section.collection .desc_collection p {
        padding-top: 20px;
    }

    section.autonome .content-autonome-desc {
        padding-top: 120px !important;
    }

    section.autonome .content-autonome-desc p {
        padding-top: 60px !important;
        margin-bottom: 20px;
    }

    section.maquillage.home .small-image {
        max-width: 600px;
        max-height: 700px;
    }

    section.maquillage.home .small-image-right {
        max-width: 600px;
        max-height: 700px;
    }

    img.small-image {
        margin-top: 0px !important;
    }

    img.small-image-right {
        margin-top: 0px !important;
    }

    section.maquillage .content-autonome-desc {
        margin-top: 60px;
        padding-right: 50px;
        padding-left: 50px;
    }

    section.nouveaute {
        padding: 0px 35px 50px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 100px;
        max-height: 600px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-two .content-img {
        margin-bottom: 100px;
        max-height: 807px;
        width: 100%;
    }


    section.mahassen-lives .mahassen-live-desc {
        margin-top: 50px;
    }

    .autonome {
        margin-top: -120px !important;
    }
}

@media (min-width:1677px) and (min-width:1800px) {
    section.maquillage.home {
        margin-top: -100px !important;
    }
}



@media (min-width:1311px) and (max-width:1400px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: -30px !important;
    }
}

@media (min-width:1520px) and (max-width:1676px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: 30px !important;
    }
}

@media (min-width:1677px) {
    .autonome .shine .carousel-caption.custom-caption {
        margin-top: 50px !important;
    }
}

/*Start responsive page femme*/
@media(max-width:767px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 14px ;
        text-align: justify;
        line-height: 29px;
    }

    section.massage.coiffure .content-img img {
        object-fit: cover;
    }

    section.coiffure-hom {
        padding: 10px 10px 35px 10px;
    }

    section.coiffure-hom.marque {
        /* padding: 60px 35px 0px 35px; */
    }

    .massage.coiffure .row {
        display: flex;
        flex-direction: column;
    }

    .massage.coiffure .col-md-6 {
        width: 100%;
    }

    .massage.coiffure .col-md-6.order-md-2 {
        order: 1;
    }

    .massage.coiffure .col-md-6.order-md-1 {
        order: 2;
    }

    .cont-description-right {
        margin-top: 0px;
    }

    section.massage.coiffure .content-img {
        padding-right: 0px !important;
    }

    .massage.coiffure {
        padding: 0px 10px;
    }

    .brochure-homme .container-fluid .row.d-flex {
        flex-direction: column;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure {
        order: -1;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }


    .product-cosmetique.recomd {
        padding: 0px 20px 0px 20px !important;
    }

    section.product-cosmetique.recomd button.slick-next.slick-arrow,
    section.product-cosmetique.recomd button.slick-prev.slick-arrow {
        bottom: -10px !important;
    }

}

@media (min-width:500px) and (max-width:767px) {
    section.product-cosmetique.recomd {
        padding: 50px 20px 20px !important;
    }

    .row.page-checkout {
        display: flex;
        flex-direction: column-reverse;
        flex-wrap: nowrap;
        justify-content: center;
        align-items: flex-start;
    }
}

/* @media(min-width:531px) and (max-width:570px) {
    section.carte-mahassen.centre-m {
        padding: 50px 35px 20px;
    }
} */

@media (min-width: 768px) and (max-width: 1024px) {
    .abonnez-vous.instagram {
        margin-top: -40px !important;
    }
}

@media(min-width:571px) and (max-width:767px) {
    section.carte-mahassen.centre-m {
        padding: 50px 35px 20px;
    }
}

@media(min-width:360px) and (max-width:490px) {

    section.coiffure-hom::after,
    section.massage.coiffure.marque::before {
        height: 250px;
        top: 0px;
    }

}

@media(min-width:391px) and (max-width:500px) {

    section.coiffure-hom::after,
    section.massage.coiffure.marque::before {
        height: 277px;
        top: 0px;
    }


}

@media(min-width:360px) and (max-width:500px) {


    section.coiffure-hom.b2b::after {
        height: 250px;
        top: 45px;
    }

    section.massage.coiffure::before {
        height: 220px;
        top: -20px;
    }

    .massage.coiffure.mah-Centre::before {
        height: 420px;
        top: -5px;
    }

    .coiffure-hom img,
    .massage.coiffure img {
        /* height: 180px !important; */
    }

    .coiffure-hom.b2b img {
        height: 220px !important;
    }

    .massage.coiffure .hamam-img img {
        margin-right: -20px;
    }

    .massage.coiffure.marque .hamam-img img {
        margin-right: 0px;
    }

    section.product-cosmetique.recomd {
        padding: 50px 20px 20px !important;
        margin-bottom: 0px;
    }
}

@media (max-width: 480px) {

    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 97px;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 50px;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 50px;
    }
}

@media (min-width: 1025px) and (max-width: 1440px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    section.icons.page-la-marque {
        padding-bottom: 20px;
        padding-bottom: 50px 0;
    }

    section.icons {
        padding: 5px 0;
        text-align: center;
    }
}


@media(max-width:500px) {
    section.massage.coiffure .content-img {
        height: auto;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        padding-top: 0;
    }

    .header-marketing .header-marketing-icons {
        gap: 10px !important;
    }

    .header-marketing .header-marketing-icons a {
        gap: 10px !important;
        right: -165px;
        padding: 7px !important;
        font-size: 14px;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        margin-left: 0;
    }
}

@media(min-width:501px) and (max-width:767px) {
    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons {
        gap: 20px;
    }

    .header-marketing .header-marketing-icons a {
        gap: 13px;
        right: -190px;
        padding: 10px !important;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        margin-left: 0;
    }

    section.coiffure-hom::after {
        height: 365px;
        top: 45px;
    }

    section.massage.coiffure::before {
        height: 365px;
        top: -35px;
    }

    section.massage.coiffure.mah-Centre::before {
        height: 525px;
        top: -5px;
    }

    .coiffure-hom img,
    .massage.coiffure img {
        /* height: 300px !important; */
    }
}

@media(min-width:768px) and (max-width:991px) {

    section.massage.coiffure::before {
        height: 450px;
        top: 60px;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;

    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 50px !important;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        /* padding-top: 100px; */
        margin-left: 0px;
    }

    section.coiffure-hom::after {
        height: 450px;
        top: 60px;
    }

    .coiffure-hom .col-md-6 .cont-description p,
    .massage.coiffure .col-md-6 .cont-description p {
        margin-bottom: 0px;
    }

    section.massage.coiffure .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 100px !important;
    }

    .massage.coiffure .hamam-img .content-img {

        height: 0px !important;
    }

    .massage.coiffure.b2b-marque .hamam-img .content-img {

        height: auto !important;
    }

    .massage.coiffure.b2b-marque .hamam-img .content-img {

        height: auto !important;
    }

    section.product-cosmetique.recomd {
        padding: 36px 20px 20px !important;
    }
}

@media (min-width:992px) and (max-width:1024px) {
    section.massage.coiffure::before {
        height: 450px;
        top: 60px;
    }
}

@media (min-width:992px) and (max-width:1200px) {

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;
        max-width: none !important;

    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }



    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        padding-top: 70px;
        margin-left: 0px;
    }

    section.coiffure-hom::after {
        height: 450px;
        top: 60px;
    }

    section.coiffure-hom.marque.block::after {
        height: 500px;
        top: 0px;
    }

    .coiffure-hom .col-md-6 .cont-description p,
    .massage.coiffure .col-md-6 .cont-description p {
        margin-bottom: 0px;
    }

    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 15px;
        text-align: justify;
        line-height: 29px;
        /* padding-right: 20px; */
    }

    section.massage.coiffure .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 85px !important;
    }

    section.massage.coiffure.b2b-marque .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 0 !important;
    }

    section.massage.coiffure.b2b-marque .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 0 !important;
    }

    .massage.coiffure .hamam-img .content-img {
        height: 0px !important;
    }

    .massage.coiffure.marque .hamam-img .content-img {
        height: auto !important;
    }

    section.product-cosmetique.recomd {
        padding: 0px 20px 20px !important;
    }
}

@media (min-width:911px) and (max-width:939px) {
    section.brochure-homme {
        margin-top: 30px;
    }
}

@media (min-width:940px) and (max-width:1058px) {
    section.brochure-homme {
        margin-top: 60px;
    }
}

@media (min-width:1059px) and (max-width:1200px) {
    section.brochure-homme {
        margin-top: 90px;
    }
}

@media (min-width:1201px) and (max-width:1399px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;
        max-width: none !important;
    }
}

@media (min-width:1400px) {
    .content-img.brochure img {
        top: 0px !important;
        width: 500px !important;
        max-width: none !important;
    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 16px !important;
        text-align: justify;
        line-height: 32px;
    }
}

@media (min-width:1677px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2 {
        font-size: 32px !important;
    }

    .massage.coiffure .hamam-img .content-img {
        margin-right: 0px !important;
        padding-right: 0px !important;
    }
}

@media (min-width:1201px) and (max-width:1676px) {

    section.brochure-homme {
        margin-top: 90px;
    }

    section.abonnez-vous.instagram {
        padding: 0px 30px 0px !important;

    }
}

@media (min-width:1200px) and (max-width:1325px) {

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 20px !important;
    }

    /* .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description-right {
        margin-top: 20px !important;
    } */

    section.coiffure-hom::after {
        top: 20px;
        height: 490px;
    }

    section.massage.coiffure::before {
        height: 490px;
        top: 30px;
    }
}

@media (min-width:1326px) and (max-width:1450px) {

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        /* margin-top: 50px !important; */
    }

    section.coiffure-hom::after {
        top: 20px;
        height: 530px;
    }

    section.massage.coiffure::before {
        height: 520px;
        top: 30px;
    }
}

@media (min-width: 1201px) and (max-width: 1676px) {
    section.abonnez-vous.instagram {
        padding: 50px 30px 0px !important;
    }
}

@media (min-width:1450px) and (max-width:1580px) {
    section.coiffure-hom::after {
        top: 50px;
        height: auto;
    }

    .coiffure-hom.b2b-marque::after {
        top: 0;
        height: auto;
    }

    .coiffure-hom.b2b-marque::after {
        top: 0;
        height: auto;
    }

    section.massage.coiffure::before {
        height: 550px;
        top: 50px;
    }

    .brochure-homme .decouvrir {
        font-size: 16px !important;
    }

    section.brochure-homme {
        margin-top: 125px;
    }

    .coiffure-hom .col-md-6 .cont-description {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 90px !important;
    }

    .massage.coiffure .content-img img {
        height: 450px !important;
    }

}

@media (min-width:768px) {
    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }
}

@media (max-width:395px) {
    .abonnez-vous.instagram.soin {
        margin-top: -200px !important;
    }
}

@media (min-width:396px) and (max-width:399px) {
    .abonnez-vous.instagram.soin {
        margin-top: -160px !important;
    }
}

@media (min-width:1581px) {

    .massage.coiffure .content-img img,
    .coiffure-hom .content-img-left img {
        height: 450px !important;
        object-fit: cover;
    }

    .massage.coiffure .content-img-la-marque img,
    .coiffure-hom .content-img-left img {
        /* height: 450px !important; */
        object-fit: cover;
    }

    section.coiffure-hom::after {
        top: 50px;
        height: auto;
    }

    section.massage.coiffure::before {
        height: 550px;
        top: 50px;
    }

    .brochure-homme .decouvrir {
        font-size: 18px !important;
    }

    section.brochure-homme {
        margin-top: 125px;
    }

    .coiffure-hom .col-md-6 .cont-description {
        margin-top: 60px !important;
    }

    .coiffure-hom .col-md-6 .cont-description-right {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 90px !important;
    }

    .coiffure-hom .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }

    .coiffure-hom .cont-description-right {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }


    .coiffure-hom .col-md-6 .cont-description-right {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description-right {
        margin-top: 90px !important;
        width: 85%;
        padding-left: 20px;
    }

    .coiffure-hom .cont-description-right {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-size: 18px !important;
        text-align: justify;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 18px !important;
    }

    section.massage .hamam-img {
        position: relative;
        left: 13px;
        top: 43px;
    }

    .massage.coiffure .hamam-img .content-img {
        margin-right: 0px;
        padding-right: 0px;
    }
}


/*End responsive page femme*/
/*star responsive maquiallage pro*/
@media (max-width:767px) {
    .collection.mah-nouveaute.maquillage.pro .content-img.shine {
        height: 330px;
    }

    .collection.mah-nouveaute.maquillage.pro p {
        text-align: justify;
    }

    section.collection.mah-nouveaute.maquillage.pro .desc_collection .spa.maquillage {
        margin-top: 0px;
        height: 0 !important;
        margin-bottom: 80px;
    }

}

@media (max-width:500px) {
    .product-cosmetique.recomd.pro .btn-ajouter.ajouter.shine {
        font-size: 12px !important;
        padding: 0px !important;
    }
}

@media (min-width:501px) and (max-width:767px) {
    .product-cosmetique.recomd.pro .btn-ajouter.ajouter.shine {
        height: 40px !important;
        font-size: 12px !important;
        padding: 0px !important;
    }
}

/*end responsive maquiallage pro*/
/*Start responsive page marque*/
@media (min-width:768px) and (max-width:1024px) {

    section.abonnez-vous.marque,
    .marque-abonnez .abonnez-vous.instagram {
        padding: 10px 50px;
    }
}

/*End responsive page marque*/


/*Start responsive page programmeFidelité*/
@media (max-width:395px) {
    .content_slider .header-marketing .header-marketing-desc p {
        font-size: 14px;
    }
}

@media (max-width:767px) {
    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 {
        padding: 0px 35px 10px 35px;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    section.bloc2-app.bloc2 .cont-description h2 {
        font-size: 22px;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .cont-description h2 {
        font-size: 22px;
    }

    section.bloc3-app.bloc3 {
        padding: 0px 35px 0px 35px;
    }

    .carte-mahassen.centre-m.fidelité {
        padding: 50px 0 0px;
    }
}

@media (min-width:768px) and (max-width:975px) {

    .bloc2-app.bloc2 .col-md-6,
    .bloc3-app.bloc3 .col-md-6 {
        width: 100%;
    }

    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 40px;
    }

    .bloc2-app.bloc2 .cont-description {
        margin-top: 0px;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .row {
        display: flex;
        flex-direction: column;
    }

    section.bloc3-app.bloc3 .row .col-md-6.flex {
        order: 2;
    }
}

@media (min-width:976px) and (max-width:1024px) {
    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 0;
    }

    section.bloc2-app.bloc2 .col-md-6.order-md-2,
    section.bloc3-app.bloc3 .col-md-6 {
        display: flex;
        align-items: center;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .content-img-left IMG {
        width: 100%;
    }

    section.bloc3-app.bloc3 {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    section.bloc3-app.bloc3 .content-img-left {
        margin-left: 0;
        padding-top: 40px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0px;
    }

    .bloc3-app.bloc3 .col-md-6 {
        padding-left: 30px;

    }

}

@media(min-width: 1200px) and (max-width: 1676px) {
    .bloc2-app.bloc2 .cont-description {
        width: 100%;
        padding-right: 15px !important;
    }

    .bloc3-app.bloc3 .cont-description {
        width: 100%;
        padding-left: 50px !important;
        padding-right: 20px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0;
    }
}

@media(min-width: 1677px) {
    .bloc2-app.bloc2 .cont-description {
        width: 100%;
        padding-right: 50px !important;
    }

    .bloc3-app.bloc3 .cont-description {
        width: 100%;
        padding-left: 50px !important;
        padding-right: 20px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0;
    }

    section.bloc3-app.bloc3 .content-img-left {
        margin-left: 0;
    }
}

/*End responsive page programmeFidelité*/
/* start responsive catalogue produit */
@media (max-width: 1195px) and (min-width: 933px) {
    .filter .card-footer button {
        padding: 8px 20px;
        font-size: 13px;
        width: auto;
    }
}

/* End responsive catalogue produit */

/* start responsive page nos marque */
@media (max-width: 768px) {
    .col-xl-3.col-lg-4.col-md-6.col-sm-12.nos-marque {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .row.nos-marque {
        padding-bottom: 30px;
    }

    .logo-item {
        width: 100%;
        text-align: center;
    }

    .img-logo-item img,
    .img-logo-item video {
        max-width: 100%;
        height: auto;
    }

    .logo-desc p {
        font-size: 12px;
    }
}

@media (max-width: 992px) {
    .col-lg-3.col-md-4.col-sm-6.col-xs-12.nos-marque {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}



@media (max-width: 852px) and (min-width: 569px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }

    section.fond-de-tient-details .contents-img .content-one {
        display: flex;
        gap: 20px;
    }

    section.fond-de-tient-details .contents-img .content-one {
        flex-direction: row;
        gap: 20px;

    }
}

@media (max-width: 933px) {
    .ul-nav-n2 {
        left: unset !important;
    }
}


@media (max-width: 568px) {
    .contents-img {
        display: block;
    }

    .content-one {
        display: block;
        width: 100%;
    }

    .content-one-img {
        width: 100%;
        margin-bottom: 20px;
    }
}


/*End responsive page B2B*/

/*Start responsive page Fidelité-B2B*/
@media (max-width:767px) {

    .bloc1-app.fidelité-b2b span,
    .bloc2-app-btb.fidelité-b2b .cont-description div {
        font-size: 15px !important;
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb .content-img {
        padding-right: 0px;
    }

    .carte-mahassen.centre-m.b2b {
        padding: 0;
    }

    section.bloc3-app-btb.fidelité-b2b {

        padding: 0 35px;
    }

    .catalogBloc.actualitéBloc::after {
        width: 45% !important;
        height: 35%;
    }
}

@media (min-width:768px) and (max-width:1024px) {

    .bloc2-app-btb.fidelité-b2b .col-md-6,
    .bloc3-app-btb.fidelité-b2b .col-md-6 {
        width: 100%;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    .bloc3-app-btb.fidelité-b2b .row {
        display: flex;
        flex-direction: column;
    }

    .bloc3-app-btb.fidelité-b2b .row .col-md-6.order-md-1 {
        order: -1 !important;
    }

    section.bloc3-app-btb.fidelité-b2b {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1667px) {

    section.bloc3-app-btb.fidelité-b2b .cont-description,
    section.bloc2-app-btb.fidelité-b2b .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
        margin-top: 50px;

    }

}

/*End responsive page Fidelité-B2B*/
/*Start responsive page Panier*/
@media (max-width:767px) {
    .cart-recomm {
        margin-bottom: 50px;
    }
}

@media (max-width:500px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 12px;
        white-space: nowrap;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 12px;
        line-height: 18px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }

    .bloc-carte .px-3 {
        padding-right: 7px !important;
        padding-left: 7px !important;
    }
}

@media (min-width:400px) {
    .d-none {
        display: table-cell !important;
    }

}

@media (min-width:500px)and (max-width:767px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 14px;
        white-space: nowrap;
    }

    .bloc-carte .img-product-carte {
        max-width: 80px;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 14px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }
}

@media (min-width:768px)and (max-width:1024px) {

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 15px;
        text-align: left;

    }

    .block-cart .d-md-flex {
        display: block !important;
    }

    th.product-remove {
        white-space: nowrap;
    }

    .btn-carte.d-block {
        display: block !important;
    }

}

@media (min-width:1025px)and (max-width:1200px) {
    .border.rounded-pill-shape.py-1.px-3 {

        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .table>:not(caption)>*>* {
        padding: .5rem .2rem;
    }

    .bloc-carte th.product-remove {
        white-space: nowrap;
    }
}

/*End responsive page Panier*/
/*Start responsive page centre mahassen*/

/*End responsive page centre mahassen*/
/* End responsive page nos marque */





/*End responsive page Actualité*/
/*start responsive page B2B*/

@media (max-width:767px) {
    .catalogBloc.actualitéBloc p.cont-description-b2b {
        padding-top: 20px;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding: 0px 0 40px;
        margin-top: 0px !important;
    }

    .product-cosmetique.recomd.b2b {
        padding: 40px 20px 20px 20px !important;
    }

    .coiffure-hom.b2b .cont-description,
    .coiffure-hom.b2b .cont-description p {
        text-align: center;

    }

    .coiffure-hom.b2b .detail-contact {
        margin-left: 0;
    }

    .coiffure-hom.b2b .image.mail {
        height: auto !important;
    }

    .coiffure-hom.b2b .color-noir {
        margin-bottom: 0 !important;
        font-size: 16px;
    }

    .brochure-homme.b2b .brochure-image {
        width: 100%;
    }

    .coiffure-hom.b2b .detail-contact {
        display: inline-block;
        width: 100%;
        margin-top: 0;
    }

    .coiffure-hom.b2b .image.phone {
        height: auto !important;
    }

    .coiffure-hom.b2b .bloc-right-contact {
        margin: 0;
        margin-top: 70px;
    }

    .coiffure-hom.b2b .icons-detail-contact {
        display: flex;
        justify-content: center;
    }

    .coiffure-hom.b2b .rs-contact .icons-detail-contact img {
        height: auto !important;
    }

    .coiffure-hom.b2b .detail-socialmedia {
        margin-top: 20px;
        margin-left: 0;

    }

    .coiffure-hom.b2b .detail-socialmedia p,
    .coiffure-hom.b2b .detail-socialmedia .rs-contact {
        display: flex;
        justify-content: center;
    }

    section.newsletter.b2b {
        padding: 50px 0 50px !important;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    section.catalogBloc.actualitéBloc:after {
        width: 45%;
        height: 35%;
    }

    .catalogBloc.actualitéBloc .cont-description-b2b {
        margin-top: 100px;
    }

    .brochure-homme.b2b .brochure-image {
        width: 100%;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding-top: 0 !important;
        margin-top: 0px !important;
    }

    section.product-cosmetique.recomd.b2b {
        padding: 50px 20px 20px !important;
    }

    .coiffure-hom.b2b .col-md-4 {
        width: 50%;
    }

    section.coiffure-hom.b2b::after {
        height: 400px;
        top: 110px;
    }

    section.coiffure-hom.b2b .col-md-6 .bloc-right-contact {
        margin: 0 40px;
        padding-left: 50px;
    }

    section.coiffure-hom.b2b .detail-contact {
        display: inline-block;
        margin-left: 0;

    }

    section.coiffure-hom.b2b .detail-socialmedia {
        margin-left: 0;
    }

    .coiffure-hom.b2b .col-md-6 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .client-b2b.Article {
        padding: 30px 0;
    }

    .newsletter.b2b {
        padding-top: 20px;
    }

    section.coiffure-hom.b2b .content-img {
        padding-top: 75px;
    }

    section.coiffure-hom.b2b .color-noir {
        font-size: 16px;
    }

    section.coiffure-hom.b2b .content-img img {
        width: 370px;
        height: 350px;
    }

    section.icons.b2b {
        padding: 0;
    }
}




/*End responsive page B2B*/

/*Start responsive page Fidelité-B2B*/
@media (max-width:767px) {

    .bloc1-app.fidelité-b2b span,
    .bloc2-app-btb.fidelité-b2b .cont-description div {
        font-size: 15px !important;
        font-family: "Century-Gothic-Std", "Century Gothic" !important;

    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb .content-img {
        padding-right: 0px;
    }

    .carte-mahassen.centre-m.b2b {
        padding: 0;
    }

    section.bloc3-app-btb.fidelité-b2b {

        padding: 0 35px;
    }
}

@media (min-width:768px) and (max-width:1024px) {

    .bloc2-app-btb.fidelité-b2b .col-md-6,
    .bloc3-app-btb.fidelité-b2b .col-md-6 {
        width: 100%;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    .bloc3-app-btb.fidelité-b2b .row {
        display: flex;
        flex-direction: column;
    }

    .bloc3-app-btb.fidelité-b2b .row .col-md-6.order-md-1 {
        order: -1 !important;
    }

    section.bloc3-app-btb.fidelité-b2b {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1667px) {

    section.bloc3-app-btb.fidelité-b2b .cont-description,
    section.bloc2-app-btb.fidelité-b2b .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
        margin-top: 50px;

    }

}

/*End responsive page Fidelité-B2B*/
/*Start responsive page Panier*/
@media (max-width:767px) {
    .cart-recomm {
        margin-bottom: 50px;
    }
}

@media (max-width:500px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 12px;
        white-space: nowrap;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 12px;
        line-height: 18px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }

    .bloc-carte .px-3 {
        padding-right: 7px !important;
        padding-left: 7px !important;
    }
}

@media (min-width:400px) {
    .d-none {
        display: table-cell !important;
    }

}

@media (min-width:500px)and (max-width:767px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 14px;
        white-space: nowrap;
    }

    .bloc-carte .img-product-carte {
        max-width: 80px;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 14px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }
}

@media (min-width:768px)and (max-width:1024px) {

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 15px;
        text-align: left;

    }

    .block-cart .d-md-flex {
        display: block !important;
    }

    th.product-remove {
        white-space: nowrap;
    }

    .btn-carte.d-block {
        display: block !important;
    }

}

@media (min-width:1025px)and (max-width:1200px) {
    .border.rounded-pill-shape.py-1.px-3 {

        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .table>:not(caption)>*>* {
        padding: .5rem .2rem;
    }

    .bloc-carte th.product-remove {
        white-space: nowrap;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .close-carte,
    .set-aside {
        height: 35px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

/*End responsive page Panier*/
/*Start responsive page centre mahassen*/
@media (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        text-align: justify;
    }

    section.hamam.mah-Centre {
        padding: 0px;
        margin: 0;
        padding-top: 40px !important;
    }

    section.hamam.mah-Centre .cont-description {
        margin-top: 150px;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        bottom: -30%;
    }

    section.massage.mah-Centre:after {
        height: 420px;
        top: 0px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -200px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        bottom: 51px;
        left: 30px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100% !important;
    }

    .esthetique-home.mah-Centre .slick-list {
        padding-top: 20px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {

        width: 100%;
    }

    section.esthetique-home.mah-Centre {
        padding: 35px 0 35px;
    }

    /* .Avis-mah-Centre section.avis-clients {
        margin-top: 150px;
        padding: 0 0 70px 0;
    } */

    section.esthetique-home.mah-Centre .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 40px;
        width: 60px;
        content: "";
    }

    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .esthetique-home.mah-Centre .content-slider-home .slick-list .slick-slide .slider__item .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre .slick-prev:before {
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 104px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 40px;
        width: 60px;
        content: "";
        z-index: 9999;
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 290px;
        width: 290px;
    }

}

@media(min-width:483px) and (max-width:767px) {
    section.massage.mah-Centre {
        padding: 0 !important;
    }
}

@media(min-width:501px) and (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0px;
    }
}

@media(max-width:551px) {
    .massage.coiffure.mah-Centre .carousel-item img {
        height: 350px !important;
    }

    .massage.mah-Centre .carousel-item.shine img {
        height: 350px;
        width: 100%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 55%;
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        position: absolute;
        right: 0;
        z-index: 9999;
        height: 220px;
        width: 220px;
        top: -145px;
        left: auto;
    }
}

@media(min-width:551px) and (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0 !important;
    }

    .massage.coiffure.mah-Centre .carousel-item img {
        height: 450px !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -260px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        bottom: 20px;
    }

    .massage.mah-Centre .carousel-item.shine img {
        height: 500px;
        width: 100%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 50%;
        margin-bottom: 15px;
    }
}

@media(min-width:601px) and (max-width:991px) {
    .content-imgMahassen {
        width: 90%;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 50%;

    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        width: 500px;
        position: absolute;
        height: 250px;
        bottom: -70px;
        right: -270px;
        left: auto;
    }

    .hamam.mah-Centre .col-md-6 {
        width: 35%;
    }

    .massage.mah-Centre .carousel.slide img {
        height: 400px;
        margin-bottom: 20px;
    }

    section.massage.coiffure.mah-Centre::before {
        height: 100% !important;
        top: 0 !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -265px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 0;
    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -20px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -20px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 100px;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -50px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -20px !important;
    }
}

@media(min-width:1025px) and (max-width:1200px) {
    section.collection.mah-Centre .desc_collection {
        padding: 20px 0 0 40px;
    }

    section.hamam.mah-Centre .hamam-img {
        position: relative;
        top: 6%;
        right: 0;
        bottom: 0;
        left: -70px;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        width: 300px;
        position: absolute;
        height: 300px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    .hamam.mah-Centre .col-md-6.order-col .cont-description {
        width: 80%;
    }

    section.massage.mah-Centre {
        padding: 150px 50px;
    }

    section.massage.mah-Centre .slick-list img {
        height: 450px;
    }

    .massage.mah-Centre::after {
        height: 600px;
        top: 100px;
    }

    .massage.mah-Centre .col-md-6.flex {
        display: flex;
        align-items: center;
    }

    .massage.mah-Centre .col-md-6.flex .cont-description {

        margin-top: 0;
    }

    section.massage.coiffure.mah-Centre {
        padding: 0px 50px;
    }

    .massage.coiffure.mah-Centre .col-md-6.order-md-1 {
        display: flex;
        align-items: center;
    }

    section.massage.coiffure::before {
        height: auto;
        top: 0px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;
    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 0;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 50px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -90px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -50px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -90px !important;
    }
}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.collection.mah-Centre .desc_collection {
        padding: 20px 40px 0 40px;

    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 50px !important;
    }
}

@media (min-width: 1676px) {
    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 170px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 250px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;
    }

    section.collection.mah-Centre .desc_collection {
        padding: 50px 40px 0 40px !important;
        display: flex;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 80%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        right: 0;
        left: 60%;
        bottom: -20%;
    }

    section.collection.mah-Centre {
        padding-bottom: 50px !important;
    }

    .hamam.mah-Centre .col-md-6.order-col .cont-description {
        width: 80%;
    }

    section.hamam.mah-Centre {
        padding: 50px 35px 50px;

    }

    section.massage.coiffure.mah-Centre::before {
        height: 100% !important;
        top: 0px !important;

    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;

    }

    .content-imgMahassen {
        width: 100%;
    }

    .massage.mah-Centre .col-md-6.flex {
        display: flex;
        align-items: center;
    }

    .massage.mah-Centre .col-md-6.flex .cont-description {
        width: 60%;
        margin-top: 0px;
    }

    .massage.coiffure.mah-Centre img {
        height: 600px;
    }

}

/*End responsive page centre mahassen*/
/*start responsive page Bon plan*/
@media (min-width: 1200px) and (max-width: 1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
        left: 10px;
    }
}

@media (min-width: 1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: auto;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width:767px) {
    .bonplan.coiffure.centre .cont-description {
        margin-top: 0px;
    }

    .bonplan.coiffure.centre {
        height: auto;
    }

    .bonPlan-img.centre {
        padding: 10px 20px 0px 20px;
    }

    .col-md-4.bonplan-col4.centre h2,
    .bonPlan-img-section-bottom.centre h2 {
        font-size: 18px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
    }

    /*
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider button.slick-next.slick-arrow {
        left: 0 !important;
    }*/

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
        left: -15px;
    }

    /*
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        right: calc(50% - 30px) !important;
        transform: translateX(100%);

    }*/

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev {
        right: calc(50% - -30px) !important;
        transform: translateX(50%);
    }

    .icons-bonPlan {
        padding-top: 30px;
    }

    .bonPlan-img-section-bottom img {
        width: 100%;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .bonplan.coiffure.centre .col-md-6.order-md-1 {
        width: 100%;
    }

    .bonplan.coiffure.centre .col-md-6.order-md-2.d-flex.align-items-start.custom-gap-reduction {
        width: 100% !important;
    }

    section.bonplan.coiffure.centre {
        height: auto;
        padding: 50px 60px 35px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 0px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -56px;
        left: 10px;
    }

    .bonPlan-img-section-bottom.centre {
        padding: 30px 35px 0px 50px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        left: 206px !important;
        top: 298px !important;
    }

}

@media (min-width:768px) and (max-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 24px;
        right: 20px;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 70px) !important;
        transform: translateX(100%);
        bottom: 0;
        position: relative;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 11px;
    }
}

@media (min-width: 1025px) and (max-width: 1320px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 55px) !important;
        transform: translateX(100%);
        position: relative;

    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 11px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -57px;
    }
}

@media (min-width:1321px) and (max-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 30px) !important;
        transform: translateX(100%);
        position: relative !important;

    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev {
        height: 22px !important;

    }
}

@media (min-width:1025px) and (max-width:1200px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -56px;
        left: 10px;
    }

    section.bonplan.centre .content-img img {
        min-width: 370px !important;
        min-height: 370px !important;

    }

    .fidelite {
        margin-left: -5rem !important;
    }

}

@media (min-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -52px;
        left: 10px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 90px) !important;
        transform: translateX(100%);
        bottom: 0 !important;
        position: relative;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next::before {
        top: 15px !important;

    }
}

/*End responsive page Bon plan*/
/*Start responsive page fidelité B2B*/
@media (max-width:767px) {
    section.bonplan.coiffure.centre .content-img img {
        min-height: 320px;
        min-width: auto;
    }

    section.bonplan.coiffure.centre .fidelite span {
        font-size: 50px;
    }

    section.bonplan.coiffure.centre .fidelite {
        margin-left: -5rem !important;
    }

    section.politique {
        padding: 50px 20px 20px;
    }

    h3.titre-plitique {
        line-height: 35px;
        margin-bottom: 0;
    }

    section.politique tbody tr td span {
        font-size: 12px !important;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb img {
        width: 100%;
        height: 100%;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .imgPageInfo img {

        display: flex !important;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .BordurePageInfo {
        background-color: #fff !important;
        display: flex !important;
    }

    #docs-internal-guid-31b4c445-7fff-3934-0292-2f02289a0f2f h2 {
        margin-bottom: 20px;
    }

    section.politique p.MsoNormal {
        margin-top: 10px;
    }

}

@media (max-width:500px) {
    section.politique tbody tr td span {
        font-size: 10px !important;
    }

    section.politique tbody img {
        width: 50%;
        height: 50%;
    }

    section.politique td {
        padding: 5px !important;
    }

}

@media (min-width:501px) and (max-width:767px) {
    section.politique tbody tr td span {
        font-size: 10px !important;
    }

    section.politique td {
        padding: 10px !important;
    }

}

@media (min-width:768px) and (max-width:1024px) {
    section.politique {
        padding: 50px 20px 20px;
    }

    section.politique p.MsoNormal {
        margin-top: 10px;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .imgPageInfo img {

        display: flex !important;
        justify-content: center;
    }

}

@media (min-width:1024px) {
    section.politique p.MsoNormal {
        margin-top: 10px;
    }
}

/*End responsive page fidelité B2B*/
/*responsive actualité*/
@media (max-width:767px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 35%;
    }

    section.catalogBloc.block {
        padding: 20px 0 !important;

    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
    }

    section.actualité.block {
        padding: 20px 0;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 35%;
    }

    section.actualité.block {
        padding: 20px 0;
    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
        padding-bottom: 0px;
    }
}

@media (min-width:992px)and (max-width:1200px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 55%;
    }

    .box-actualité.Card {
        margin-bottom: 40px;
        height: 750px;
    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
    }

    section.actualité.block {
        padding-bottom: 0;
    }
}

@media (min-width:1201px)and (max-width:1399px) {
    .box-actualité.Card {
        height: 800px;
    }
}

@media (min-width:1400px)and (max-width:1676px) {
    .box-actualité.Card {
        height: 900px;
    }
}

@media (min-width:1677px) {
    .box-actualité.Card {
        height: 900px;
    }

    section.actualité.block {
        padding: 70px 0 0;
    }

    .Inscprip-actualité .abonnez-vous {
        padding: 20px 30px 0px;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding: 0px 0 20px;
    }
}

@media (min-width:768px) {
    .coiffure-hom.b2b .detail-contact {
        display: block;
    }
}

@media (min-width: 1450px) and (max-width: 1580px) {
    section.brochure-homme.b2b {
        margin-top: 0 !important;
    }
}

@media (min-width: 1581px) {
    section.brochure-homme.b2b {
        margin-top: 0 !important;
    }
}

/*start responsive application beauty*/
@media(min-width: 501px) and (max-width: 767px) {
    .header-marketing-desc.ban-app.application-beauty {
        right: 20px !important;
    }
}

@media(max-width: 767px) {
    .header-marketing-desc.ban-app.application-beauty .name-app {
        font-size: 6px;
        margin-left: -80px;
    }

    .header-marketing-desc.ban-app.application-beauty .btn-app {
        margin: -40px 0 0;
        padding: 5px 2px;
        font-size: 7px;
        margin-left: -20px;
        width: 80px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app img {
        margin-right: 25px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app {
        width: 30%;
    }

    .header-marketing-desc.ban-app.application-beauty {
        right: 0;
        top: 30%;
    }

    .header-marketing.application {
        height: 100%;
    }
}

@media(max-width: 1024px) {

    section.bloc4-app.application .content-img,
    section.bloc6-app.application .content-img,
    section.bloc8-app.application .content-img {
        padding-right: 0px;
    }

    section.bloc4-app.application .application-img,
    section.bloc6-app.application .application-img,
    section.bloc8-app.application .application-img {
        left: 0px;
        top: 0px;
    }

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        padding-top: 0;
        margin-left: 0;
        padding-right: 0;
    }

    .bloc5-app.application,
    .bloc6-app.application,
    .bloc7-app.application {
        padding: 0px 35px 35px 35px !important;
    }

    .bloc8-app.application {
        padding: 0px 35px 0px 35px !important;
    }

    .Inscription-application section.abonnez-vous.instagram {
        padding-top: 20px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {

    .application.flex .container-fluid .row .col-md-6 {
        width: 100%;
    }

    .bloc4-app.application.flex .order-md-1 {
        order: 2 !important;
    }

    .bloc6-app.application.flex .order-md-2,
    .bloc8-app.application.flex .order-md-2 {
        order: 1 !important;
    }

}

@media (min-width:1025px) and (max-width: 1200px) {

    section.bloc4-app.application .content-img,
    section.bloc6-app.application .content-img,
    section.bloc8-app.application .content-img {
        padding-right: 0px;
        margin-right: 0;
    }

    section.bloc4-app.application .content-img img,
    section.bloc6-app.application .content-img img,
    section.bloc8-app.application .content-img img {
        margin-right: 0;
    }

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        margin-left: 0;
        padding-right: 0;
    }

    section.bloc5-app.application .cont-description,
    section.bloc7-app.application .cont-description {
        padding-left: 10px;
    }

    .bloc4-app.application.flex .cont-description {
        margin-top: 45px;
    }

    .bloc6-app.application {
        padding: 0px 35px 35px 35px !important;

    }

    .bloc8-app.application,
    .bloc5-app.application {
        padding: 0px 35px 35px 35px !important;
    }

}

@media (min-width:1201px) and (max-width: 1676px) {

    .bloc6-app.application,
    .bloc8-app.application {
        padding: 0px 35px 35px 35px !important;

    }

    .Inscription-application section.abonnez-vous.instagram {
        padding: 60px 30px 0px !important;
    }
}

@media (min-width:1677px) {

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        margin-left: 0;
    }

    .bloc4-app.application.flex .cont-description,
    .bloc6-app.application.flex .cont-description,
    .bloc8-app.application.flex .cont-description {
        margin-top: 90px;
    }

    .Inscription-application section.abonnez-vous.instagram {
        padding: 60px 30px 0px !important;
    }

    .bloc6-app.application,
    .bloc8-app.application {
        padding: 0px 35px 35px 35px !important;

    }
}

/*End responsive application beauty*/
/*Start Slider Top Page d'accueil*/

.sliderTop.home .slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 0px;
    width: 50px;
    height: 50px;
    left: inherit;
    transform: none;
}

@media (max-width:767px) {
    .sliderTop.home .slick-prev:before {
        left: 0px;
    }

    .bonPlan-img.centre .content-image-bonplan-b2c-first.shine img {
        padding-top: 0;
        height: auto !important;
        object-fit: fill !important;
    }

    .bonPlan-img.centre .content-image-bonplan-b2c-first.shine .content-bonplan {
        bottom: 20px;
    }
}

/*End Slider Top Page d'accueil*/
/*Start Popup Page actualité*/
.bloc-6-collection.actualité .row .img-anciennecoll,
.bloc-6-collection.actualité .row {
    display: flex;
    justify-content: center;
}

.popup-Actualité {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
}

.popup-Actualité .slider-popup {
    width: 80%;
    background-color: #fff;
}

.popup-Actualité img {
    max-width: 100%;
    max-height: 80vh;
    /* Ajustez la hauteur pour s'adapter à l'écran */
    display: block;
    margin: auto;
}

.popup-Actualité .close {
    position: absolute;
    top: 20px;
    right: 30px;
    color: white;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.popup-Actualité .slick-track {
    gap: 50px;
    display: flex;
    height: 600px;
}


/*End Popup Page actualité*/
/*Start page Detail actualité*/
.bloc-5-collection.Card .item-conseil {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
    height: 703px;
}

.bloc-5-collection.Card .title-bloc5-collection {
    padding-bottom: 20px;
}

@media (max-width: 1199px) {
    .bloc-5-collection.Card .titre-conseil {
        height: 20px;
    }
}

/*End page Detail actualité*/
/*Start page Nos marque*/
@media (max-width: 500px) {
    .header-marketing.Nos-marque .header-marketing-desc p {
        font-size: 14px;
    }

    .header-marketing.Nos-marque .header-marketing-desc {
        width: 80%;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 80%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
        padding-bottom: 0px;
    }

    .product-cosmetique.recomd.nos-marque .row.nos-marque {
        gap: 50px;
    }

}

@media (min-width: 501px) and (max-width:767px) {
    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
        padding-bottom: 0px;
    }

    .product-cosmetique.recomd.nos-marque .row.nos-marque {
        gap: 50px;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 80%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:768px) {
    .nos-collab .slick-prev {
        left: 0px;
    }

    .nos-collab .slick-next {
        right: 0px;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque {
        margin-bottom: 50px;
    }

    .product-cosmetique.recomd.nos-marque .logo-desc {
        margin: -35px 55px 0;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 100%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:992px) and (max-width:1200px) {
    .col-lg-3.col-md-6.col-sm-12.nos-marque {
        width: 50%;
    }

    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque {
        margin-bottom: 50px;
    }

    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 100%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:1201px) and (max-width:1550px) {
    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque .img-logo-item a img {
        width: 200px;
    }

    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque .logo-item {
        height: 320px !important;
    }
}

@media(min-width:481px) and (max-width:991px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 5px;
        padding-right: 5px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:992px) and (max-width:1360px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 25px;
        padding-right: 25px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:1361px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 50px;
        padding-right: 50px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    .Inscription-NosMarque .abonnez-vous.instagram {
        padding: 50px 30px 0px;
    }
}

@media(min-width:1678px) {
    .Inscription-NosMarque .abonnez-vous.instagram {
        padding: 50px 30px 0px;
    }
}

/*End page Nos marque*/
/*Start responsive Search*/
@media(max-width:767px) {
    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

    .inscrivez-vous.recherche listing .list.border-bottom {
        padding-left: 0;
    }

    #article_list {
        margin-right: 0;
    }

    #article_list .content-box {
        display: block;
    }

    section.inscrivez-vous.recherche div#cat_list {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    section.inscrivez-vous.recherche div#cat_list .list-group-item {
        margin-left: 20px !important;
    }

    .inscrivez-vous.recherche .single-list .content-img {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-bottom: 50px;
    }

    .inscrivez-vous.recherche .content-txt h4.content-title,
    .inscrivez-vous.recherche .content-txt h4.content-title {
        text-align: center;
    }

    .maquillage.home .content-video {
        display: block;
        justify-content: center;
    }

    .nouveaute.home {
        margin-top: 0px !important;
    }
}

@media(max-width:500px) {
    section.inscrivez-vous.recherche .search-container {
        width: 70% !important;
    }

}

@media(min-width:501px) and (max-width:767px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;


    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

}

@media(min-width:1025px) and (max-width:1367px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;
    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

}

@media(min-width:768px) {
    section.inscrivez-vous.recherche div#cat_list {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    section.inscrivez-vous.recherche div#cat_list .list-group-item {
        margin-left: 20px !important;
    }
}

/*End responsive Search*/

@media(min-width:1677px) {
    .product-cosmetique .slick-track .slick-slide .item.shine {
        padding: 0px 15px !important;
    }
}

/*Start responsive Filter page Catalogue*/
@media screen and (max-width:500px) {
    .filter.Catalogue .card-footer .btn {
        padding: 7px 0px !important;
        font-size: 10px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .col-md-4 {
        width: 33.333%;
        padding-right: 2px;
        padding-left: 2px;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 10px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-description-actualité-centre {
        margin-top: 0px;
        padding-top: 50px;
    }
}

@media(min-width:500px) and (max-width:767px) {
    .filter .card-footer .btn {
        padding: 10px 40px !important;
    }

    .filter details,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter.Catalogue .card-footer .btn {
        padding: 7px 0px !important;
        font-size: 14px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .col-md-4 {
        width: 33.333%;
        padding-right: 2px;
        padding-left: 2px;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 14px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-descriptionn {
        margin-top: 0px;
    }
}

@media (min-width:767px) and (max-width:1200px) {

    .filter details,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter.Catalogue .card-footer .btn {
        padding: 7px 70px !important;
        font-size: 14px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 14px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-description-actualité-centre {
        margin-top: 0px;
        padding-top: 50px;
    }
}


.brochure-homme .content-img-brochure {
    text-align: center;
}

.brochure-homme .brochure-image {
    max-width: 100%;
    width: auto;
    height: auto;
    margin: 0 auto;
}

.brochure-homme .cont-description {
    text-align: center;
}

.brochure-homme .cont-description a.decouvrir {
    display: inline-block;
    padding: 10px 20px;
    color: #000000;
    background-color: #007bff;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

.brochure-homme .cont-description a.decouvrir:hover {
    background-color: #0056b3;
}

.autonome.home .carousel.slide .slick-prev::before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -30px;
    font-weight: 300;
    background: url(../images/btnleft.png) center no-repeat;
    /* height: 130px; */
    width: 60px;
    content: "";
}

#success-message-container {
    transition: opacity 0.3s ease-in-out;
    opacity: 1;
}

#success-message-container.show {
    opacity: 1;
}

.autonome.home .carousel.slide .slick-next::before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    top: -25px;
    font-weight: 300;
    background: url(../images/btnright.png) center no-repeat;
    height: 20px;
    width: 60px;
    content: "";
}

@media(min-width:768px) and (max-width:825px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 285px;
    }
}

@media(min-width:826px) and (max-width:991px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 225px;
    }
}



@media(min-width:1200px) and (max-width:1676px) {
    .autonome.home {
        margin-bottom: 65px;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }
}

@media(min-width:1200px) and (max-width:1350px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .autonome.home {
        margin-bottom: 65px;
    }

    section.maquillage.home .content-autonome-desc {
        padding-right: 0px !important;
        margin-left: 70px !important;
        padding-left: 100px !important;
        padding-top: 0px !important;
        margin-top: 0px !important;
    }
}

@media(min-width:1351px) and (max-width:1676px) {
    .autonome.home {
        margin-bottom: 100px;
        margin-top: 20px;
    }
}

@media(min-width:1351px) and (max-width:1400px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 0px !important;
    }
}

@media(min-width:1520px) and (max-width:1676px) {

    section.maquillage.home {
        margin-top: 100px !important;
    }
}

@media(min-width:1676px) {
    .autonome.home {
        margin-bottom: 20px;
    }

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 200px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 100px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }
}

.product-cosmetique.recomd.catalogue .product-item.shine .new {
    top: 0px !important;
}

/**/
@media(max-width:767px) {

    .autonome.home .carousel.slide button.slick-prev.slick-arrow,
    .autonome.home .carousel.slide button.slick-next.slick-arrow {
        bottom: 280px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one {
        grid-template-columns: auto 50px !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-img.shine,
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        margin-bottom: 40px;
        max-height: 600px;
        width: 100% !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 60px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }

    .content-carte-mahassen.carte-one .fidelite-one-acceuil {
        margin-top: 400px;
        height: 0 !important;
        margin-left: -0.50rem !important;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 65px !important;
        margin-left: 0 !important
    }

    .fidelite-two-acceuil {
        margin-top: -120px;
        margin-left: -1.75rem !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: auto !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .fancybox img {
        width: 100%;
        object-fit: cover;
    }

    .maquillage.home .row .col-md-12.modify {
        padding-right: calc(var(--bs-gutter-x)* .5);
        padding-left: calc(var(--bs-gutter-x)* .5);
    }

    section.maquillage.home .content-autonome-desc {
        padding-left: 0 !important;
        padding-top: 0 !important;
        margin-left: 0 !important
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }
}

@media(min-width:360px) and (max-width:376px) {
    .mahassen-lives {
        margin-top: 425px !important;
    }
}

@media (min-width: 377px)and (max-width:384px) {
    .mahassen-lives {
        margin-top: 400px !important;
    }
}

@media (min-width: 385px)and (max-width:395px) {
    .mahassen-lives {
        margin-top: 370px !important;
    }

}

@media (min-width: 768px)and (max-width:800px) {
    .mahassen-lives {
        margin-top: 40px !important;
    }
}

@media (min-width: 801px)and (max-width:991px) {
    .mahassen-lives {
        margin-top: 20px !important;
    }
}

@media (min-width: 992px)and (max-width:1199px) {
    /* .fidelite-mahassen {
        max-height: 1085px;
    } */

    section.carte-mahassen {
        padding: 50px 35px 20px;
    }

    .content-carte-mahassen.carte-one {
        grid-template-columns: auto 100px !important;
    }

    /* .content-carte-one {
        height: 1002.06px !important;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 500px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 80px;
        margin-left: 121px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 100px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: -41px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 20px;
        padding-top: 20px;
        display: grid;
        grid-template-columns: auto 100px;
    }

    /* .content-carte-one {
        height: 1002.06px !important;
    } */

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 500px;
        margin-top: 50px;
        width: 100%;
    }

    /* section.mahassen-lives {
        margin-top: 50px;
    } */

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        margin-top: 264px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }

    .fidelite-one-acceuil {
        margin-top: -250px;
        margin-left: 0.5rem !important;
    }

    .fidelite-two-acceuil {
        margin-top: -10px;
        margin-left: -1.5rem !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: 0px;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .modify {
        width: 100%;
        display: flex;
        justify-content: center
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .col-xxl-7 {
        width: 100%;
        display: flex;
        justify-content: center
    }

    .container.adjust-bloc-collection_hiver {
        max-width: 1030px;
        padding-right: 50px;
        padding-left: 50px;
    }

    #carouselExampleCaptions1 button.slick-next.slick-arrow {
        left: 310px;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 37px;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }

    .bonplan.coiffure.centre.centre.centre-M .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: -20px;

    }

    section.bonplan .content-img {
        width: 100%;
        float: left;
    }

    section.bonplan.coiffure.centre.centre-M {
        padding: 50px 65px 10px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 20px;
        height: auto;
    }
}

@media (min-width: 992px)and (max-width:1023px) {
    section.bonplan.coiffure.centre.centre-M {
        padding: 50px 65px 10px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 20px;
        height: auto;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {

        left: -90px !important;
    }
}

@media (min-width: 1401px)and (max-width:1676px) {
    .container.adjust-bloc-collection_hiver {
        max-width: 1400px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        right: 100px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 380px !important;
    }

    /* #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow::before {
        top: -22px !important;
    } */

    /* #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow:before {
        top: -122px !important;

    } */
}

@media (min-width: 1200px)and (max-width:1400px) {
    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        right: 55px !important;
    }

}

@media (min-width: 1401px)and (max-width:1676px) {
    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .row {
        padding-right: 100px !important;
    }
}

@media screen and (min-width:1676px) {
    .collection .container.adjust-bloc-collection_hiver {
        max-width: max-content;
        padding-left: 100px;
        padding-right: 50px;
        ;
    }

    .autonome.home .container-fluid {
        max-width: max-content;
        padding-left: 50px;
        padding-right: 50px;

    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }


    section.maquillage.home {
        padding: 50px 50px 50px 50px;
    }

    section.maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: 0px !important;
    }

    section.maquillage.home .content-autonome-desc {

        margin-top: 0px !important;
        padding-right: 0px;
        padding-left: 0px;
    }

    section.nouveaute.home {
        padding: 100px 35px 50px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-carte-one {
        height: 800px !important;
    }

    /* section.mahassen-lives {
        padding: 60px 13px 84px 30px !important;
        position: relative;
        margin-top: 10px !important;
        top: -82px;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        max-height: 700px;

    }

    section.collection .container.adjust-bloc-collection_hiver .desc_collection {
        padding: 170px 100px 0px 0px !important;
    }

    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: -70px !important;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-next::before {
        right: 15px !important;
    } */

}



@media screen and (min-width: 1800px) {
    section.maquillage.home {
        margin-top: 50px !important;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        max-height: 800px;
    }

    /* section.mahassen-lives {
        padding: 30px 13px 30px 30px !important;
        bottom: 135px;
    } */

    .collection .container.adjust-bloc-collection_hiver {
        max-width: max-content;
        padding-left: 150px;
        padding-right: 100px;
    }
}

@media (min-width: 401px)and (max-width:445px) {}

@media (min-width: 501px)and (max-width:767px) {
    /* .Avis-mah-Centre section.avis-clients {
        margin-top: 0px !important;
    } */

    .Centre-m section.carte-mahassen.centre-m {
        padding: 50px 0 50px;
    }

    /* .Centre-m {
        padding-bottom: 50px;
    } */

}

@media (min-width: 1200px) {
    .massage.coiffure.mah-Centre .slick-prev:before {
        background: url(../images/btnleft.png)center no-repeat !important;
    }

    .massage.coiffure.mah-Centre .slick-next:before {
        background: url(../images/btnright.png) center no-repeat !important;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    section.esthetique-home.mah-Centre .slick-next:before {
        left: -20px;
        top: -40px !important;
    }

    section.esthetique-home.mah-Centre .slick-prev:before {
        left: 10px;
        top: -40px !important;
    }
}

@media (min-width: 992px) and (max-width: 1024px) {
    section.esthetique-home.mah-Centre .slick-next:before {
        left: -20px;
        top: -80px !important;
    }

    section.esthetique-home.mah-Centre .slick-prev:before {
        left: 10px;
        top: -80px !important;
    }
}

@media (min-width: 767px) and (max-width: 1024px) {
    section.hamam.mah-Centre .hamam-img {
        margin-right: 40px;
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 250px;
        width: 250px;
        top: -170px;

    }

}

@media (min-width: 991px) and (max-width: 1024px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        margin-top: 93px;
    } */

}

@media (min-width: 1025px) and (max-width: 1100px) {
    .Avis-mah-Centre section.avis-clients {
        padding: 0;
        /* top: 57px; */
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 250px;
        width: 250px;
        top: -170px;

    }
}

@media (min-width: 1101px) and (max-width: 1199px) {
    .Avis-mah-Centre section.avis-clients {
        padding: 0;
        /* margin-top: -50px; */
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 250px;
        width: 250px;
        top: -170px;
    }
}


@media (min-width: 1200px) and (max-width: 1676px) {
    .esthetique-home.mah-Centre .content-slider-home .slider-esthetique .slick-list .content-imgMahassen {
        width: 90%;
    }

    section.massage.coiffure.mah-Centre::before {
        height: auto;
        top: 0;
    }

    .carousel-maquillage.mah-Centre .carousel-item.shine {
        min-height: auto !important;
        padding: 0 10px;
    }

}

@media (min-width: 1024px) and (max-width: 1200px) {
    /* section.esthetique-home.mah-Centre .slick-next:before {
        left: -70px;
    } */
}

@media (min-width: 1550px) and (max-width: 1676px) {
    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        max-height: 700px !important;
    }

    .Avis-mah-Centre .avis-clients {
        margin-top: 50px;
    }
}

@media(min-width: 1676px) {
    section.esthetique-home.mah-Centre .slick-next:before {
        left: 135px;
    }
}

@media screen and (min-width: 1920px) {
    .massage.coiffure.mah-Centre .carousel-maquillage .carousel-caption {
        left: 20%;

    }
}

@media (min-width: 1441px) {
    .abonnez-vous.instagram {
        margin-top: -52px !important;
    }
}

@media (min-width:1025px) and (max-width: 1199px) {
    .collection.home .collection_hiver {
        height: 800px !important;
    }

    section.collection.home .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }

    section.nouveaute.home {
        margin-top: 50px !important;
    }
}

@media (min-width:1200px) and (max-width:1676px) {
    section.autonome.home {
        height: calc(57vh) !important;
    }
}

@media (max-width:480px) {
    .footer-networks .carte-banck {
        gap: 5px;
    }

    .footer-networks .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 1200px) and (max-width: 1440px) {
    section.footer .footer-content {
        gap: 20px !important;
    }
}



@media (min-width: 992px) and (max-width: 1199px) {
    section.footer {
        padding: 52px 25px 25px 25px !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 1024px) and (max-width: 1199px) {
    section.footer .footer-content {
        grid-template-columns: repeat(4, 1fr) !important;

    }
}


/* Styles for detail actualité */
@media (max-width: 480px) {
    .header-marketing {
        text-align: center;
        font-size: 16px;

    }

    .content_slider {
        padding: 0px;
    }

    .card {
        margin-bottom: 15px;
    }

    .btn-custom {
        font-size: 12px;
        padding: 6px 12px;
    }


}

/* Styles for mobile devices (481px to 767px) */
@media (min-width: 481px) and (max-width: 767px) {
    .header-marketing {
        text-align: center;
        font-size: 18px;
    }

    .content_slider {
        position: relative;
        padding: 0 0px;
    }

    .card {
        margin-bottom: 20px;
    }

    .btn-custom {
        font-size: 14px;
    }
}

/* Styles for tablets (768px to 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 20px;
    }

    .card {
        margin-bottom: 25px;
    }

    .btn-custom {
        font-size: 16px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }
}


@media (min-width: 1025px) and (max-width: 1428px) {
    .header-marketing {
        text-align: left;
        font-size: 22px;
    }

    .card {
        margin-bottom: 30px;
    }

    .btn-custom {
        font-size: 18px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }
}

/* Styles for large desktop monitors (1441px and above) */
@media (min-width: 1374px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 24px;
    }

    .card {
        margin-bottom: 35px;
    }

    .btn-custom {
        font-size: 20px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 1px;
        grid-template-columns: repeat(auto-fit, minmax(296px, 1fr));
        grid-auto-rows: 494px;
        grid-auto-flow: dense;
    }

    .container.adjust-conseil-container {
        max-width: 1365px;
    }

    .video-bloc2-collection {
        position: relative;
        max-width: 1444px;
    }
}


@media (min-width: 1170px) and (max-width: 1199px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 414px;
        grid-auto-flow: dense;
    }



}


/* @media (min-width: px) and (max-width: 1030px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 414px;
        grid-auto-flow: dense;
    }

} */

@media (min-width: 1157px) and (max-width: 1165px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 398px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }

}

@media (min-width: 1099px) and (max-width: 1156px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 398px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }
}

@media (min-width: 992px) and (max-width: 1199px) {

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 433px;
        grid-auto-flow: dense;
    }

    .bloc-3-collection.Centre-M .grid-wrapper-colletion {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }

}

@media (min-width: 745px) and (max-width:991px) {
    .bloc-3-collection.Centre-M .grid-wrapper-colletion {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 20px;
    }

    .card {
        margin-bottom: 25px;
    }

    .btn-custom {
        font-size: 16px;
    }


    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 482px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }
}

@media (min-width: 1442px) {
    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

    .header-marketing {
        text-align: left;
        font-size: 24px;
    }

    .card {
        margin-bottom: 35px;
    }

    .btn-custom {
        font-size: 20px;
    }

    .description-detail-actualite {
        text-align: justify;
        padding-left: 50px;
        padding-right: 50px;
    }

    .video-bloc2-collection {
        position: relative;
    }


    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
        padding-left: 50px;
    }


    .grid-wrapper-colletion {
        display: grid;
        margin-left: 40px;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 504px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }


    .container.adjust-conseil-container {
        max-width: 1373px;
    }

    .item-anciennecoll {
        display: table;
        margin: 0 auto 20px;
    }


    .item-anciennecoll {
        position: relative;
    }


    .title-anciennecoll {
        position: absolute;
        content: "";
        color: #fff;
        text-align: center;
        top: 0;
        margin: 30px auto 0;
        left: 0;
        right: 0;
        font-size: 22px;
        text-transform: uppercase;
        text-shadow: 0 0 30px #fff;
    }


    .container.anciene-co {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: stretch;
        align-items: center;
    }
}

/* start section se maquiller = maquillage professionel */


section.idees {
    padding: 50px 37px;
    background: #f5f5f5;
}

section.idees h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 70px;
}

.product-slider-idees {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}


.idees .product-slider-idees.slick-dotted .slick-next:before {
    color: black;
    opacity: 0.99;
    font-size: 30px;
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -10px !important;
    font-weight: 300;
    /* background: url(../images/btnrright.png) center no-repeat; */
    height: 257px;
    width: 60px;
    content: "";
    top: 87px;
    background: url(../images/btnright.png) center no-repeat;
}


.idees .product-slider-idees.slick-dotted .slick-prev:before {
    /* color: black;
    opacity: 0.99;
    font-size: 30px; */
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: 242px;
    font-weight: 300;
    background: url(../images/btnleft.png) center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
    top: 64px;
}


@media (min-width: 1600px) {
    section.idees {
        padding: 80px 50px;
    }

    section.idees h2 {
        font-size: 30px;
        margin-bottom: 80px;
    }

    .product-slider-idees {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        flex-direction: row;
        align-content: stretch;
        align-items: center;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 35px;
    }
}


@media (min-width: 1024px) and (max-width: 1600px) {
    section.idees {
        padding: 60px 40px;
    }

    section.idees h2 {
        font-size: 28px;
        margin-bottom: 75px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 32px;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    section.idees {
        padding: 50px 30px;
    }

    section.idees h2 {
        font-size: 26px;
        margin-bottom: 60px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 28px;
    }
}


@media (min-width: 576px) and (max-width: 768px) {
    section.idees {
        padding: 40px 20px;
    }

    section.idees h2 {
        font-size: 24px;
        margin-bottom: 50px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 26px;
    }
}


@media (max-width: 576px) {
    section.idees {
        padding: 30px 15px;
    }

    section.idees h2 {
        font-size: 22px;
        margin-bottom: 40px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 24px;
    }
}

/************/
.product-item.shine.pro {
    display: flex;
    justify-content: center;
    margin-left: 0px !important;
}

.product-slider-idees.pro {
    margin: 0 !important;
}

@media (min-width: 1200px) {
    .product-slider-idees.pro .product-item img {
        max-width: initial;
        max-height: initial;
        object-fit: cover;
    }
}

@media (max-width: 1201px) {
    .product-slider-idees.pro .product-item img {
        max-width: 300px;
        max-height: 200%;
        object-fit: cover;
    }
}

@media (max-width: 991px) {
    .product-slider-idees.pro .slick-dots {
        display: none !important;
    }

}

@media (max-width: 991px) {
    section.idees.soin .product-slider-idees.pro .slick-next.slick-arrow {
        height: 12px;
        width: 60px;
        right: 0px;
        bottom: 10px;
        right: calc(52% - 20px) !important;
        transform: translateX(100%);
        z-index: 3;
    }


    section.idees .product-slider-idees.pro .slick-next.slick-arrow {
        height: 33px;
        width: 60px;
        right: 0px;
        bottom: 15px;
        right: calc(53% - 26px) !important;
        transform: translateX(100%);
    }

    .product-slider-idees.pro .slick-prev.slick-arrow {
        width: 50px;
        height: 50px;
        left: inherit;
        top: inherit;
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: 15px;

    }

    .product-slider-idees.pro .slick-prev.slick-arrow:before {
        height: 10px;
        width: 60px;
        top: 64px;
        bottom: 0;
        left: -8px;
    }

}

@media (max-width: 700px) {
    /* .product-slider-idees.pro .slick-next.slick-arrow {
        top: 285px;
    } */
}


@media (min-width: 360px) and (max-width: 526px) {

    /* .product-slider-idees.pro .slick-next.slick-arrow {
        top: 345px !important;
    } */
    .product-slider-idees.pro .product-item.shine img {
        max-height: 100% !important;
        max-width: 300px !important;

    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.autonome.home .content-autonome {
        grid-template-columns: 60% 60%;
    }
}

@media (max-width: 1200px) {
    .maquillage.home .content-video {
        padding-left: 0px;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .maquillage.home .content-video {
        padding-left: 0px;
    }

    .autonome.home .carousel-item.shine .custom-caption {
        top: 54%;
    }
}

@media (min-width: 1166px) and (max-width: 1199px) {

    .autonome.home,
    .maquillage.home {
        margin-top: -100px !important;
    }
}

@media (max-width: 1200px) {
    .avis-home {
        padding-top: 50px;
    }
}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.autonome.home {
        height: auto !important;
    }

    section.autonome.home div#carouselExampleCaptions2 {
        height: 0px !important;
        position: relative;
    }

    section.maquillage.home {
        margin-top: 50px;
    }
}

/*Actualité Card*/

.actualité.block .box-actualité.Card {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
}

.actualité.block .box-actualité.Card .image-box-actualité img {
    max-width: 100%;
}

.actualité.block .box-actualité.Card .detail-box-actualité .date-box-actualité {
    padding: 14px 0 9px;
    font-size: 14px;
    color: #b0b0b0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.actualité.block .row {
    margin-top: 50px;
}

.actualité.block .box-actualité.Card .title-box-actualité {
    padding-top: 50px;
}

.actualité.block .box-actualité.Card .btn-box-actualité a {
    text-decoration: underline;

}

.actualité.block .box-actualité.Card .btn-box-actualité:hover a {
    color: #b0b0b0;
}

.actualité.block .box-actualité.Card .title-box-actualité {
    font-size: 23px;
    line-height: 27px;
    text-align: center;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 600;
}

.actualité.block .box-actualité.Card .user-box-actualité {
    font-size: 20px;
    margin: 10px 0 33px;
    text-align: center;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.actualité.block .box-actualité.Card .btn-box-actualité {
    text-align: center;
    margin-top: 20px;
}

@media (min-width: 992px) and (max-width: 1165px) {
    .actualité.block .box-actualité.Card {
        height: 1200px;
    }

    .actualité-blogs .box-blogs.Card {
        height: 1200px;
    }

}

@media (min-width: 1166px) {
    .actualité.block .box-actualité.Card {
        height: auto;
    }

    .actualité.block .box-blogs.Card {
        height: auto;
    }

    .actualité-blogs .box-blogs.Card {
        height: auto;
    }

    .actualité-blogs .box-blogs.Card {
        height: auto;
    }
}

@media (min-width: 1400px) {

    .catalogBloc.actualité.block .container-fluid,
    .catalogBloc.actualitéBloc .container-fluid {
        max-width: 1320px;
    }
}

.coiffure-hom.marque.block {
    padding: 30px 35px 30px 35px;
}

.massage.coiffure.marque {
    padding: 30px 35px 35px 35px;
}

@media (min-width: 767px) and (max-width: 1200px) {
    .actualité.block .row .col-lg-6 {
        width: 100%;
    }

    .actualité-blogs .row .col-lg-6 {
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .catalogBloc.actualité.block .container-fluid {
        max-width: 1140px;
    }
}

@media (min-width: 360px) and (max-width: 500px) {
    .bonplan.coiffure.centre.centre-M .fidelite-bon-plan span {
        font-size: 30px;
        margin-top: 195px;
        margin-bottom: 0px;
        margin-left: 116px;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    .bonplan.coiffure.centre.centre-M .fidelite-bon-plan span {
        font-size: 42px;
        margin-top: 268px;
        margin-bottom: 0px;
        margin-left: 116px;
    }
}

@media (max-width: 767px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 30px;
        margin-top: 210px;
        margin-bottom: 0px;
        margin-left: 50px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 100% !important;
        float: left;
    }

    section.bonplan.coiffure.centre .content-img img {
        min-height: auto !important;
        min-width: auto;
    }

    section.bonplan.coiffure.centre .fidelite-bon-plan {
        height: 0px !important;
    }

    .bonplan.coiffure.centre {
        padding: 50px 0px;
    }

    section.bonPlan-img-section-bottom.centre {
        padding: 40px 20px 40px 20px;
    }

    .bonPlan-img-section-bottom.centre .remise-bonplan {
        left: 50px;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: -10px !important;
        width: 50px;
        height: 50px;
        left: inherit;

    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-next.slick-arrow {
        right: calc(50% - 20px) !important;
        transform: translateX(100%);
        bottom: -10px !important;
        top: inherit;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -8px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px !important;
    }

}

@media (min-width: 501px) and (max-width: 601px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 45px;
        margin-top: 255px;
        margin-bottom: 0px;
        margin-left: 50px;

    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 85%;
        float: left;
    }
}

@media (min-width: 602px) and (max-width: 767px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 55px;
        margin-top: 275px;
        margin-bottom: 0px;
        margin-left: 40px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 88%;
        float: left;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    section.bonplan.coiffure.centre .fidelite-bon-plan {
        height: 0px !important;
    }

    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 392px;
        margin-bottom: 0px;
        margin-left: 110px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 100%;
        float: left;
    }
}

@media (min-width: 1025px) {
    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        background: url(../images/btnleft.png) center no-repeat !important;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        background: url(../images/btnright.png) center no-repeat !important;
    }
}

@media (min-width: 1200px) and (max-width: 1480px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 40px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0px;
    }
}

@media (min-width: 1481px) and (max-width: 1667px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 45px;
        margin-top: 0;
        margin-bottom: 0px;
        margin-left: 0;
    }
}

@media (min-width: 1200px) {
    .bonplan.coiffure.centre.centre.centre-M .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: -70px;
    }

    section.bonplan.coiffure.centre.centre.centre-M .content-img {
        width: 90%;
        float: left;
    }

    section.bonplan.coiffure.centre.centre.centre-M {
        height: auto;
    }
}

@media (min-width: 1676px) {
    section.bonplan.coiffure.centre.centre.centre-M {
        height: auto;
    }
}

@media (min-width: 1676px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description {
        margin-top: 90px !important;
        width: 100%;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description h2 {
        line-height: 45px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app {
        padding: 100px 0 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .cont-description {
        width: 100%;
        padding-left: 20px !important;
        margin-left: 33px;
        margin-top: 90px;
    }
}

@media (min-width: 1200px) and (max-width: 1675px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description {
        width: 100%;
        padding-left: 0;
        margin-left: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description h2 {
        line-height: 45px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app {
        padding: 50px 0 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .cont-description {
        width: 100%;
        padding-left: 20px !important;
        margin-left: 0px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .content-img-left {
        margin-left: 0 !important;
    }
}

@media (max-width: 767px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 35px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .cont-description {
        margin-top: 70px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .col-md-6 {
        width: 100%;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 35px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }
}

@media (min-width: 767px) and (max-width: 992px) {
    .collection.mah-nouveaute.maquillage.pro .content-img.shine {
        margin: 30px auto 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .row,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .row {
        display: flex;
        flex-direction: column;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .order-md-2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .row .col-md-6.flex {
        order: 0 !important;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .cont-description {

        padding-left: 0;
        margin-left: 0;
        margin-top: 50px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .cont-description {
        width: 95%;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .col-md-6 {
        padding-left: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .content-img-left {
        margin-left: 15px;
        padding-top: 40px;
    }

    /* aaaa */
}

@media (max-width: 991px) {
    .product-slider-idees.pro.soin .slick-prev.slick-arrow:before {
        top: 86px !important;
    }
}

@media (max-width: 700px) {

    /* .product-slider-idees.pro.soin .slick-next.slick-arrow {
        top: 261px;
    } */
    section.idees.soin {
        padding: 50px 15px;
    }
}

.collection.mah-nouveaute.mah-Centre .col-lg-5.col-md-2.mah {
    width: 50%;
}

@media (min-width: 1676px) {
    .collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        text-align: justify !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        padding: 50px 40px 0 20px !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 50px;
    }

    .hamam.mah-Centre.mah .col-md-6.order-col .cont-description {
        width: 100%;
        margin-top: 0px;
    }

    .hamam.mah-Centre.mah {
        margin-top: 0px;
    }

    .massage.mah-Centre.mah .slick-slide img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .massage.mah-Centre.mah .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        padding-top: 0;
        padding-bottom: 0;
        color: #fff;
        text-align: center;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: 100%;
        padding: 0;
    }

    .massage.mah-Centre.mah .col-md-6.flex .cont-description {
        width: 100%;
        margin-top: 0px;
        padding: 50px 40px 0 40px !important;
    }

    .massage.mah-Centre.mah .col-md-6.flex .cont-description p {
        margin-top: 50px;
    }

    .massage.mah-Centre.mah .col-md-6.flex {
        display: flex;
        align-items: initial;
    }

    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 100%;
        margin-top: 0px !important;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 .cont-description p {
        margin-top: 50px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 {
        padding: 50px 40px 0 20px !important;
    }
}

section.hamam.mah-Centre.mah .hamam-img {
    position: relative;
    left: 0;
    width: 100%;
}

@media (min-width: 1025px) and (max-width: 1676px) {
    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 95%;
        margin-top: 0px !important;
        padding-right: 0;
        padding-left: 0;
        margin-left: 10px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 .cont-description p {
        margin-top: 50px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 {
        padding: 20px 40px 0 20px !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col,
    .massage.mah-Centre.mah .col-md-6.flex {
        margin-top: 20px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        margin-top: 50px;
        padding-right: 0;
        padding-left: 0;
        margin-left: 10px;
    }

    section.massage.mah-Centre.mah .cont-description {
        padding: 20px 40px 0 40px;
        width: 100%;
        margin-left: 0;
        margin-top: 0;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 50px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        width: 90%;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        margin-bottom: 10px;
    }

    .massage.mah-Centre.mah .slick-slide img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .massage.mah-Centre.mah .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        padding-top: 0;
        padding-bottom: 0;
        color: #fff;
        text-align: center;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: 100%;
        padding: 0;
    }

    section.massage.coiffure.mah-Centre.mah {
        padding: 35px 35px 35px 35px !important;
    }

    .massage.mah-Centre.mah .cont-description p {
        margin-top: 50px;
    }

}

@media (min-width: 767px) and (max-width: 1024px) {
    .collection.mah-nouveaute.mah-Centre .col-lg-5.col-md-2.mah {
        width: 40% !important;
    }

    section.collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        padding: 10px 0px 0px;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        margin-bottom: 10px;
        text-align: justify;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        width: 40%;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-md-2 {
        width: 60%;
    }
}

@media (min-width: 1024px) {

    /* .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-prev.slick-arrow,
    .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -60px !important;
    } */

}

@media (min-width: 1024px) and (max-width: 1200px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 10px 0 0;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection h4 {
        margin-bottom: 10px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 20px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        margin-top: 20px;
    }

    section.massage.mah-Centre.mah {
        padding: 35px 50px;
    }

    section.massage.mah-Centre.mah .slick-list img {
        height: auto;
    }

    .massage.mah-Centre.mah::after {
        height: 100%;
        top: 0;
    }

    .massage.mah-Centre.mah .cont-description p {
        margin-top: 20px;
    }

    .massage.mah-Centre.mah .col-md-6.flex {
        margin-top: 0px;
        align-items: initial;
    }

    section.massage.mah-Centre.mah .cont-description {
        padding: 20px 40px 0 0px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description,
    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 100%;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    .collection.mah-nouveaute.mah-Centre .col-md-12.col-lg-5.col-md-2.mah {
        width: 100% !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 10px;
    }

    .massage.mah-Centre.mah .carousel.slide img {
        height: auto;
        margin-bottom: 0;
    }

    .massage.mah-Centre.mah .carousel-maquillage.slick-initialized.slick-slider .carousel-caption {
        bottom: 0;
        left: 0;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: auto;
        padding: 0;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-md-2 {
        width: 100% !important;
        order: 0 !important;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        width: 100%;
    }

    section.hamam.mah-Centre.mah .row {
        display: flex;
        flex-direction: column;
    }

    .massage.mah-Centre.mah .col-md-6 {
        width: 100%;
    }

    section.mah-Centre.mah:after {
        height: 78%;
    }

    section.massage.coiffure.mah-Centre.mah::before {
        height: 78% !important;
        top: 0 !important;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next:before {
        bottom: -303px !important;
    }

    section.collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        padding: 50px 0px 0px !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 50px;
    }
}

@media (max-width: 767px) {
    .collection.mah-nouveaute.mah-Centre .col-md-12.col-lg-5.col-md-2.mah {
        width: 100% !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 50px;
    }

    .massage.mah-Centre.mah .carousel-item.shine img {
        height: auto !important;
        width: 100%;
    }

    .massage.coiffure.mah-Centre.mah .carousel-item img {
        height: auto !important;
    }

    section.hamam.mah-Centre.mah .hamam-img {
        height: auto !important;
    }

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 70% !important;
        top: 0px;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: auto;
        padding: 0 10px;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-prev.slick-arrow,
    .massage.coiffure.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: -45px !important;
        width: 50px;
        height: 50px;
        left: inherit;
        position: absolute;
        top: inherit;
        z-index: 3;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -8px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next.slick-arrow {
        right: calc(50% - 20px) !important;
        transform: translateX(100%);
        bottom: -45px !important;
        top: inherit;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px !important;
    }
}

@media (max-width: 500px) {

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 60% !important;

    }
}

@media (max-width: 400px) {

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 48% !important;

    }
}

@media (max-width: 767px) {

    section.esthetique-home.mah-Centre.mah .slick-prev:before,
    section.esthetique-home.mah-Centre.mah .slick-next:before {
        bottom: -35px;
    }

    section.esthetique-home.mah-Centre.mah p {
        margin-bottom: 25px;
    }

    section.esthetique-home.mah-Centre.mah {
        padding: 35px 0px 60px 0px;
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    section.esthetique-home.mah-Centre.mah p {
        margin-bottom: 25px;
        color: black;
    }

    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 10%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -5%) !important;
    }
}

@media (min-width: 768px) {
    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        transform: translateX(50%) !important;
        bottom: -45px !important;
        left: inherit;
        position: absolute;
        z-index: 3;
    }

    section.esthetique-home.mah-Centre.mah .slick-prev:before {
        top: 20px !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {

        transform: translateX(100%) !important;
        bottom: -45px !important;
        left: inherit;
    }

    section.esthetique-home.mah-Centre.mah .slick-next:before {
        top: 20px !important;
    }
}

@media (min-width: 992px) and (max-width: 1024px) {
    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 10%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -5%) !important;
    }
}

@media (min-width: 1024px) and (max-width:1200px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 35%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 30%) !important;
    }
}

@media (min-width: 1200px)and (max-width: 1440px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 25%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 25%) !important;
    }
}

@media (min-width: 1441px)and (max-width: 1667px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 30%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 30%) !important;
    }
}

@media (min-width: 1667px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 20%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 17%) !important;
    }
}

@media (min-width: 1024px) {

    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-prev:before {

        background: url(../images/btnright.png) center no-repeat;
    }

    section.esthetique-home.mah-Centre.mah .slick-next:before {
        background: url(../images/btnleft.png) center no-repeat;
    }
}

.bloc-3-collection.Centre-M .grid-wrapper-colletion img {
    width: 100% !important;
}

.bloc-3-collection.Centre-M .grid-wrapper-colletion {
    margin-left: 0;
}

.bloc-1-collection.Centre-M .title-bloc1-collection {
    text-align: center;
    background: var(--grayLighten_color);
    font-family: "Century-Gothic-Std", "Century Gothic";
    color: black;
    margin: 0 30px;
    font-size: 19px;
    padding: 10px;
    text-transform: uppercase;
}

@media (min-width:1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 25px 0 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .container-fluid {
        padding-right: 0;
        padding-left: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .application-img-btb {
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
        margin-top: 85px;
        padding-left: 0;
        margin-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 60px 0 0 !important;
    }

}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 0px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 15px;
    }

    .header-marketing .header-marketing-icons a {
        right: -175px !important;
    }
}

@media (min-width: 1201px) and (max-width: 1667px) {

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 20px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 40px;
    }
}

@media (min-width: 1025px) and (max-width: 1667px) {
    section.bloc3-app-btb.b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        padding-left: 0;
        margin-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 65px 0 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
        padding-left: 0;
        margin-left: 0;
    }
}

@media (max-width:1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b .col-md-6 {
        width: 100%;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .content-img {
        padding-right: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .application-img-btb,
    .bloc3-app-btb.fidelité-b2b.b2b .application-img-btb {
        left: 0;
        top: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .container-fluid,
    .bloc3-app-btb.fidelité-b2b.b2b .container-fluid {
        padding-right: 0;
        padding-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .col-md-6 {
        width: 100%;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .col-md-6.order-md-1 {
        order: -1 !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 30px 0px 0px 0px;
    }
}

@media (max-width:767px) {
    .carte-mahassen.centre-m.b2b {
        padding: 50px 35px 20px;
    }
}

/*REsponsive Card-B2b-Fidelité*/
section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
    writing-mode: vertical-rl;
    font-size: 100px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: var(--grayLighten_color);
    margin-left: -41px;
    letter-spacing: 0.2rem;
    display: inherit;
    line-height: initial;
}

section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {
    writing-mode: vertical-rl;
    font-size: 80px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: #fde2e1;
    margin-top: 361px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

@media (min-width:1667px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {

        font-size: 150px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 320px;
        margin-left: 2rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 100px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 130px;
        margin-left: -1rem !important;
        height: 0 !important;
    }

}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 80px;
        margin-left: -40px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 280px;
        margin-left: 2rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 250px;
        margin-left: -1rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 80px;
    }

}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 950px !important;
    }
}

@media (min-width: 1201px) and (max-width: 1440px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 1120.06px !important;


    }

}

@media (min-width: 1441px) and (max-width: 1676px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 1060.06px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .content-carte-one .content-img {
        max-height: 710px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 100px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 120px;
        margin-left: 1.5rem !important;
        height: 950px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 80px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 80px;
        margin-left: -1.5rem !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1030.05px !important;
    }
}

@media (max-width: 991px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-img.shine {
        width: 100% !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 860px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 70px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-left: 2.5rem;
        font-size: 110px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 0px 35px 20px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-left: -1.5rem;
        font-size: 110px;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 60px auto 100px;
        margin-top: 0;

    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 70px;

    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 650px !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-img.shine {
        margin-bottom: 35px;
    }

}

@media (min-width: 768px) and (max-width: 775px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1135px !important;
    }
}

@media (min-width: 776px) and (max-width: 867px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1090px !important;
    }
}

@media (min-width: 868px) and (max-width: 991px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1040px !important;
    }
}

@media (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 65px !important;
        margin-left: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .remise {
        left: 2px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 215px;
        margin-left: -0.50rem !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 0px;
        margin-left: -0.50rem !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .b2b-fidelite .content-carte-mahassen .content-img.shine {
        margin-bottom: 30px;
    }
}

@media (min-width: 360px) and (max-width: 400px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 0;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 50px auto 60px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 55px;

    }
}

@media (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 40px auto 60px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 55px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .col-md-12.col-lg-6.b2b-fidelite .profiter {
        height: 954px !important;
    }

}

@media (max-width: 391px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 991px !important;
    }
}

@media (min-width: 391px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 988px !important;
    }
}

@media (max-width: 367px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 510px !important;
    }
}

@media (min-width: 368px) and (max-width: 389px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 465px !important;
    }
}

@media (min-width: 390px) and (max-width: 395px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 420px !important;
    }
}

@media (min-width: 396px) and (max-width: 440px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 490px !important;
    }
}

@media (min-width: 441px) and (max-width: 456px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 445px !important;
    }
}

@media (min-width: 457px) and (max-width: 488px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 390px !important;
    }
}

@media (min-width: 489px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 350px !important;
    }
}

@media (min-width: 501px) and (max-width: 767px) {

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 0;
        height: 0px !important;
        margin-left: -0.50rem !important;
    }
}

@media (min-width: 401px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 10px 0 50px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 890px !important;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 10px 0 50px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 890px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .profiter {
        height: 876px;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 860px !important;
    }
}

@media (min-width: 501px) and (max-width:547px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 0px !important;
    }

}

@media (min-width: 548px) and (max-width:570px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 255px !important;
    }
}

@media (min-width: 571px) and (max-width:625px) {
    section.carte-mahassen.centre-m.fidelité .content-carte-mahassen.carte-two {
        margin-top: 215px !important;
    }
}

@media (min-width: 626px) and (max-width:655px) {
    section.carte-mahassen.centre-m.fidelité .content-carte-mahassen.carte-two {
        margin-top: 200px !important;
    }
}

@media (min-width: 656px) and (max-width:682px) {
    section.carte-mahassen.centre-m.fidelité .content-carte-mahassen.carte-two {
        margin-top: 150px !important;
    }
}

@media (min-width: 683px) and (max-width:767px) {
    section.carte-mahassen.centre-m.fidelité .content-carte-mahassen.carte-two {
        margin-top: 100px !important;
    }
}

.bloc2-app-btb.fidelité-b2b.b2b .application-img-btb .content-img {
    padding-right: 0;
}

@media (min-width: 1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 0;
    }
}

@media (min-width: 1581px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .cont-description p,
    .bloc3-app-btb.fidelité-b2b.b2b .cont-description p {
        margin-top: 20px;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 100% !important;
        padding-right: 50px !important;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 20px !important;
    }

}

@media (min-width: 1130px) and (max-width: 1580px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 100% !important;
        padding-right: 50px !important;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .cont-description p,
    .bloc3-app-btb.fidelité-b2b.b2b .cont-description p {
        margin-top: 20px;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 10px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1130px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 10px !important;
        margin-left: 10px !important;
    }

}

@media (max-width:991px) {
    .collection.mah-nouveaute.maquillage .desc_collection p {
        text-align: justify;
    }

    section.coiffure-hom.b2b-marque {
        padding: 30px 35px 35px 35px;
    }
}

@media (min-width:396px) and (max-width:470px) {
    .coiffure-hom.b2b-marque .content-img img {
        width: 100% !important;
    }

    section.coiffure-hom.b2b-marque {
        padding: 30px 35px 35px 35px;
    }
}

@media (min-width:396px) and (max-width:470px) {
    .coiffure-hom.b2b-marque .content-img img {
        width: 100% !important;
    }
}

/* @media (min-width:360px) and (max-width:500px){
    .mahassen-lives.soin.soinPeau{
        margin-top: 100px !important;
    }
} */
@media (min-width:360px) and (max-width:365px) {
    .lamarque.soinPeau {
        margin-top: 160px;
    }
}

@media (min-width:366px) and (max-width:384px) {
    .lamarque.soinPeau {
        margin-top: 130px;
    }
}

@media (min-width:768px) and (max-width:800px) {
    .lamarque.soinPeau {
        margin-top: 50px;
    }
}

section.catalogBloc.actualitéBloc::after {
    top: -10px;
}

@media (min-width:1200px) and (max-width:1676px) {
    .massage.coiffure.marque .cont-description-right {
        padding-top: 20px !important;
    }

    .massage.massage.coiffure.b2b-marque .cont-description {
        margin-top: 0px !important;
        padding-top: 50px !important;
        padding-left: 0;
        margin-left: 10px;

    }
}

@media (min-width:1201px) and (max-width:1325px) {

    .coiffure-hom.marque.block .cont-description,
    .coiffure-hom.b2b-marque .cont-description {
        padding-top: 20px !important;

    }
}

@media (max-width:767px) {
    section.coiffure-hom.b2b-marque::after {
        top: 0 !important;
        height: auto !important;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }
}

.coiffure-hom.b2b-marque .content-img {
    padding-top: 0 !important;
}


@media (min-width: 992px) and (max-width: 1200px) {
    .coiffure-hom.b2b-marque .cont-description {
        margin-top: 0 !important;
    }

    .coiffure-hom.b2b-marque::after {
        height: auto;
        top: 0;
    }

    .massage.coiffure.b2b-marque .cont-description {
        margin-left: 0 !important;
        margin-top: 0 !important;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto !important;
        top: 0;
    }

}

@media (min-width: 1100px) and (max-width: 1200px) {
    section.coiffure-hom.b2b-marque {
        margin-top: 20px !important;
    }
}

@media (min-width: 1581px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 20px !important;
        margin-top: 95px !important;
        margin-left: 53px;
        padding-left: 0;
    }
}

@media (min-width:1260px) and (max-width: 1580px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 40px !important;
        margin-top: 80px !important;
        margin-left: 53px;
        padding-left: 0;
    }
}

@media (min-width:1025px) and (max-width: 1259px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 40px !important;
        margin-top: 45px !important;
        margin-left: 53px;
        padding-left: 0;
    }

    .coiffure-hom-blogs .col-md-6.blogs h1 {
        font-size: 32px;
    }

}

@media (min-width:767px) and (max-width: 991px) {

    .coiffure-hom-blogs .col-md-6.blogsImg,
    .coiffure-hom-blogs .col-md-6.blogs {
        width: 100%;
    }
}

@media (min-width:767px) and (max-width: 1200px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-top: 50px;
        padding-bottom: 70px;
    }

    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        line-height: 35px !important;
    }
}

@media (max-width:767px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-top: 50px;
        padding-bottom: 70px;
    }

    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        line-height: 35px !important;
    }

    .actualité-blogs.blogs {
        margin-top: 0;

    }
}

@media (min-width:1166px) and (max-width: 1200px) {
    .inscriptionBlogs {
        margin-top: -85px;
    }
}

@media (max-width:500px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        font-size: 20px;
        padding-bottom: 105px;
    }

    .inscriptionBlogs {
        margin-top: -50px;
    }

}

@media (min-width:501px) and (max-width:767px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-bottom: 90px !important;
    }

    .inscriptionBlogs {
        margin-top: -50px;
    }
}

@media (max-width:1200px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan {
        display: none !important;
    }
}

@media (min-width:1740px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 52px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0;
    }
}

@media (min-width:1667px) and (max-width:1740px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 50px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0;
    }

    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 86%;
        float: left;
    }
}

.bonPlan-img-section-bottom.centre .content-image.shine img {
    width: 100%;
    height: 100%;
}

.bonPlan-img-section-bottom.centre {
    padding: 30px 35px 30px 50px;
}

@media (min-width:767px) and (max-width:1200px) {
    .bonPlan-img-section-bottom.centre .content-image.shine img {
        width: 85% !important;
        height: 100%;
    }
}

@media (max-width:767px) {
    .bonPlan-img-section-bottom.centre .content-image.shine img {
        width: 100% !important;
        height: 100%;
    }
}

@media (min-width: 1200px) and (max-width: 1346px) {
    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 100%;
        float: left;
    }

    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        margin-top: 0px;
        font-size: 32px;

    }
}

@media (min-width: 1347px) {
    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 85%;
        float: left;
    }
}

@media (max-width: 480px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .close-carte,
    .set-aside {
        height: 35px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

@media (max-width: 768px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }


    .close-carte,
    .set-aside {
        height: 59px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

@media (max-width: 1116px) and (min-width: 768px) {

    .close-carte,
    .set-aside {
        margin-bottom: 0;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }

}

@media (max-width: 767px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }
}




@media (min-width: 768px) and (max-width: 1024px) {
    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        top: -38px;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 123px;
        width: 60px;
        content: "";
    }


    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -22px;
        top: -38px;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 123px;
        width: 60px;
        content: "";
    }

    section.newsletter.soin {
        padding-top: 50px;
    }

    .mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -22px;
        top: -66px;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 123px;
        width: 60px;
        content: "";
    }

    .abonnez-vous.instagram {
        margin-top: -14px !important;
        padding: 74px;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
    }
}

@media (min-width: 1441px) {
    section.mahassen-lives .slick-next:before {
        height: 27px;

    }

    section.mahassen-lives .slick-prev:before {
        height: 27px;
    }

    .abonnez-vous.instagram {
        margin-top: -52px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    section.mahassen-lives .slick-next:before {
        /* height: 27px; */
        top: inherit;
    }

    section.mahassen-lives .slick-prev:before {
        /* height: 27px; */
        top: inherit;
    }

    .abonnez-vous.instagram {
        margin-top: 23px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
    }
}

@media (max-width: 480px) {
    section.mahassen-lives .slick-next:before {
        height: 27px;

    }

    section.mahassen-lives .slick-prev:before {
        height: 27px;
    }

    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
    }
}


.modal.produit {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
}

.modal.produit .modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    border: 1px solid #888;
    width: 50%;
    text-align: center;
}

span#closeModal {
    text-align: right;
}

.modal.produit .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.modal.produit .close:hover,
.modal.produit .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.flex-Row {
    display: flex;
    align-items: center;
    padding: 45px 20px 45px 20px;
}

.flex-Product-details {
    flex: 1;
}

.flex-Product {
    width: 40%;
}

#productModal .promo-price {
    font-size: 16px;
    font-weight: bold !important;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    margin-bottom: 5px;
}

#productModal .initial-price {
    font-size: 16px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
}

#modalImage {
    width: 80%;
}

#modalProductName {
    text-transform: capitalize;
    font-weight: 600;
}

.modal-buttons {
    margin-top: 20px;
    /* Espacement au-dessus des boutons */
}

.modal-buttons button {
    padding: 12px 20px;
    margin-right: 10px;
    cursor: pointer;
    border: none;
    background: black;
    color: white;
    font-family: "Century Gothic", sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;

}

.modal-buttons button:hover {
    background: white;
    color: black;
    border: 1px solid black;
}

.modal-valid div {
    padding-top: 30px;
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.02rem;
    text-align: center;
}

.modal-content span {
    font-family: "Century Gothic", sans-serif;
    font-weight: 600;
    font-size: 16px;
}

.notification {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 450px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity 0.3s ease;
}


.modal-valid {
    background: #f5f5f5;
    padding: 10px 50px;
    border-radius: 5px;
}



.notification-content {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 10px;
    margin-bottom: 15px;


}

#notificationProductName {
    font-size: 16px;
    font-family: var(--Brand_title_fonts);
    text-transform: capitalize;
    font-weight: 600;
    margin-bottom: 10px;
}

#notificationPrice .promo-price {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    font-size: 14px;
}

.notification img {
    width: 30%;
    height: 30%;
    margin-right: 15px;

}

.notification-buttons {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 10px
}

.notification-buttons button {
    padding: 10px 7px;
    border: none;
    background: black;
    color: white;
    font-size: 12px;
    cursor: pointer;
}

.notification-buttons button:hover {
    background: white;
    color: black;
    border: 1px solid black;
}

img.hammem {
    width: auto;
    height: 100%;
}


#notificationPrice {
    text-align: center;
}

.bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before,
.bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {}



/* Start Mahaseen live section  */

@media (min-width: 1921px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 20px !important;
        top: -94px !important;
    }

    section.newsletter {
        padding: 50px 0 45px !important;
        text-align: center;
    }

    .newsletter {
        margin-top: -31px !important;
    }

    .Avis-mah-Centre section.avis-clients {
        padding: 0;
        /* top: 57px; */
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -24px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 132px !important;
        width: 60px;
        content: "";
    }


}


@media (min-width: 1601px) and (max-width: 1920px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 20px !important;

    }


    /* .carousel-maquillage .slick-next:before, .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -64px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    } */

    /* .carousel-maquillage .slick-prev:before, .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 20px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    } */

    .Avis-mah-Centre section.avis-clients {
        /* margin-top: -100px; */
        padding: 20px;
        top: 17px;
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px;
        width: 60px;
        content: "";
        top: -28px;
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 40px;
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -12px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 121px !important;
        width: 60px;
        content: "";
        top: -81px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 98px; */
    }

    .carousel-maquillage .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 20px !important;
        width: 60px;
        content: "";
        left: 3px !important;
    }
}



@media (min-width: 1024px) and (max-width: 1200px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        /* margin-top: 20px !important; */
        /* top: 39px !important; */
    }

    .Avis-mah-Centre section.avis-clients {
        padding: 0;
        /* top: 16px; */
        /* margin-top: 74px; */
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 461px !important; */
        width: 60px;
        content: "";
        top: 63px;
    }

}


@media (min-width: 1201px) and (max-width: 1440px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
    }

    .Avis-mah-Centre section.avis-clients {
        padding: 39px;
        /* margin-top: 40px !important; */
        /* top: 105px; */
    }

    /* .Centre-m {
        padding-bottom: 100px;
    } */

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -47px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
        left: -13px;

    }


}


@media (min-width: 1441px) and (max-width: 1600px) {
    section.mahassen-lives {
        padding: 30px 60px 80px 30px !important;
        position: relative;
        margin-top: 20px !important;

    }

    .Avis-mah-Centre section.avis-clients {
        /* padding: 20px; */
        /* top: 116px; */
        /* margin-top: 53px; */
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 128px !important;
        width: 60px;
        content: "";
        top: -79px;
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -24px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px;
        width: 60px;
        content: "";
        top: -22px;
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -26px !important;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px !important;
        width: 60px;
        left: -16px !important;
        content: "";
    }


}

@media (min-width: 991px) and (max-width: 768px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 10px !important;
        top: 96px;
    }

    .Avis-mah-Centre section.avis-clients {
        padding: 0;
        /* top: 57px; */
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 461px !important;
        width: 60px;
        content: "";
    }


}


@media (min-width: 300px) and (max-width: 374px) {

    section.newsletter {
        padding: 100px 0 50px !important;

    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 69px !important;
        width: 60px;
        top: -237px;
        content: "";
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        width: 51px;
        height: 51px !important;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px;
        top: -228px;
        width: 60px;
        content: "";
    }

    /* section.mahassen-lives .slick-next:before {
        height: 124px !important;
    }

    section.mahassen-lives .slick-prev:before {
        height: 124px !important;
    } */

    .Avis-mah-Centre section.avis-clients {
        /* margin-top: 100px !important; */

    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 461px !important;
        width: 60px;
        content: "";
    }


}

@media (min-width: 375px) and (max-width: 400px) {

    /* .Avis-mah-Centre section.avis-clients {
        top: 316px;
        margin-top: 100px;
        height: 744px;
    } */

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        /* height: 134px !important; */
        width: 60px;
        content: "";
    }


    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        width: 51px;
        height: 50px;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 135px; */
        width: 60px;
        content: "";
    }

    section.newsletter {
        padding: 80px 0 50px !important;
        /* margin-top: 80px; */
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px !important;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        width: 60px;
        content: "";
    }

    section.product-cosmetique.maquillage {
        margin-bottom: 15px;
    }

}


@media (min-width: 401px) and (max-width: 460px) {
    section.newsletter {
        padding: 50px 0 50px !important;
    }


    section.product-cosmetique.maquillage {
        margin-bottom: 15px;
    }

    .Avis-mah-Centre section.avis-clients {
        /* padding: 36px;
        margin-bottom: 50px; */

    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        /* left: -27px; */
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 130px !important; */
        width: 60px;
        content: "";
        top: -80px;
    }

    /* .avis-home {
        padding-top: 42px;
    } */

}

@media (max-width: 500px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 36px;
        margin-top: 100px;
        margin-bottom: 142px;
        top: 132px;
    } */

    /* .Centre-m {
        padding-bottom: 50px;
    } */
}

@media (min-width: 500px) and (max-width: 560px) {
    section.newsletter {
        padding: 14px 0 45px;
        text-align: center;
        /* margin-top: 167px; */
        top: 50px;
    }

    .Avis-mah-Centre section.avis-clients {
        /* padding: 36px;
        margin-top: 100px;
        margin-bottom: 94px;
        top: 24px; */
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: -23px;
        width: 60px;
        top: -78px;
        content: "";
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -23px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px !important;
        width: 60px;
        top: -87px;
        content: "";
    }
}

/* End Mahaseen live section */


/* Start abonnez-vous section */
@media (min-width: 1921px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 36px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -80px;
    }



}

@media (min-width: 1601px) and (max-width: 1920px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    .fidelite-mahassen {
        max-height: 1267px;
        margin-bottom: 100px;
    }


    section.autonome.home .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 4px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 120px;
        width: 60px;
        content: "";
        top: -148px;
    }

    section.maquillage.home .content-autonome-desc {
        padding-left: 50px;
    }

    section.autonome.home .slick-prev:before,
    .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -39px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 120px;
        width: 60px;
        content: "";
        top: -7px;
    }

}

/* @media (min-width: 1024px) and (max-width: 1200px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 10px !important;
    }
} */


/* @media (min-width: 1201px) and (max-width: 1440px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }


    section.collection.home .collection_hiver .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -4px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.collection.home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: -16px;
        width: 60px;
        content: "";
        top: -26px !important;
        right: 134px;
    }


    .carousel-item img {
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }


    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        position: absolute;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 16px;
        width: 60px;
        content: "";
        top: 6px !important;
        font-size: 51px;
        position: absolute;
        left: -25px;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 10px !important;
    }
} */

/* @media (min-width: 768px) and (max-width: 991px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }


    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 26px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -114px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 69px;
        right: 93px;
    }
}


@media (min-width: 300px) and (max-width: 374px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 83px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
        right: 121px;
    }

    .avis-home {
        padding-top: 47px;
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -35px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }

    section.autonome.home .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: 186px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 31px;
        width: 60px;
        left: -16px;
        height: -17px !important;
        top: -15px !important;
        content: "";
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 13px;
    }

    p.text-bon-plan {
        font-size: 11px;
    }
} */

/* End abonnez-vous section */

/* Start Carte fidélité section */
@media (min-width: 1921px) {

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

    .fidelite-mahassen {
        max-height: max-content;

    }


}


@media (min-width: 1601px) and (max-width: 1920px) {

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 189px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: 93px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    .fidelite-mahassen {
        max-height: 1267px;
        margin-bottom: 100px;
    }

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    .Centre-m {
        padding-bottom: 100px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 50px;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 8px;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
        top: -1px;
    }

    section.maquillage .content-autonome-desc {
        margin-left: 54px;

    }

}



@media (min-width: 1024px) and (max-width: 1200px) {


    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 120px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: 0px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    .Centre-m {
        padding-bottom: 100px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
        padding-top: 20px;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

}


@media (min-width: 1201px) and (max-width: 1440px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-bottom: 0;
        top: 0px !important;
        padding-top: 40px;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 12px;
        width: 60px;
        content: "";
    }

}


@media (min-width: 1441px) and (max-width: 1600px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 0px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 600px !important; */
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }



    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 205px !important;
        top: 153px !important;
        width: 60px;
        content: "";
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 205px !important;
        top: 153px !important;
        width: 60px;
        left: -16px;
        content: "";
    }

    .fidelite-mahassen .carte-mahassen.centre-m {
        /* padding: 50px 0 !important; */
        padding: 50px 35px 20px;
    }

}


@media (min-width: 300px) and (max-width: 374px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    /*
    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    } */

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

    .product-slider-idees.pro .slick-next.slick-arrow:before {
        width: 60px;
        top: 62px;
        right: 0px;
        bottom: 0;
        left: -8px;
    }

}

@media (min-width: 375px) and (max-width: 400px) {

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

}


@media (min-width: 401px) and (max-width: 460px) {

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.newsletter {
        padding: 10px 0 50px !important;

    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        /* margin-bottom: 20px !important; */
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

}

@media (min-width: 500px) and (max-width: 560px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

}

/* End Carte fidélité section */


}

@media(min-width:360px) and (max-width:490px) {

    section.coiffure-hom::after,
    section.massage.coiffure.marque::before {
        height: 250px;
        top: 0px;
    }

}

@media(min-width:391px) and (max-width:500px) {

    section.coiffure-hom::after,
    section.massage.coiffure.marque::before {
        height: 277px;
        top: 0px;
    }


}

@media(min-width:360px) and (max-width:500px) {


    section.coiffure-hom.b2b::after {
        height: 250px;
        top: 45px;
    }

    section.massage.coiffure::before {
        height: 220px;
        top: -20px;
    }

    .massage.coiffure.mah-Centre::before {
        height: 420px;
        top: -5px;
    }

    .coiffure-hom img,
    .massage.coiffure img {
        /* height: 180px !important; */
    }

    .coiffure-hom.b2b img {
        height: 220px !important;
    }

    .massage.coiffure .hamam-img img {
        margin-right: -20px;
    }

    .massage.coiffure.marque .hamam-img img {
        margin-right: 0px;
    }
}

@media (max-width: 480px) {

    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 97px;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 50px;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    section.icons {
        padding: 5px 0;
        text-align: center;
        margin-top: 50px;
    }
}

@media (min-width: 1025px) and (max-width: 1440px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    section.icons.page-la-marque {
        padding-bottom: 20px;
        padding-bottom: 50px 0;
    }

    section.icons {
        padding: 5px 0;
        text-align: center;
    }
}


@media(max-width:500px) {
    section.massage.coiffure .content-img {
        height: auto;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        padding-top: 0;
    }

    .header-marketing .header-marketing-icons {
        gap: 10px !important;
    }

    .header-marketing .header-marketing-icons a {
        gap: 10px !important;
        right: -165px;
        padding: 7px !important;
        font-size: 14px;
    }

    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        margin-left: 0;
    }
}

@media(min-width:501px) and (max-width:767px) {
    .header-marketing .header-marketing-icons a:hover {
        right: 0;
    }

    .header-marketing .header-marketing-icons {
        gap: 20px;
    }

    .header-marketing .header-marketing-icons a {
        gap: 13px;
        right: -190px;
        padding: 10px !important;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        margin-left: 0;
    }

    section.coiffure-hom::after {
        height: 365px;
        top: 45px;
    }

    section.massage.coiffure::before {
        height: 365px;
        top: -35px;
    }

    section.massage.coiffure.mah-Centre::before {
        height: 525px;
        top: -5px;
    }

    .coiffure-hom img,
    .massage.coiffure img {
        /* height: 300px !important; */
    }
}

@media(min-width:768px) and (max-width:991px) {

    section.massage.coiffure::before {
        height: 450px;
        top: 60px;
    }

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;

    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 50px !important;
    }

    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        /* padding-top: 100px; */
        margin-left: 0px;
    }

    section.coiffure-hom::after {
        height: 450px;
        top: 60px;
    }

    .coiffure-hom .col-md-6 .cont-description p,
    .massage.coiffure .col-md-6 .cont-description p {
        margin-bottom: 0px;
    }

    section.massage.coiffure .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 100px !important;
    }

    .massage.coiffure .hamam-img .content-img {

        height: 0px !important;
    }

    .massage.coiffure.b2b-marque .hamam-img .content-img {

        height: auto !important;
    }

    .massage.coiffure.b2b-marque .hamam-img .content-img {

        height: auto !important;
    }

    section.product-cosmetique.recomd {
        padding: 36px 20px 20px !important;
    }
}

@media (min-width:992px) and (max-width:1024px) {
    section.massage.coiffure::before {
        height: 450px;
        top: 60px;
    }
}

@media (min-width:992px) and (max-width:1200px) {

    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;
        max-width: none !important;

    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }


    section.coiffure-hom .content-img-left,
    section.coiffure-hom .content-img {
        padding-top: 70px;
        margin-left: 0px;
    }

    section.coiffure-hom::after {
        height: 450px;
        top: 60px;
    }

    section.coiffure-hom.marque.block::after {
        height: 500px;
        top: 0px;
    }

    .coiffure-hom .col-md-6 .cont-description p,
    .massage.coiffure .col-md-6 .cont-description p {
        margin-bottom: 0px;
    }

    section.mahassen-lives .mahassen-live-desc p,
    .cont-description p {
        font-family: "Century-Gothic-Std", "Century Gothic";
        font-size: 15px;
        text-align: justify;
        line-height: 35px;
        /* padding-right: 20px; */
    }

    section.massage.coiffure .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 0px !important;
    }

    section.massage.coiffure.b2b-marque .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 0 !important;
    }

    section.massage.coiffure.b2b-marque .hamam-img .content-img {
        padding-right: 0px !important;
        margin-right: 0px !important;
        padding-top: 0 !important;
    }

    .massage.coiffure .hamam-img .content-img {
        height: 0px !important;
    }

    .massage.coiffure.marque .hamam-img .content-img {
        height: auto !important;
    }

    section.product-cosmetique.recomd {
        padding: 0px 20px 20px !important;
    }
}

@media (min-width:911px) and (max-width:939px) {
    section.brochure-homme {
        margin-top: 30px;
    }
}

@media (min-width:940px) and (max-width:1058px) {
    section.brochure-homme {
        margin-top: 60px;
    }
}

@media (min-width:1059px) and (max-width:1200px) {
    section.brochure-homme {
        margin-top: 90px;
    }
}

@media (min-width:1201px) and (max-width:1399px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 15px !important;
        text-align: justify;
        line-height: 29px;
    }

    .content-img.brochure img {
        top: 0px !important;
        width: 350px !important;
        max-width: none !important;
    }
}

@media (min-width:1400px) {
    .content-img.brochure img {
        top: 0px !important;
        width: 500px !important;
        max-width: none !important;
    }

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
        font-size: 16px !important;
        text-align: justify;
        line-height: 32px;
    }
}

@media (min-width:1677px) {

    .coiffure-hom .cont-description p span,
    .massage.coiffure .cont-description p span {
        font-size: 18px !important;
        line-height: 35px;
    }

    section.collection .desc_collection h2,
    section.autonome .content-autonome-desc .title-maquillage-pro,
    section.maquillage .content-autonome-desc h2,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute h2,
    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2,
    section.newsletter h2 {
        font-size: 32px !important;
    }

    .massage.coiffure .hamam-img .content-img {
        margin-right: 0px !important;
        padding-right: 0px !important;
    }
}

@media (min-width:1201px) and (max-width:1676px) {

    section.brochure-homme {
        margin-top: 90px;
    }

    section.abonnez-vous.instagram {
        padding: 0px 30px 0px !important;

    }
}

@media (min-width:1200px) and (max-width:1325px) {

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 20px !important;
    }

    /* .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description-right {
        margin-top: 20px !important;
    } */

    section.coiffure-hom::after {
        top: 20px;
        height: 490px;
    }

    section.massage.coiffure::before {
        height: 490px;
        top: 30px;
    }
}

@media (min-width:1326px) and (max-width:1450px) {

    .coiffure-hom .col-md-6 .cont-description,
    .massage.coiffure .col-md-6 .cont-description {
        /* margin-top: 50px !important; */
    }

    section.coiffure-hom::after {
        top: 20px;
        height: 530px;
    }

    section.massage.coiffure::before {
        height: 520px;
        top: 30px;
    }
}

@media (min-width: 1201px) and (max-width: 1676px) {
    section.abonnez-vous.instagram {
        padding: 2px 30px 0px !important;
    }
}

@media (min-width:1450px) and (max-width:1580px) {
    section.coiffure-hom::after {
        top: 50px;
        height: auto;
    }

    .coiffure-hom.b2b-marque::after {
        top: 0;
        height: auto;
    }

    .coiffure-hom.b2b-marque::after {
        top: 0;
        height: auto;
    }

    section.massage.coiffure::before {
        height: 550px;
        top: 50px;
    }

    .brochure-homme .decouvrir {
        font-size: 16px !important;
    }

    section.brochure-homme {
        margin-top: 125px;
    }

    .coiffure-hom .col-md-6 .cont-description {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 90px !important;
    }

    .massage.coiffure .content-img img {
        height: 450px !important;
    }

}

@media (min-width:768px) {
    .brochure-homme .container-fluid .col-sm-12.brochure img {
        width: 100%;
    }
}

@media (max-width:395px) {
    .abonnez-vous.instagram.soin {
        margin-top: -200px !important;
    }
}

@media (min-width:396px) and (max-width:399px) {
    .abonnez-vous.instagram.soin {
        margin-top: -160px !important;
    }
}

@media (min-width:1581px) {

    .massage.coiffure .content-img img,
    .coiffure-hom .content-img-left img {
        height: 450px !important;
        object-fit: cover;
    }

    .massage.coiffure .content-img-la-marque img,
    .coiffure-hom .content-img-left img {
        /* height: 450px !important; */
        object-fit: cover;
    }

    section.coiffure-hom::after {
        top: 50px;
        height: auto;
    }

    section.massage.coiffure::before {
        height: 550px;
        top: 50px;
    }

    .brochure-homme .decouvrir {
        font-size: 18px !important;
    }

    section.brochure-homme {
        margin-top: 125px;
    }

    .coiffure-hom .col-md-6 .cont-description {
        margin-top: 60px !important;
    }

    .coiffure-hom .col-md-6 .cont-description-right {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description {
        margin-top: 90px !important;
    }

    .coiffure-hom .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }

    .coiffure-hom .cont-description-right {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }


    .coiffure-hom .col-md-6 .cont-description-right {
        margin-top: 60px !important;
    }

    .massage.coiffure .col-md-6 .cont-description-right {
        margin-top: 90px !important;
        width: 85%;
        padding-left: 20px;
    }

    .coiffure-hom .cont-description-right {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    section.lamarque.soinPeau .cont-description-la p,
    .cont-description p {
        font-size: 18px !important;
        text-align: justify;
    }

    section.collection .desc_collection p,
    section.autonome .content-autonome-desc p,
    section.nouveaute .content-noveaute-desc .contnet-nouveaute p,
    section.maquillage .content-autonome-desc p,
    section.mahassen-lives .mahassen-live-desc p,
    .cont-description-right p {
        font-size: 18px !important;
    }

    section.massage .hamam-img {
        position: relative;
        left: 13px;
        top: 43px;
    }

    .massage.coiffure .hamam-img .content-img {
        margin-right: 0px;
        padding-right: 0px;
    }
}


/*End responsive page femme*/
/*star responsive maquiallage pro*/
@media (max-width:767px) {
    .collection.mah-nouveaute.maquillage.pro .content-img.shine {
        height: 330px;
    }

    .collection.mah-nouveaute.maquillage.pro p {
        text-align: justify;
    }

    section.collection.mah-nouveaute.maquillage.pro .desc_collection .spa.maquillage {
        margin-top: 0px;
        height: 0 !important;
        margin-bottom: 80px;
    }

}

@media (max-width:500px) {
    .product-cosmetique.recomd.pro .btn-ajouter.ajouter.shine {
        font-size: 12px !important;
        padding: 0px !important;
    }
}

@media (min-width:501px) and (max-width:767px) {
    .product-cosmetique.recomd.pro .btn-ajouter.ajouter.shine {
        height: 40px !important;
        font-size: 12px !important;
        padding: 0px !important;
    }
}

/*end responsive maquiallage pro*/
/*Start responsive page marque*/
@media (min-width:768px) and (max-width:1024px) {

    section.abonnez-vous.marque,
    .marque-abonnez .abonnez-vous.instagram {
        padding: 10px 50px;
    }
}

/*End responsive page marque*/


/*Start responsive page programmeFidelité*/
@media (max-width:395px) {
    .content_slider .header-marketing .header-marketing-desc p {
        font-size: 14px;
    }
}

@media (max-width:767px) {
    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 {
        padding: 0px 35px 10px 35px;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    section.bloc2-app.bloc2 .cont-description h2 {
        font-size: 22px;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .cont-description h2 {
        font-size: 22px;
    }

    section.bloc3-app.bloc3 {
        padding: 0px 35px 0px 35px;
    }

    .carte-mahassen.centre-m.fidelité {
        padding: 50px 0 0px;
    }
}

@media (min-width:768px) and (max-width:975px) {

    .bloc2-app.bloc2 .col-md-6,
    .bloc3-app.bloc3 .col-md-6 {
        width: 100%;
    }

    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 40px;
    }

    .bloc2-app.bloc2 .cont-description {
        margin-top: 0px;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .row {
        display: flex;
        flex-direction: column;
    }

    section.bloc3-app.bloc3 .row .col-md-6.flex {
        order: 2;
    }
}

@media (min-width:976px) and (max-width:1024px) {
    section.bloc2-app.bloc2 .content-img {
        left: 0;
        top: 0;
        padding-right: 0px;
    }

    section.bloc2-app.bloc2 .img-bloc2-app {
        left: 0;
        top: 0;
    }

    section.bloc2-app.bloc2 .col-md-6.order-md-2,
    section.bloc3-app.bloc3 .col-md-6 {
        display: flex;
        align-items: center;
    }

    section.bloc3-app.bloc3 .content-img-left {
        padding-top: 0px;
        margin-left: 0px;
    }

    section.bloc3-app.bloc3 .content-img-left IMG {
        width: 100%;
    }

    section.bloc3-app.bloc3 {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1024px) and (max-width:1199px) {
    section.bloc3-app.bloc3 .content-img-left {
        margin-left: 0;
        padding-top: 40px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0px;
    }

    .bloc3-app.bloc3 .col-md-6 {
        padding-left: 30px;

    }

}

@media(min-width: 1200px) and (max-width: 1676px) {
    .bloc2-app.bloc2 .cont-description {
        width: 100%;
        padding-right: 15px !important;
    }

    .bloc3-app.bloc3 .cont-description {
        width: 100%;
        padding-left: 50px !important;
        padding-right: 20px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0;
    }
}

@media(min-width: 1677px) {
    .bloc2-app.bloc2 .cont-description {
        width: 100%;
        padding-right: 50px !important;
    }

    .bloc3-app.bloc3 .cont-description {
        width: 100%;
        padding-left: 50px !important;
        padding-right: 20px;
    }

    section.bloc2-app.bloc2 .content-img {
        padding-right: 0;
    }

    section.bloc3-app.bloc3 .content-img-left {
        margin-left: 0;
    }
}

/*End responsive page programmeFidelité*/
/* start responsive catalogue produit */
@media (max-width: 1195px) and (min-width: 933px) {
    .filter .card-footer button {
        padding: 8px 20px;
        font-size: 13px;
        width: auto;
    }
}

/* End responsive catalogue produit */

/* start responsive page nos marque */
@media (max-width: 768px) {
    .col-xl-3.col-lg-4.col-md-6.col-sm-12.nos-marque {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .row.nos-marque {
        padding-bottom: 30px;
    }

    .logo-item {
        width: 100%;
        text-align: center;
    }

    .img-logo-item img,
    .img-logo-item video {
        max-width: 100%;
        height: auto;
    }

    .logo-desc p {
        font-size: 12px;
    }
}

@media (max-width: 992px) {
    .col-lg-3.col-md-4.col-sm-6.col-xs-12.nos-marque {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}



@media (max-width: 852px) and (min-width: 569px) {
    .contents-img {
        display: flex;
        gap: 20px;
        width: 100%;
        justify-content: center;
    }

    .content-one {
        width: 100%;
        display: flex;
        justify-content: center;
        gap: 20px;
    }

    .content-one-img {
        width: calc(50% - 10px);
        box-sizing: border-box;
    }

    section.fond-de-tient-details .contents-img .content-one {
        display: flex;
        gap: 20px;
    }

    section.fond-de-tient-details .contents-img .content-one {
        flex-direction: row;
        gap: 20px;

    }
}

@media (max-width: 933px) {
    .ul-nav-n2 {
        left: unset !important;
    }
}


@media (max-width: 568px) {
    .contents-img {
        display: block;
    }

    .content-one {
        display: block;
        width: 100%;
    }

    .content-one-img {
        width: 100%;
        margin-bottom: 20px;
    }
}


/*End responsive page B2B*/

/*Start responsive page Fidelité-B2B*/
@media (max-width:767px) {

    .bloc1-app.fidelité-b2b span,
    .bloc2-app-btb.fidelité-b2b .cont-description div {
        font-size: 15px !important;
        font-family: "Century-Gothic-Std", "Century Gothic" !important;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb .content-img {
        padding-right: 0px;
    }

    .carte-mahassen.centre-m.b2b {
        padding: 0;
    }

    section.bloc3-app-btb.fidelité-b2b {

        padding: 0 35px;
    }

    .catalogBloc.actualitéBloc::after {
        width: 45% !important;
        height: 35%;
    }
}

@media (min-width:768px) and (max-width:1024px) {

    .bloc2-app-btb.fidelité-b2b .col-md-6,
    .bloc3-app-btb.fidelité-b2b .col-md-6 {
        width: 100%;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    .bloc3-app-btb.fidelité-b2b .row {
        display: flex;
        flex-direction: column;
    }

    .bloc3-app-btb.fidelité-b2b .row .col-md-6.order-md-1 {
        order: -1 !important;
    }

    section.bloc3-app-btb.fidelité-b2b {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1667px) {

    section.bloc3-app-btb.fidelité-b2b .cont-description,
    section.bloc2-app-btb.fidelité-b2b .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
        margin-top: 50px;

    }

}

/*End responsive page Fidelité-B2B*/
/*Start responsive page Panier*/
@media (max-width:767px) {
    .cart-recomm {
        margin-bottom: 50px;
    }
}

@media (max-width:500px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 12px;
        white-space: nowrap;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 12px;
        line-height: 18px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }

    .bloc-carte .px-3 {
        padding-right: 7px !important;
        padding-left: 7px !important;
    }
}

@media (min-width:400px) {
    .d-none {
        display: table-cell !important;
    }

}

@media (min-width:500px)and (max-width:767px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 14px;
        white-space: nowrap;
    }

    .bloc-carte .img-product-carte {
        max-width: 80px;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 14px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }

    section.nouveaute .content-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .content-noveaute-desc {
        padding-top: 0px;
    }
}

@media (min-width:768px)and (max-width:1024px) {

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 15px;
        text-align: left;

    }

    .block-cart .d-md-flex {
        display: block !important;
    }

    th.product-remove {
        white-space: nowrap;
    }

    .btn-carte.d-block {
        display: block !important;
    }

}

@media (min-width:1025px)and (max-width:1200px) {
    .border.rounded-pill-shape.py-1.px-3 {

        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .table>:not(caption)>*>* {
        padding: .5rem .2rem;
    }

    .bloc-carte th.product-remove {
        white-space: nowrap;
    }
}

/*End responsive page Panier*/
/*Start responsive page centre mahassen*/

/*End responsive page centre mahassen*/
/* End responsive page nos marque */





/*End responsive page Actualité*/
/*start responsive page B2B*/

@media (max-width:767px) {
    .catalogBloc.actualitéBloc p.cont-description-b2b {
        padding-top: 20px;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding: 0px 0 40px;
        margin-top: 0px !important;
    }

    .product-cosmetique.recomd.b2b {
        padding: 40px 20px 20px 20px !important;
    }

    .coiffure-hom.b2b .cont-description,
    .coiffure-hom.b2b .cont-description p {
        text-align: center;

    }

    .coiffure-hom.b2b .detail-contact {
        margin-left: 0;
    }

    .coiffure-hom.b2b .image.mail {
        height: auto !important;
    }

    .coiffure-hom.b2b .color-noir {
        margin-bottom: 0 !important;
        font-size: 16px;
    }

    .brochure-homme.b2b .brochure-image {
        width: 100%;
    }

    .coiffure-hom.b2b .detail-contact {
        display: inline-block;
        width: 100%;
        margin-top: 0;
    }

    .coiffure-hom.b2b .image.phone {
        height: auto !important;
    }

    .coiffure-hom.b2b .bloc-right-contact {
        margin: 0;
        margin-top: 70px;
    }

    .coiffure-hom.b2b .icons-detail-contact {
        display: flex;
        justify-content: center;
    }

    .coiffure-hom.b2b .rs-contact .icons-detail-contact img {
        height: auto !important;
    }

    .coiffure-hom.b2b .detail-socialmedia {
        margin-top: 20px;
        margin-left: 0;

    }

    .coiffure-hom.b2b .detail-socialmedia p,
    .coiffure-hom.b2b .detail-socialmedia .rs-contact {
        display: flex;
        justify-content: center;
    }

    section.newsletter.b2b {
        padding: 50px 0 50px !important;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    section.catalogBloc.actualitéBloc:after {
        width: 45%;
        height: 35%;
    }

    .catalogBloc.actualitéBloc .cont-description-b2b {
        margin-top: 100px;
    }

    .brochure-homme.b2b .brochure-image {
        width: 100%;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding-top: 0 !important;
        margin-top: 0px !important;
    }

    section.product-cosmetique.recomd.b2b {
        padding: 50px 20px 20px !important;
    }

    .coiffure-hom.b2b .col-md-4 {
        width: 50%;
    }

    section.coiffure-hom.b2b::after {
        height: 400px;
        top: 110px;
    }

    section.coiffure-hom.b2b .col-md-6 .bloc-right-contact {
        margin: 0 40px;
        padding-left: 50px;
    }

    section.coiffure-hom.b2b .detail-contact {
        display: inline-block;
        margin-left: 0;

    }

    section.coiffure-hom.b2b .detail-socialmedia {
        margin-left: 0;
    }

    .coiffure-hom.b2b .col-md-6 {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .client-b2b.Article {
        padding: 30px 0;
    }

    .newsletter.b2b {
        padding-top: 20px;
    }

    section.coiffure-hom.b2b .content-img {
        padding-top: 75px;
    }

    section.coiffure-hom.b2b .color-noir {
        font-size: 16px;
    }

    section.coiffure-hom.b2b .content-img img {
        width: 370px;
        height: 350px;
    }

    section.icons.b2b {
        padding: 0;
    }
}




/*End responsive page B2B*/

/*Start responsive page Fidelité-B2B*/
@media (max-width:767px) {

    .bloc1-app.fidelité-b2b span,
    .bloc2-app-btb.fidelité-b2b .cont-description div {
        font-size: 15px !important;
        font-family: "Century-Gothic-Std", "Century Gothic" !important;

    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb .content-img {
        padding-right: 0px;
    }

    .carte-mahassen.centre-m.b2b {
        padding: 0;
    }

    section.bloc3-app-btb.fidelité-b2b {

        padding: 0 35px;
    }
}

@media (min-width:768px) and (max-width:1024px) {

    .bloc2-app-btb.fidelité-b2b .col-md-6,
    .bloc3-app-btb.fidelité-b2b .col-md-6 {
        width: 100%;
    }

    section.bloc2-app-btb.fidelité-b2b .application-img-btb,
    section.bloc3-app-btb.fidelité-b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    .bloc3-app-btb.fidelité-b2b .row {
        display: flex;
        flex-direction: column;
    }

    .bloc3-app-btb.fidelité-b2b .row .col-md-6.order-md-1 {
        order: -1 !important;
    }

    section.bloc3-app-btb.fidelité-b2b {
        padding: 0px 35px 35px 35px;
    }
}

@media (min-width:1667px) {

    section.bloc3-app-btb.fidelité-b2b .cont-description,
    section.bloc2-app-btb.fidelité-b2b .cont-description {
        width: 85%;
        padding-left: 20px;
        margin-left: 33px;
        margin-top: 50px;

    }

}

/*End responsive page Fidelité-B2B*/
/*Start responsive page Panier*/
@media (max-width:767px) {
    .cart-recomm {
        margin-bottom: 50px;
    }
}

@media (max-width:500px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 12px;
        white-space: nowrap;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 12px;
        line-height: 18px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }

    .bloc-carte .px-3 {
        padding-right: 7px !important;
        padding-left: 7px !important;
    }
}

@media (min-width:400px) {
    .d-none {
        display: table-cell !important;
    }

}

@media (min-width:500px)and (max-width:767px) {

    th.product-name,
    th.product-price,
    th.product-quantity,
    th.product-subtotal,
    th.product-remove {
        font-size: 14px;
        white-space: nowrap;
    }

    .bloc-carte .img-product-carte {
        max-width: 80px;
    }

    th.product-name {
        padding-bottom: 12px;
    }

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 14px;
    }

    .btn-carte.d-block .mb-3.mb-md-0 {
        display: flex;
        justify-content: center;
    }
}

@media (min-width:768px)and (max-width:1024px) {

    .bloc-carte a.title-product-carte,
    .bloc-carte .price-product-carte,
    .bloc-carte .total-product-carte {
        font-size: 15px;
        text-align: left;

    }

    .block-cart .d-md-flex {
        display: block !important;
    }

    th.product-remove {
        white-space: nowrap;
    }

    .btn-carte.d-block {
        display: block !important;
    }

}

@media (min-width:1025px)and (max-width:1200px) {
    .border.rounded-pill-shape.py-1.px-3 {

        padding-left: 5px !important;
        padding-right: 5px !important;
    }

    .table>:not(caption)>*>* {
        padding: .5rem .2rem;
    }

    .bloc-carte th.product-remove {
        white-space: nowrap;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .close-carte,
    .set-aside {
        height: 35px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

/*End responsive page Panier*/
/*Start responsive page centre mahassen*/
@media (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        text-align: justify;
    }

    section.hamam.mah-Centre {
        padding: 0px;
        margin: 0;
        padding-top: 40px !important;
    }

    section.hamam.mah-Centre .cont-description {
        margin-top: 150px;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        bottom: -30%;
    }

    section.massage.mah-Centre:after {
        height: 420px;
        top: 0px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -200px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        bottom: 51px;
        left: 30px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100% !important;
    }

    .esthetique-home.mah-Centre .slick-list {
        padding-top: 20px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {

        width: 100%;
    }

    section.esthetique-home.mah-Centre {
        padding: 35px 0 35px;
    }

    /* .Avis-mah-Centre section.avis-clients {
        margin-top: 150px;
        padding: 0 0 70px 0;
    } */

    section.esthetique-home.mah-Centre .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 40px;
        width: 60px;
        content: "";
    }

    section.product-cosmetique button.slick-next.slick-arrow,
    section.product-cosmetique button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .esthetique-home.mah-Centre .content-slider-home .slick-list .slick-slide .slider__item .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre .slick-prev:before {
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 66px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 40px;
        width: 60px;
        content: "";
        z-index: 9999;
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 290px;
        width: 290px;
    }

}

@media(min-width:483px) and (max-width:767px) {
    section.massage.mah-Centre {
        padding: 0 !important;
    }
}

@media(min-width:501px) and (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0px;
    }
}

@media(max-width:551px) {
    .massage.coiffure.mah-Centre .carousel-item img {
        height: 350px !important;
    }

    .massage.mah-Centre .carousel-item.shine img {
        height: 350px;
        width: 100%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 55%;
    }

    section.esthetique-home.mah-Centre .content-img2 img {
        position: absolute;
        right: 0;
        z-index: 9999;
        height: 220px;
        width: 220px;
        top: -145px;
        left: auto;
    }
}

@media(min-width:551px) and (max-width:767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 50px 0 0 !important;
    }

    .massage.coiffure.mah-Centre .carousel-item img {
        height: 450px !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -260px;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-prev:before {
        bottom: 20px;
    }

    .massage.mah-Centre .carousel-item.shine img {
        height: 500px;
        width: 100%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 50%;
        margin-bottom: 15px;
    }
}

@media(min-width:601px) and (max-width:991px) {
    .content-imgMahassen {
        width: 90%;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 50%;

    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        width: 500px;
        position: absolute;
        height: 250px;
        bottom: -70px;
        right: -270px;
        left: auto;
    }

    .hamam.mah-Centre .col-md-6 {
        width: 35%;
    }

    .massage.mah-Centre .carousel.slide img {
        height: 400px;
        margin-bottom: 20px;
    }

    section.massage.coiffure.mah-Centre::before {
        height: 100% !important;
        top: 0 !important;
    }

    .massage.coiffure.mah-Centre .carousel-maquillage .slick-next:before {
        bottom: -265px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 0;
    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -20px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -20px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 100px;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -50px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -20px !important;
    }
}

@media(min-width:1025px) and (max-width:1200px) {
    section.collection.mah-Centre .desc_collection {
        padding: 20px 0 0 40px;
    }

    section.hamam.mah-Centre .hamam-img {
        position: relative;
        top: 6%;
        right: 0;
        bottom: 0;
        left: -70px;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        width: 300px;
        position: absolute;
        height: 300px;
        bottom: -70px;
        right: -70px;
        left: auto;
    }

    .hamam.mah-Centre .col-md-6.order-col .cont-description {
        width: 80%;
    }

    section.massage.mah-Centre {
        padding: 150px 50px;
    }

    section.massage.mah-Centre .slick-list img {
        height: 450px;
    }

    .massage.mah-Centre::after {
        height: 600px;
        top: 100px;
    }

    .massage.mah-Centre .col-md-6.flex {
        display: flex;
        align-items: center;
    }

    .massage.mah-Centre .col-md-6.flex .cont-description {

        margin-top: 0;
    }

    section.massage.coiffure.mah-Centre {
        padding: 0px 50px;
    }

    .massage.coiffure.mah-Centre .col-md-6.order-md-1 {
        display: flex;
        align-items: center;
    }

    section.massage.coiffure::before {
        height: auto;
        top: 0px;
    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;
    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 0;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 50px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -90px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: -50px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -90px !important;
    }
}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.collection.mah-Centre .desc_collection {
        padding: 20px 40px 0 40px;

    }

    .esthetique-home.mah-Centre .slick-dots {
        display: none !important;
    }

    section.esthetique-home.mah-Centre {
        padding-bottom: 50px !important;
    }
}

@media (min-width: 1676px) {
    section.esthetique-home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 170px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;
    }

    section.esthetique-home .slick-next {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
        cursor: pointer;
        color: transparent;
        border: none;
        outline: 0;
        background: 0 0;
        left: 185px;
    }

    section.esthetique-home .slick-prev {
        font-size: 0;
        line-height: 0;
        position: absolute;
        top: inherit;
        display: block;
        width: 51px;
        height: 51px;
        padding: 0;
        -webkit-transform: inherit !important;
        -ms-transform: inherit !important;
        transform: inherit !important;
    }

    section.esthetique-home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: -93px;
        left: 250px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -22px !important;
    }

    section.collection.mah-Centre .desc_collection {
        padding: 50px 40px 0 40px !important;
        display: flex;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem img {
        width: 80%;
    }

    section.hamam.mah-Centre .hamam-img .content-img-hammem {
        right: 0;
        left: 60%;
        bottom: -20%;
    }

    section.collection.mah-Centre {
        padding-bottom: 50px !important;
    }

    .hamam.mah-Centre .col-md-6.order-col .cont-description {
        width: 80%;
    }

    section.hamam.mah-Centre {
        padding: 50px 35px 50px;

    }

    section.massage.coiffure.mah-Centre::before {
        height: 100% !important;
        top: 0px !important;

    }

    .esthetique-home.mah-Centre .content-img-esthetique img {
        width: 100%;

    }

    .content-imgMahassen {
        width: 100%;
    }

    .massage.mah-Centre .col-md-6.flex {
        display: flex;
        align-items: center;
    }

    .massage.mah-Centre .col-md-6.flex .cont-description {
        width: 60%;
        margin-top: 0px;
    }

    .massage.coiffure.mah-Centre img {
        height: 600px;
    }

}

/*End responsive page centre mahassen*/
/*start responsive page Bon plan*/
@media (min-width: 1200px) and (max-width: 1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
        left: 10px;
    }
}

@media (min-width: 1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: auto;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }
}

@media (max-width:767px) {
    .bonplan.coiffure.centre .cont-description {
        margin-top: 0px;
    }

    .bonplan.coiffure.centre {
        height: auto;
    }

    .bonPlan-img.centre {
        padding: 10px 20px 0px 20px;
    }

    .col-md-4.bonplan-col4.centre h2,
    .bonPlan-img-section-bottom.centre h2 {
        font-size: 18px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
    }

    /*
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider button.slick-next.slick-arrow {
        left: 0 !important;
    }*/

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -10px;
        left: -15px;
    }

    /*
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        right: calc(50% - 30px) !important;
        transform: translateX(100%);

    }*/

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev {
        right: calc(50% - -30px) !important;
        transform: translateX(50%);
    }

    .icons-bonPlan {
        padding-top: 30px;
    }

    .bonPlan-img-section-bottom img {
        width: 100%;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .bonplan.coiffure.centre .col-md-6.order-md-1 {
        width: 100%;
    }

    .bonplan.coiffure.centre .col-md-6.order-md-2.d-flex.align-items-start.custom-gap-reduction {
        width: 100% !important;
    }

    section.bonplan.coiffure.centre {
        height: auto;
        padding: 50px 60px 35px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 0px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -56px;
        left: 10px;
    }

    .bonPlan-img-section-bottom.centre {
        padding: 30px 35px 0px 50px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        left: 206px !important;
        top: 298px !important;
    }

}

@media (min-width:768px) and (max-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 24px;
        right: 20px;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 70px) !important;
        transform: translateX(100%);
        bottom: 0;
        position: relative;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 11px;
    }
}

@media (min-width: 1025px) and (max-width: 1320px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 55px) !important;
        transform: translateX(100%);
        position: relative;

    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        top: 11px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -57px;
    }
}

@media (min-width:1321px) and (max-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 30px) !important;
        transform: translateX(100%);
        position: relative !important;

    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev {
        height: 22px !important;

    }
}

@media (min-width:1025px) and (max-width:1200px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -56px;
        left: 10px;
    }

    section.bonplan.centre .content-img img {
        min-width: 370px !important;
        min-height: 370px !important;

    }

    .fidelite {
        margin-left: -5rem !important;
    }

}

@media (min-width:1676px) {
    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider {
        height: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider img {
        display: block;
        height: 100%;
        background-size: cover;
        width: 100%;
        max-width: 100%;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        top: -52px;
        left: 10px;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next {
        top: inherit !important;
        left: calc(90% - 90px) !important;
        transform: translateX(100%);
        bottom: 0 !important;
        position: relative;
    }

    .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next::before {
        top: 15px !important;

    }
}

/*End responsive page Bon plan*/
/*Start responsive page fidelité B2B*/
@media (max-width:767px) {
    section.bonplan.coiffure.centre .content-img img {
        min-height: 320px;
        min-width: auto;
    }

    section.bonplan.coiffure.centre .fidelite span {
        font-size: 50px;
    }

    section.bonplan.coiffure.centre .fidelite {
        margin-left: -5rem !important;
    }

    section.politique {
        padding: 50px 20px 20px;
    }

    h3.titre-plitique {
        line-height: 35px;
        margin-bottom: 0;
    }

    section.politique tbody tr td span {
        font-size: 12px !important;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb img {
        width: 100%;
        height: 100%;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .imgPageInfo img {

        display: flex !important;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .BordurePageInfo {
        background-color: #fff !important;
        display: flex !important;
    }

    #docs-internal-guid-31b4c445-7fff-3934-0292-2f02289a0f2f h2 {
        margin-bottom: 20px;
    }

    section.politique p.MsoNormal {
        margin-top: 10px;
    }

}

@media (max-width:500px) {
    section.politique tbody tr td span {
        font-size: 10px !important;
    }

    section.politique tbody img {
        width: 50%;
        height: 50%;
    }

    section.politique td {
        padding: 5px !important;
    }

}

@media (min-width:501px) and (max-width:767px) {
    section.politique tbody tr td span {
        font-size: 10px !important;
    }

    section.politique td {
        padding: 10px !important;
    }

}

@media (min-width:768px) and (max-width:1024px) {
    section.politique {
        padding: 50px 20px 20px;
    }

    section.politique p.MsoNormal {
        margin-top: 10px;
    }

    #docs-internal-guid-5d4f89b8-7fff-c1ac-c978-3379cb5278fb .imgPageInfo img {

        display: flex !important;
        justify-content: center;
    }

}

@media (min-width:1024px) {
    section.politique p.MsoNormal {
        margin-top: 10px;
    }
}

/*End responsive page fidelité B2B*/
/*responsive actualité*/
@media (max-width:767px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 35%;
    }

    section.catalogBloc.block {
        padding: 20px 0 !important;

    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
    }

    section.actualité.block {
        padding: 20px 0;
    }
}

@media (min-width:768px) and (max-width:1024px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 35%;
    }

    section.actualité.block {
        padding: 20px 0;
    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
        padding-bottom: 0px;
    }
}

@media (min-width:992px)and (max-width:1200px) {
    section.catalogBloc.block:after {
        width: 50%;
        height: 55%;
    }

    .box-actualité.Card {
        margin-bottom: 40px;
        height: 750px;
    }

    .Inscprip-actualité section.abonnez-vous.instagram {
        padding-top: 0px;
    }

    section.actualité.block {
        padding-bottom: 0;
    }
}

@media (min-width:1201px)and (max-width:1399px) {
    .box-actualité.Card {
        height: 800px;
    }
}

@media (min-width:1400px)and (max-width:1676px) {
    .box-actualité.Card {
        height: 900px;
    }
}

@media (min-width:1677px) {
    .box-actualité.Card {
        height: 900px;
    }

    section.actualité.block {
        padding: 70px 0 0;
    }

    .Inscprip-actualité .abonnez-vous {
        padding: 20px 30px 0px;
    }

    section.product-cosmetique.maquillage.maquillage2.b2b {
        padding: 0px 0 20px;
    }
}

@media (min-width:768px) {
    .coiffure-hom.b2b .detail-contact {
        display: block;
    }
}

@media (min-width: 1450px) and (max-width: 1580px) {
    section.brochure-homme.b2b {
        margin-top: 0 !important;
    }
}

@media (min-width: 1581px) {
    section.brochure-homme.b2b {
        margin-top: 0 !important;
    }
}

/*start responsive application beauty*/
@media(min-width: 501px) and (max-width: 767px) {
    .header-marketing-desc.ban-app.application-beauty {
        right: 20px !important;
    }
}

@media(max-width: 767px) {
    .header-marketing-desc.ban-app.application-beauty .name-app {
        font-size: 6px;
        margin-left: -80px;
    }

    .header-marketing-desc.ban-app.application-beauty .btn-app {
        margin: -40px 0 0;
        padding: 5px 2px;
        font-size: 7px;
        margin-left: -20px;
        width: 80px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app img {
        margin-right: 25px;
    }

    .header-marketing-desc.ban-app.application-beauty .logo-app {
        width: 30%;
    }

    .header-marketing-desc.ban-app.application-beauty {
        right: 0;
        top: 30%;
    }

    .header-marketing.application {
        height: 100%;
    }
}

@media(max-width: 1024px) {

    section.bloc4-app.application .content-img,
    section.bloc6-app.application .content-img,
    section.bloc8-app.application .content-img {
        padding-right: 0px;
    }

    section.bloc4-app.application .application-img,
    section.bloc6-app.application .application-img,
    section.bloc8-app.application .application-img {
        left: 0px;
        top: 0px;
    }

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        padding-top: 0;
        margin-left: 0;
        padding-right: 0;
    }

    .bloc5-app.application,
    .bloc6-app.application,
    .bloc7-app.application {
        padding: 0px 35px 35px 35px !important;
    }

    .bloc8-app.application {
        padding: 0px 35px 0px 35px !important;
    }

    .Inscription-application section.abonnez-vous.instagram {
        padding-top: 20px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {

    .application.flex .container-fluid .row .col-md-6 {
        width: 100%;
    }

    .bloc4-app.application.flex .order-md-1 {
        order: 2 !important;
    }

    .bloc6-app.application.flex .order-md-2,
    .bloc8-app.application.flex .order-md-2 {
        order: 1 !important;
    }

}

@media (min-width:1025px) and (max-width: 1200px) {

    section.bloc4-app.application .content-img,
    section.bloc6-app.application .content-img,
    section.bloc8-app.application .content-img {
        padding-right: 0px;
        margin-right: 0;
    }

    section.bloc4-app.application .content-img img,
    section.bloc6-app.application .content-img img,
    section.bloc8-app.application .content-img img {
        margin-right: 0;
    }

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        margin-left: 0;
        padding-right: 0;
    }

    section.bloc5-app.application .cont-description,
    section.bloc7-app.application .cont-description {
        padding-left: 10px;
    }

    .bloc4-app.application.flex .cont-description {
        margin-top: 45px;
    }

    .bloc6-app.application {
        padding: 0px 35px 35px 35px !important;

    }

    .bloc8-app.application,
    .bloc5-app.application {
        padding: 0px 35px 35px 35px !important;
    }

}

@media (min-width:1201px) and (max-width: 1676px) {

    .bloc6-app.application,
    .bloc8-app.application {
        padding: 0px 35px 35px 35px !important;

    }

    .Inscription-application section.abonnez-vous.instagram {
        padding: 60px 30px 0px !important;
    }
}

@media (min-width:1677px) {

    section.bloc5-app.application .content-img-left,
    section.bloc7-app.application .content-img-left {
        margin-left: 0;
    }

    .bloc4-app.application.flex .cont-description,
    .bloc6-app.application.flex .cont-description,
    .bloc8-app.application.flex .cont-description {
        margin-top: 90px;
    }

    .Inscription-application section.abonnez-vous.instagram {
        padding: 60px 30px 0px !important;
    }

    .bloc6-app.application,
    .bloc8-app.application {
        padding: 0px 35px 35px 35px !important;

    }
}

/*End responsive application beauty*/
/*Start Slider Top Page d'accueil*/
.sliderTop.home .slick-prev.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 120px;
    width: 60px;
    height: auto;
    left: inherit;
    z-index: 3;
    transform: none;
}

.sliderTop.home .slick-next.slick-arrow {
    position: absolute;
    top: inherit;
    bottom: 0px;
    right: 0px;
    width: 50px;
    height: 50px;
    left: inherit;
    transform: none;
    z-index: 3;
}

@media (max-width:767px) {
    .sliderTop.home .slick-prev:before {
        left: 0px;
    }

    .bonPlan-img.centre .content-image-bonplan-b2c-first.shine img {
        padding-top: 0;
        height: auto !important;
        object-fit: fill !important;
    }

    .bonPlan-img.centre .content-image-bonplan-b2c-first.shine .content-bonplan {
        bottom: 0px;
    }

    .bonPlan-img.centre .content-image-bonplan-b2c-first.shine .content-bonplan {
        top: 1px;
    }




}

/*End Slider Top Page d'accueil*/
/*Start Popup Page actualité*/
.bloc-6-collection.actualité .row .img-anciennecoll,
.bloc-6-collection.actualité .row {
    display: flex;
    justify-content: center;
}

.popup-Actualité {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.8);
    justify-content: center;
    align-items: center;
}

.popup-Actualité .slider-popup {
    width: 80%;
    background-color: #fff;
}

.popup-Actualité img {
    max-width: 100%;
    max-height: 80vh;
    /* Ajustez la hauteur pour s'adapter à l'écran */
    display: block;
    margin: auto;
}

.popup-Actualité .close {
    position: absolute;
    top: 20px;
    right: 30px;
    color: white;
    font-size: 40px;
    font-weight: bold;
    cursor: pointer;
}

.popup-Actualité .slick-track {
    gap: 50px;
    display: flex;
    height: 600px;
}


/*End Popup Page actualité*/
/*Start page Detail actualité*/
.bloc-5-collection.Card .item-conseil {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
    height: 703px;
}

.bloc-5-collection.Card .title-bloc5-collection {
    padding-bottom: 20px;
}

@media (max-width: 1199px) {
    .bloc-5-collection.Card .titre-conseil {
        height: 20px;
    }
}

/*End page Detail actualité*/
/*Start page Nos marque*/
@media (max-width: 500px) {
    .header-marketing.Nos-marque .header-marketing-desc p {
        font-size: 14px;
    }

    .header-marketing.Nos-marque .header-marketing-desc {
        width: 80%;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 80%;
        margin-top: 20px;
        margin-bottom: 20px;
    }

    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
        padding-bottom: 0px;
    }

    .product-cosmetique.recomd.nos-marque .row.nos-marque {
        gap: 50px;
    }

}

@media (min-width: 501px) and (max-width:767px) {
    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
        padding-bottom: 0px;
    }

    .product-cosmetique.recomd.nos-marque .row.nos-marque {
        gap: 50px;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 80%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:768px) {
    .nos-collab .slick-prev {
        left: 0px;
    }

    .nos-collab .slick-next {
        right: 0px;
    }
}

@media(min-width:768px) and (max-width:991px) {
    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque {
        margin-bottom: 50px;
    }

    .product-cosmetique.recomd.nos-marque .logo-desc {
        margin: -35px 55px 0;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 100%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:992px) and (max-width:1200px) {
    .col-lg-3.col-md-6.col-sm-12.nos-marque {
        width: 50%;
    }

    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque {
        margin-bottom: 50px;
    }

    .product-cosmetique.recomd.nos-marque .container-fluid {
        margin-top: 50px;
    }

    .product-cosmetique.recomd .row.nos-marque .img-logo-item a img {
        max-width: 100%;
        margin-top: 30px;
        margin-bottom: 50px;
    }
}

@media(min-width:1201px) and (max-width:1550px) {
    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque .img-logo-item a img {
        width: 200px;
    }

    .product-cosmetique.recomd.nos-marque .col-md-6.nos-marque .logo-item {
        height: 320px !important;
    }
}

@media(min-width:481px) and (max-width:991px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 5px;
        padding-right: 5px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:992px) and (max-width:1360px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 25px;
        padding-right: 25px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:1361px) {
    .nos-collab.nos-marque .collab-item img {
        padding-left: 50px;
        padding-right: 50px;
    }

    .nos-collab.nos-marque .item.shine {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    .Inscription-NosMarque .abonnez-vous.instagram {
        padding: 50px 30px 0px;
    }
}

@media(min-width:1678px) {
    .Inscription-NosMarque .abonnez-vous.instagram {
        padding: 50px 30px 0px;
    }
}

/*End page Nos marque*/
/*Start responsive Search*/
@media(max-width:767px) {
    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

    .inscrivez-vous.recherche listing .list.border-bottom {
        padding-left: 0;
    }

    #article_list {
        margin-right: 0;
    }

    #article_list .content-box {
        display: block;
    }

    section.inscrivez-vous.recherche div#cat_list {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    section.inscrivez-vous.recherche div#cat_list .list-group-item {
        margin-left: 20px !important;
    }

    .inscrivez-vous.recherche .single-list .content-img {
        display: flex;
        justify-content: center;
        width: 100%;
        margin-bottom: 50px;
    }

    .inscrivez-vous.recherche .content-txt h4.content-title,
    .inscrivez-vous.recherche .content-txt h4.content-title {
        text-align: center;
    }

    .maquillage.home .content-video {
        display: block;
        justify-content: center;
    }

    .nouveaute.home {
        margin-top: 0px !important;
    }
}

@media(max-width:500px) {
    section.inscrivez-vous.recherche .search-container {
        width: 70% !important;
    }

}

@media(min-width:501px) and (max-width:767px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;
    }
}

@media(min-width:768px) and (max-width:1024px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;


    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

}

@media(min-width:1025px) and (max-width:1367px) {
    section.inscrivez-vous.recherche .search-container {
        width: 80% !important;
    }

    section.inscrivez-vous.recherche i.fa-sharp.fa-solid.fa-xmark {
        top: 20px;
        right: 10px;
    }

}

@media(min-width:768px) {
    section.inscrivez-vous.recherche div#cat_list {
        margin-right: 0 !important;
        padding-right: 0 !important;
    }

    section.inscrivez-vous.recherche div#cat_list .list-group-item {
        margin-left: 20px !important;
    }
}

/*End responsive Search*/

@media(min-width:1677px) {
    .product-cosmetique .slick-track .slick-slide .item.shine {
        padding: 0px 15px !important;
    }
}

/*Start responsive Filter page Catalogue*/
@media screen and (max-width:500px) {
    .filter.Catalogue .card-footer .btn {
        padding: 7px 0px !important;
        font-size: 10px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .col-md-4 {
        width: 33.333%;
        padding-right: 2px;
        padding-left: 2px;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 10px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-description-actualité-centre {
        margin-top: 0px;
        padding-top: 50px;
    }
}

@media(min-width:500px) and (max-width:767px) {
    .filter .card-footer .btn {
        padding: 10px 40px !important;
    }

    .filter details,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter.Catalogue .card-footer .btn {
        padding: 7px 0px !important;
        font-size: 14px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .col-md-4 {
        width: 33.333%;
        padding-right: 2px;
        padding-left: 2px;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 14px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-descriptionn {
        margin-top: 0px;
    }
}

@media (min-width:767px) and (max-width:1200px) {

    .filter details,
    .filter summary {
        width: 100%;
        margin-bottom: 7px;
    }

    .filter.Catalogue .card-footer .btn {
        padding: 7px 70px !important;
        font-size: 14px;
    }

    .filter.Catalogue details {
        width: 100%;
    }

    .filter.Catalogue .card {
        margin: 0px;
    }

    .filter.Catalogue select,
    .filter.Catalogue summary {
        font-size: 14px;
    }

    .catalogBloc.filtreBloc::after {
        width: 45% !important;
        height: 80%;
    }

    .catalogBloc.filtreBloc .cont-description-actualité-centre {
        margin-top: 0px;
        padding-top: 50px;
    }
}

#success-message-container {
    transition: opacity 0.3s ease-in-out;
    opacity: 1;
}

#success-message-container.show {
    opacity: 1;
}

.autonome.home .carousel.slide .slick-next::before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    right: 0;
    top: -10px;
    font-weight: 300;
    background: url(../images/btnright.png) center no-repeat;
    height: 20px;
    width: 60px;
    content: "";
}

@media(min-width:768px) and (max-width:825px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 285px;
    }
}

@media(min-width:826px) and (max-width:991px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 225px;
    }
}

@media(min-width:1200px) and (max-width:1676px) {
    .autonome.home {
        margin-bottom: 65px;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }
}

@media(min-width:1200px) and (max-width:1350px) {


    .autonome.home {
        margin-bottom: 65px;
    }

    section.maquillage.home .content-autonome-desc {
        padding-right: 0px !important;
        margin-left: 0px !important;
        padding-left: 100px !important;
        padding-top: 0px !important;
        margin-top: 0px !important;
    }
}

@media(min-width:1351px) and (max-width:1676px) {
    .autonome.home {
        margin-bottom: 100px;
        margin-top: 20px;
    }
}

@media(min-width:1520px) and (max-width:1676px) {

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    section.maquillage.home {
        margin-top: 100px !important;
    }
}

@media(min-width:1676px) {
    .autonome.home {
        margin-bottom: 20px;
    }

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 120px !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 100px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }
}

.product-cosmetique.recomd.catalogue .product-item.shine .new {
    top: 0px !important;
}

/**/
@media(max-width:767px) {

    .autonome.home .carousel.slide button.slick-prev.slick-arrow,
    .autonome.home .carousel.slide button.slick-next.slick-arrow {
        bottom: 0px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one {
        grid-template-columns: auto 50px !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-img.shine,
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        margin-bottom: 40px;
        max-height: 600px;
        width: 100% !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 60px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }

    .content-carte-mahassen.carte-one .fidelite-one-acceuil {
        margin-top: 400px;
        height: 0 !important;
        margin-left: -0.50rem !important;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 65px !important;
        margin-left: 0 !important
    }

    .fidelite-two-acceuil {
        margin-top: -120px;
        margin-left: -1.75rem !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: auto !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .fancybox img {
        width: 100%;
        object-fit: cover;
    }

    .maquillage.home .row .col-md-12.modify {
        padding-right: calc(var(--bs-gutter-x)* .5);
        padding-left: calc(var(--bs-gutter-x)* .5);
    }

    /* .col-md-12.col-lg-6.col-xl-5.col-xxl-5.modify {
        margin-top: 50px;
    } */

    section.maquillage.home .content-autonome-desc {
        padding-left: 0 !important;
        padding-top: 0 !important;
        margin-left: 0 !important
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }
}

@media(min-width:360px) and (max-width:376px) {
    .mahassen-lives {
        margin-top: 425px !important;
    }
}

@media (min-width: 377px)and (max-width:384px) {
    .mahassen-lives {
        margin-top: 400px !important;
    }
}

@media (min-width: 385px)and (max-width:395px) {
    .mahassen-lives {
        margin-top: 370px !important;
    }

}

@media (min-width: 768px)and (max-width:800px) {
    .mahassen-lives {
        margin-top: 40px !important;
    }
}

@media (min-width: 801px)and (max-width:991px) {
    .mahassen-lives {
        margin-top: 20px !important;
    }
}

@media (min-width: 992px)and (max-width:1199px) {
    /* .fidelite-mahassen {
        max-height: 1085px;
    } */

    section.carte-mahassen {
        padding: 50px 35px 20px;
    }

    .content-carte-mahassen.carte-one {
        grid-template-columns: auto 100px !important;
    }

    /* .content-carte-one {
        height: 1002.06px !important;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 500px;
        width: 100%;
    }

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        font-size: 80px;
        margin-left: 121px;
    }

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 100px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: -4px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-left: 20px;
        padding-top: 20px;
        display: grid;
        grid-template-columns: auto 100px;
    }

    /* .content-carte-one {
        height: 1002.06px !important;
    } */

    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        margin-bottom: 45px;
        max-height: 500px;
        margin-top: 50px;
        width: 100%;
    }

    /* section.mahassen-lives {
        margin-top: 50px;
    } */

    section.carte-mahassen .content-carte-mahassen .content-img img {
        width: 100%;
        /* object-fit: cover; */
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        margin-top: 264px;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        writing-mode: vertical-rl;
        font-size: 80px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: #fde2e1;
        margin-top: 361px;
        margin-left: 13px;
        letter-spacing: 0.2rem;
        display: inherit;
    }

    .fidelite-one-acceuil {
        margin-top: 0px;
        margin-left: 0.5rem !important;
    }

    .fidelite-two-acceuil {
        margin-top: -10px;
        margin-left: -1.5rem !important;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: 0px;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .modify {
        width: 100%;
        display: flex;
        justify-content: center;
        padding-top: 20px;
    }

    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .col-xxl-7 {
        width: 100%;
        display: flex;
        justify-content: center;
        order: -1;
    }

    .container.adjust-bloc-collection_hiver {
        max-width: 1030px;
        padding-right: 50px;
        padding-left: 50px;
    }

    #carouselExampleCaptions1 button.slick-next.slick-arrow {
        left: 310px;
    }

    section.collection .collection_hiver button.slick-prev.slick-arrow {
        right: 33px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 37px;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }

    .bonplan.coiffure.centre.centre.centre-M .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: -20px;

    }

    section.bonplan .content-img {
        width: 100%;
        float: left;
    }

    section.bonplan.coiffure.centre.centre-M {
        padding: 50px 65px 10px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 20px;
        height: auto;
    }
}

@media (min-width: 992px)and (max-width:1023px) {
    section.bonplan.coiffure.centre.centre-M {
        padding: 50px 65px 10px 35px;
        position: relative;
        margin-right: 30px;
        margin-left: 20px;
        height: auto;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-prev::before {

        left: -90px !important;
    }
}

@media (min-width: 1200px)and (max-width:1225px) {
    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        right: 50px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 335px !important;
    }
}

@media (min-width: 1401px)and (max-width:1676px) {
    .container.adjust-bloc-collection_hiver {
        max-width: 1400px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        right: 100px !important;
    }

    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 380px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }
}

@media (min-width: 1226px)and (max-width:1400px) {
    #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 300px !important;
        z-index: 3;
    }

    section.collection .collection_hiver #carouselExampleCaptions1 .carousel-inner button.slick-next.slick-arrow {
        left: 300px !important;
        z-index: 3;
    }


}

@media (min-width: 1200px)and (max-width:1400px) {
    #carouselExampleCaptions1 .carousel-inner button.slick-prev.slick-arrow {
        right: 43px !important;
    }

    section.collection .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }
}

@media (min-width: 1401px)and (max-width:1676px) {
    .maquillage.home .container-fluid.adjust-container-section-hammem-spa .row {
        padding-right: 100px !important;
    }
}

@media screen and (min-width:1676px) {
    .collection .container.adjust-bloc-collection_hiver {
        max-width: max-content;
        padding-left: 100px;
        padding-right: 50px;
        ;
    }

    .autonome.home .container-fluid {
        max-width: max-content;
        padding-left: 50px;
        padding-right: 50px;

    }

    i.first-icon {
        right: 5px !important;
        bottom: 170px !important;
    }

    section.autonome.home {
        height: calc(65vh) !important;
        margin-top: 170px !important;
    }

    section.maquillage.home {
        padding: 50px 50px 50px 50px;
    }

    section.maquillage.home .container-fluid.adjust-container-section-hammem-spa {
        margin-left: 0px !important;
    }

    section.maquillage.home .content-autonome-desc {

        margin-top: 0px !important;
        padding-right: 0px;
        padding-left: 0px;
    }

    section.nouveaute.home {
        padding: 100px 35px 50px;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-carte-one {
        height: 800px !important;
    }

    /* section.mahassen-lives {
        padding: 60px 13px 84px 30px !important;
        position: relative;
        margin-top: 10px !important;
        top: -82px;
    } */

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        max-height: 700px;

    }

    section.collection .container.adjust-bloc-collection_hiver .desc_collection {
        padding: 170px 100px 0px 0px !important;
    }

    /* #carouselExampleCaptions1 .carousel-inner .slick-prev::before {
        left: -70px !important;
    }

    #carouselExampleCaptions1 .carousel-inner .slick-next::before {
        right: 15px !important;
    } */

}



@media screen and (min-width: 1800px) {
    section.maquillage.home {
        margin-top: 50px !important;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one .content-img {
        max-height: 800px;
    }

    /* section.mahassen-lives {
        padding: 30px 13px 30px 30px !important;
        bottom: 135px;
    } */

    .collection .container.adjust-bloc-collection_hiver {
        max-width: max-content;
        padding-left: 150px;
        padding-right: 100px;
    }
}


@media (min-width: 501px)and (max-width:767px) {
    /* .Avis-mah-Centre section.avis-clients {
        margin-top: 0px !important;
    } */

    .Centre-m section.carte-mahassen.centre-m {
        padding: 50px 0 50px;
    }

    /* .Centre-m {
        padding-bottom: 50px;
    } */

}

@media (min-width: 1200px) {
    .massage.coiffure.mah-Centre .slick-prev:before {
        background: url(../images/btnleft.png)center no-repeat !important;
    }

    .massage.coiffure.mah-Centre .slick-next:before {
        background: url(../images/btnright.png) center no-repeat !important;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    section.esthetique-home.mah-Centre .slick-next:before {
        left: -20px;
        top: -40px !important;
    }

    section.esthetique-home.mah-Centre .slick-prev:before {
        left: 10px;
        top: -40px !important;
    }
}

@media (min-width: 1025px) and (max-width: 1100px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        top: 57px;
    } */

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 250px;
        width: 250px;
        top: -170px;

    }
}

@media (min-width: 1101px) and (max-width: 1199px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        margin-top: -50px;
    } */

    section.esthetique-home.mah-Centre .content-img2 img {
        height: 250px;
        width: 250px;
        top: -170px;
    }
}


@media (min-width: 1200px) and (max-width: 1676px) {
    .esthetique-home.mah-Centre .content-slider-home .slider-esthetique .slick-list .content-imgMahassen {
        width: 90%;
    }

    section.massage.coiffure.mah-Centre::before {
        height: auto;
        top: 0;
    }

    .carousel-maquillage.mah-Centre .carousel-item.shine {
        min-height: auto !important;
        padding: 0 10px;
    }

}

@media (min-width: 1024px) and (max-width: 1200px) {
    /* section.esthetique-home.mah-Centre .slick-next:before {
        left: -70px;
    } */
}

@media (min-width: 1550px) and (max-width: 1676px) {
    section.carte-mahassen .content-carte-mahassen.carte-two .content-carte-one .content-img {
        max-height: 700px !important;
    }

    .Avis-mah-Centre .avis-clients {
        margin-top: 50px;
    }
}

@media(min-width: 1676px) {
    section.esthetique-home.mah-Centre .slick-next:before {
        left: 135px;
    }
}

@media screen and (min-width: 1920px) {
    .massage.coiffure.mah-Centre .carousel-maquillage .carousel-caption {
        left: 20%;

    }
}

@media (min-width: 1441px) {
    .abonnez-vous.instagram {
        margin-top: -52px !important;
    }
}

@media (min-width:1025px) and (max-width: 1199px) {
    .collection.home .collection_hiver {
        height: auto !important;
    }

    section.collection.home .collection_hiver div#carouselExampleCaptions1 .carousel-item {
        height: auto !important;
    }

    section.nouveaute.home {
        margin-top: 50px !important;
    }
}

@media (min-width:1200px) and (max-width:1676px) {
    section.autonome.home {
        height: calc(57vh) !important;
    }
}

@media (max-width:480px) {
    .footer-networks .carte-banck {
        gap: 5px;
    }

    .footer-networks .container-fluid {
        padding-right: 0 !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 1200px) and (max-width: 1440px) {
    section.footer .footer-content {
        gap: 20px !important;
    }
}



@media (min-width: 992px) and (max-width: 1199px) {
    section.footer {
        padding: 52px 25px 25px 25px !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 1024px) and (max-width: 1199px) {
    section.footer .footer-content {
        grid-template-columns: repeat(4, 1fr) !important;

    }
}


/* Styles for detail actualité */
@media (max-width: 480px) {
    .header-marketing {
        text-align: center;
        font-size: 16px;

    }

    .content_slider {
        padding: 0px;
    }

    .card {
        margin-bottom: 15px;
    }

    .btn-custom {
        font-size: 12px;
        padding: 6px 12px;
    }


}

/* Styles for mobile devices (481px to 767px) */
@media (min-width: 481px) and (max-width: 767px) {
    .header-marketing {
        text-align: center;
        font-size: 18px;
    }

    .content_slider {
        position: relative;
        padding: 0 0px;
    }

    .card {
        margin-bottom: 20px;
    }

    .btn-custom {
        font-size: 14px;
    }
}

/* Styles for tablets (768px to 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 20px;
    }

    .card {
        margin-bottom: 25px;
    }

    .btn-custom {
        font-size: 16px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }
}


@media (min-width: 1025px) and (max-width: 1428px) {
    .header-marketing {
        text-align: left;
        font-size: 22px;
    }

    .card {
        margin-bottom: 30px;
    }

    .btn-custom {
        font-size: 18px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }
}

/* Styles for large desktop monitors (1441px and above) */
@media (min-width: 1374px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 24px;
    }

    .card {
        margin-bottom: 35px;
    }

    .btn-custom {
        font-size: 20px;
    }

    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 1px;
        grid-template-columns: repeat(auto-fit, minmax(296px, 1fr));
        grid-auto-rows: 494px;
        grid-auto-flow: dense;
    }

    .container.adjust-conseil-container {
        max-width: 1365px;
    }

    .video-bloc2-collection {
        position: relative;
        max-width: 1444px;
    }
}


@media (min-width: 1170px) and (max-width: 1199px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 414px;
        grid-auto-flow: dense;
    }



}

@media (min-width: 1157px) and (max-width: 1165px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 398px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }

}

@media (min-width: 1099px) and (max-width: 1156px) {
    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 398px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }
}

@media (min-width: 992px) and (max-width: 1199px) {

    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 433px;
        grid-auto-flow: dense;
    }

    .bloc-3-collection.Centre-M .grid-wrapper-colletion {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }

}

@media (min-width: 745px) and (max-width:991px) {
    .bloc-3-collection.Centre-M .grid-wrapper-colletion {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .header-marketing {
        text-align: left;
        font-size: 20px;
    }

    .card {
        margin-bottom: 25px;
    }

    .btn-custom {
        font-size: 16px;
    }


    .grid-wrapper-colletion {
        display: grid;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 482px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }
}

@media (min-width: 1442px) {
    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
    }

    .header-marketing {
        text-align: left;
        font-size: 24px;
    }

    .card {
        margin-bottom: 35px;
    }

    .btn-custom {
        font-size: 20px;
    }

    .description-detail-actualite {
        text-align: justify;
        padding-left: 50px;
        padding-right: 50px;
    }

    .video-bloc2-collection {
        position: relative;
    }


    .banner-img video {
        max-width: 100%;
        margin: 0 auto;
        display: block;
        padding-left: 50px;
    }


    .grid-wrapper-colletion {
        display: grid;
        margin-left: 40px;
        grid-gap: 5px;
        grid-template-columns: repeat(auto-fit, minmax(334px, 1fr));
        grid-auto-rows: 504px;
        grid-auto-flow: dense;
        /* max-width: 100%; */
    }


    .container.adjust-conseil-container {
        max-width: 1373px;
    }

    .item-anciennecoll {
        display: table;
        margin: 0 auto 20px;
    }


    .item-anciennecoll {
        position: relative;
    }


    .title-anciennecoll {
        position: absolute;
        content: "";
        color: #fff;
        text-align: center;
        top: 0;
        margin: 30px auto 0;
        left: 0;
        right: 0;
        font-size: 22px;
        text-transform: uppercase;
        text-shadow: 0 0 30px #fff;
    }


    .container.anciene-co {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: stretch;
        align-items: center;
    }
}

/* start section se maquiller = maquillage professionel */


section.idees {
    padding: 50px 37px;
    background: #f5f5f5;
}

section.idees h2 {
    font-size: 26px;
    text-transform: uppercase;
    font-family: var(--Brand_title_fonts);
    text-align: center;
    margin-bottom: 70px;
}

.product-slider-idees {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    width: 100%;
}


.idees.soin .product-slider-idees.slick-dotted .slick-next:before {
    /* color: black;
    opacity: 0.99;
    font-size: 30px; */
    color: black;
    opacity: 0.99;
    font-size: 30px;
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -357px;
    font-weight: 300;
    /* background: url(../images/btnrright.png) center no-repeat; */
    height: 20px;
    width: 60px;
    content: "";
    top: inherit;
    background: url(../images/btnright.png) center no-repeat;
}

.idees .product-slider-idees.slick-dotted .slick-next:before {
    /* color: black;
    opacity: 0.99;
    font-size: 30px; */
    color: black;
    opacity: 0.99;
    font-size: 30px;
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -357px;
    font-weight: 300;
    /* background: url(../images/btnrright.png) center no-repeat; */
    height: 257px;
    width: 60px;
    content: "";
    top: 193px;
    background: url(../images/btnright.png) center no-repeat;
}


.idees .product-slider-idees.slick-dotted .slick-prev:before {
    /* color: black;
    opacity: 0.99;
    font-size: 30px; */
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: 242px;
    font-weight: 300;
    background: url(../images/btnleft.png) center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
    top: 64px;
}


@media (min-width: 1600px) {
    section.idees {
        padding: 80px 50px;
    }

    section.idees h2 {
        font-size: 30px;
        margin-bottom: 80px;
    }

    .product-slider-idees {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        flex-direction: row;
        align-content: stretch;
        align-items: center;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 35px;
    }
}


@media (min-width: 1024px) and (max-width: 1600px) {
    section.idees {
        padding: 60px 40px;
    }

    section.idees h2 {
        font-size: 28px;
        margin-bottom: 75px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 32px;
    }
}


@media (min-width: 768px) and (max-width: 1024px) {
    section.idees {
        padding: 50px 30px;
    }

    section.idees h2 {
        font-size: 26px;
        margin-bottom: 60px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 28px;
    }
}


@media (min-width: 576px) and (max-width: 768px) {
    section.idees {
        padding: 40px 20px;
    }

    section.idees h2 {
        font-size: 24px;
        margin-bottom: 50px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 26px;
    }
}


@media (max-width: 576px) {
    section.idees {
        padding: 30px 15px;
    }

    section.idees h2 {
        font-size: 22px;
        margin-bottom: 40px;
    }

    .idees .product-slider-idees .slick-prev:before,
    .idees .product-slider-idees .slick-next:before {
        font-size: 24px;
    }
}

/************/
.product-item.shine.pro {
    display: flex;
    justify-content: center;
    margin-left: 0px !important;
}

.product-slider-idees.pro {
    margin: 0 !important;
}

@media (min-width: 1200px) {
    .product-slider-idees.pro .product-item img {
        max-width: initial;
        max-height: initial;
        object-fit: cover;
    }
}

@media (max-width: 1201px) {
    .product-slider-idees.pro .product-item img {
        max-width: 300px;
        max-height: 200%;
        object-fit: cover;
    }
}

@media (max-width: 991px) {
    .product-slider-idees.pro .slick-dots {
        display: none !important;
    }

}

@media (max-width: 991px) {


    /* .product-slider-idees.pro .slick-next.slick-arrow:before{
        width: 60px;
        top: 64px;
        right: 0px;
        bottom: 0;
        left: -8px;
    } */
    .product-slider-idees.pro .slick-prev.slick-arrow {
        width: 50px;
        height: 50px;
        left: inherit;
        top: inherit;
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: 15px;
        z-index: 3;

    }

    .product-slider-idees.pro .slick-prev.slick-arrow:before {
        height: 10px;
        width: 60px;
        top: inherit;
        bottom: 0;
        left: -40px;
    }


    .product-slider-idees.pro .slick-next.slick-arrow:before {
        height: 10px;
        width: 60px;
        top: inherit;
        bottom: 0;
        left: -30px;
    }
}

@media (max-width: 700px) {
    /* .product-slider-idees.pro .slick-next.slick-arrow {
        top: 285px;
    } */
}


@media (min-width: 360px) and (max-width: 526px) {

    /* .product-slider-idees.pro .slick-next.slick-arrow {
        top: 345px !important;
    } */
    .product-slider-idees.pro .product-item.shine img {
        max-height: 100% !important;
        max-width: 100% !important;

    }

    section.lamarque {
        padding-top: 20px;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.autonome.home .content-autonome {
        grid-template-columns: 60% 60%;
    }
}

@media (max-width: 1200px) {
    .maquillage.home .content-video {
        padding-left: 0px;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .maquillage.home .content-video {
        padding-left: 0px;
    }

    .autonome.home .carousel-item.shine .custom-caption {
        top: 54%;
    }
}

@media (min-width: 1166px) and (max-width: 1199px) {

    .autonome.home,
    .maquillage.home {
        margin-top: -100px !important;
    }
}

@media (min-width: 992px) {
    /* .avis-home {
        padding-top: 50px;
    } */
}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.autonome.home {
        height: auto !important;
    }

    section.autonome.home div#carouselExampleCaptions2 {
        height: 0px !important;
        position: relative;
    }

    section.maquillage.home {
        margin-top: 50px;
    }
}

/*Actualité Card*/

.actualité.block .box-actualité.Card {
    background: #fff;
    box-shadow: 0 0 10px #dbdbdb;
    padding: 29px 35px 33px;
    margin: 0 16px 51px;
}

.actualité.block .box-actualité.Card .image-box-actualité img {
    max-width: 100%;
}

.actualité.block .box-actualité.Card .detail-box-actualité .date-box-actualité {
    padding: 14px 0 9px;
    font-size: 14px;
    color: #b0b0b0;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.actualité.block .row {
    margin-top: 50px;
}

.actualité.block .box-actualité.Card .title-box-actualité {
    padding-top: 50px;
}

.actualité.block .box-actualité.Card .btn-box-actualité a {
    text-decoration: underline;

}

.actualité.block .box-actualité.Card .btn-box-actualité:hover a {
    color: #b0b0b0;
}

.actualité.block .box-actualité.Card .title-box-actualité {
    font-size: 23px;
    line-height: 27px;
    text-align: center;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 600;
}

.actualité.block .box-actualité.Card .user-box-actualité {
    font-size: 20px;
    margin: 10px 0 33px;
    text-align: center;
    font-family: "Century-Gothic-Std", "Century Gothic";
}

.actualité.block .box-actualité.Card .btn-box-actualité {
    text-align: center;
    margin-top: 20px;
}

@media (min-width: 992px) and (max-width: 1165px) {
    .actualité.block .box-actualité.Card {
        height: 1200px;
    }

    .actualité-blogs .box-blogs.Card {
        height: 1200px;
    }

}

@media (min-width: 1166px) {
    .actualité.block .box-actualité.Card {
        height: auto;
    }

    .actualité.block .box-blogs.Card {
        height: auto;
    }

    .actualité-blogs .box-blogs.Card {
        height: auto;
    }

    .actualité-blogs .box-blogs.Card {
        height: auto;
    }
}

@media (min-width: 1400px) {

    .catalogBloc.actualité.block .container-fluid,
    .catalogBloc.actualitéBloc .container-fluid {
        max-width: 1320px;
    }
}

.coiffure-hom.marque.block {
    padding: 100px 35px 30px 35px;
}

.massage.coiffure.marque {
    padding: 30px 35px 35px 35px;
}

@media (min-width: 767px) and (max-width: 1200px) {
    .actualité.block .row .col-lg-6 {
        width: 100%;
    }

    .actualité-blogs .row .col-lg-6 {
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .catalogBloc.actualité.block .container-fluid {
        max-width: 1140px;
    }
}

@media (min-width: 360px) and (max-width: 500px) {
    .bonplan.coiffure.centre.centre-M .fidelite-bon-plan span {
        font-size: 30px;
        margin-top: 195px;
        margin-bottom: 0px;
        margin-left: 116px;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    .bonplan.coiffure.centre.centre-M .fidelite-bon-plan span {
        font-size: 42px;
        margin-top: 268px;
        margin-bottom: 0px;
        margin-left: 116px;
    }
}

@media (max-width: 767px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 30px;
        margin-top: 210px;
        margin-bottom: 0px;
        margin-left: 50px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 100% !important;
        float: left;
    }

    section.bonplan.coiffure.centre .content-img img {
        min-height: auto !important;
        min-width: auto;
    }

    section.bonplan.coiffure.centre .fidelite-bon-plan {
        height: 0px !important;
    }

    .bonplan.coiffure.centre {
        padding: 50px 0px;
    }

    section.bonPlan-img-section-bottom.centre {
        padding: 40px 20px 40px 20px;
    }

    .bonPlan-img-section-bottom.centre .remise-bonplan {
        left: 50px;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: -10px !important;
        width: 50px;
        height: 50px;
        left: inherit;

    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-next.slick-arrow {
        right: calc(50% - 20px) !important;
        transform: translateX(100%);
        bottom: -10px !important;
        top: inherit;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -8px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px !important;
    }

}

@media (min-width: 501px) and (max-width: 601px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 45px;
        margin-top: 255px;
        margin-bottom: 0px;
        margin-left: 50px;

    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 85%;
        float: left;
    }
}

@media (min-width: 602px) and (max-width: 767px) {
    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 55px;
        margin-top: 275px;
        margin-bottom: 0px;
        margin-left: 40px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 88%;
        float: left;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    section.bonplan.coiffure.centre .fidelite-bon-plan {
        height: 0px !important;
    }

    .bonplan.coiffure.centre .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 392px;
        margin-bottom: 0px;
        margin-left: 110px;
    }

    section.bonplan.coiffure.centre.centre-M .content-img {
        width: 100%;
        float: left;
    }
}

@media (min-width: 1025px) {
    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-prev:before {
        background: url(../images/btnleft.png) center no-repeat !important;
    }

    .bonPlan-img-section-bottom.centre .carousel.carousel-inner.bon-plan.slick-initialized.slick-slider .slick-next:before {
        background: url(../images/btnright.png) center no-repeat !important;
    }
}

@media (min-width: 1200px) and (max-width: 1480px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 40px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0px;
    }
}

@media (min-width: 1481px) and (max-width: 1667px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 45px;
        margin-top: 0;
        margin-bottom: 0px;
        margin-left: 0;
    }
}

@media (min-width: 1200px) {
    .bonplan.coiffure.centre.centre.centre-M .fidelite-bon-plan span {
        font-size: 62px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: -70px;
    }

    section.bonplan.coiffure.centre.centre.centre-M .content-img {
        width: 90%;
        float: left;
    }

    section.bonplan.coiffure.centre.centre.centre-M {
        height: auto;
    }
}

@media (min-width: 1676px) {
    section.bonplan.coiffure.centre.centre.centre-M {
        height: auto;
    }
}

@media (min-width: 1676px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description {
        margin-top: 90px !important;
        width: 100%;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description h2 {
        line-height: 45px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app {
        padding: 100px 0 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .cont-description {
        width: 100%;
        padding-left: 20px !important;
        margin-left: 33px;
        margin-top: 90px;
    }
}

@media (min-width: 1200px) and (max-width: 1675px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description {
        width: 100%;
        padding-left: 0;
        margin-left: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6.order-md-1 .cont-description h2 {
        line-height: 45px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app {
        padding: 50px 0 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .cont-description {
        width: 100%;
        padding-left: 20px !important;
        margin-left: 0px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app .content-img-left {
        margin-left: 0 !important;
    }
}

@media (max-width: 767px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 30px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 35px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .cont-description {
        margin-top: 70px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .col-md-6,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .col-md-6 {
        width: 100%;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .carte-mahassen.centre-m.fidelité.Centre-M {
        padding: 30px 35px 35px 35px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .container-fluid,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .container-fluid {
        padding: 0;
    }
}

@media (min-width: 767px) and (max-width: 992px) {
    .collection.mah-nouveaute.maquillage.pro .content-img.shine {
        margin: 30px auto 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .row,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .row {
        display: flex;
        flex-direction: column;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .order-md-2,
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .row .col-md-6.flex {
        order: 0 !important;
    }
}

@media (min-width: 1025px) and (max-width: 1200px) {
    .carte-mahassen.centre-m.fidelité.Centre-M .bloc2-app.bloc2 .cont-description {

        padding-left: 0;
        margin-left: 0;
        margin-top: 50px;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .cont-description {
        width: 95%;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .col-md-6 {
        padding-left: 0;
    }

    .carte-mahassen.centre-m.fidelité.Centre-M .bloc3-app.bloc3 .content-img-left {
        margin-left: 15px;
        padding-top: 40px;
    }

    /* aaaa */
}

@media (max-width: 991px) {
    .product-slider-idees.pro.soin .slick-prev.slick-arrow:before {
        top: inherit !important;
    }
}

@media (max-width: 700px) {

    /* .product-slider-idees.pro.soin .slick-next.slick-arrow {
        top: 261px;
    } */
    section.idees.soin {
        padding: 50px 15px;
    }
}

.collection.mah-nouveaute.mah-Centre .col-lg-5.col-md-2.mah {
    width: 50%;
}

@media (min-width: 1676px) {
    .collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        text-align: justify !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        padding: 50px 40px 0 20px !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 27px;
    }

    .hamam.mah-Centre.mah .col-md-6.order-col .cont-description {
        width: 100%;
        margin-top: 0px;
    }

    .hamam.mah-Centre.mah {
        margin-top: 0px;
    }

    .massage.mah-Centre.mah .slick-slide img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .massage.mah-Centre.mah .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        padding-top: 0;
        padding-bottom: 0;
        color: #fff;
        text-align: center;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: 100%;
        padding: 0;
    }

    .massage.mah-Centre.mah .col-md-6.flex .cont-description {
        width: 100%;
        margin-top: 0px;
        padding: 50px 40px 0 40px !important;
    }

    .massage.mah-Centre.mah .col-md-6.flex .cont-description p {
        margin-top: 27px;
    }

    .massage.mah-Centre.mah .col-md-6.flex {
        display: flex;
        align-items: initial;
    }

    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 100%;
        margin-top: 0px !important;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 .cont-description p {
        margin-top: 27px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 {
        padding: 50px 40px 0 20px !important;
    }
}

section.hamam.mah-Centre.mah .hamam-img {
    position: relative;
    left: 0;
    width: 100%;
    height: 100%;
}


@media (min-width: 1025px) and (max-width: 1676px) {
    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 95%;
        margin-top: 0px !important;
        padding-right: 0;
        padding-left: 0;
        margin-left: 10px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 .cont-description p {
        margin-top: 27px;
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        margin-bottom: 27px;
        text-align: justify;
        line-height: 35px;
    }

    .massage.coiffure.mah-Centre.mah .col-md-6.order-md-1 {
        padding: 20px 40px 0 20px !important;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col,
    .massage.mah-Centre.mah .col-md-6.flex {
        margin-top: 20px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        margin-top: 50px;
        padding-right: 0;
        padding-left: 0;
        margin-left: 10px;
    }

    section.massage.mah-Centre.mah .cont-description {
        padding: 20px 40px 0 40px;
        width: 100%;
        margin-left: 0;
        margin-top: 0;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 27px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        width: 90%;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        margin-bottom: 10px;
    }

    .massage.mah-Centre.mah .slick-slide img {
        display: block;
        width: 100%;
        object-fit: cover;
    }

    .massage.mah-Centre.mah .carousel-caption {
        position: relative;
        right: 0;
        bottom: 0;
        left: 0;
        padding-top: 0;
        padding-bottom: 0;
        color: #fff;
        text-align: center;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: 100%;
        padding: 0;
    }

    section.massage.coiffure.mah-Centre.mah {
        padding: 35px 35px 35px 35px !important;
    }

    .massage.mah-Centre.mah .cont-description p {
        margin-top: 27px;
    }

}

@media (min-width: 767px) and (max-width: 1024px) {
    .collection.mah-nouveaute.mah-Centre .col-lg-5.col-md-2.mah {
        width: 40% !important;
    }

    section.collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        padding: 10px 0px 0px;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        margin-bottom: 10px;
        text-align: justify;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        width: 40%;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-md-2 {
        width: 60%;
    }
}

@media (min-width: 1024px) {

    /* .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-prev.slick-arrow,
    .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-next.slick-arrow {
        bottom: -60px !important;
    } */

}

@media (min-width: 1024px) and (max-width: 1200px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection {
        padding: 10px 0 0;
    }

    section.collection.mah-nouveaute.mah-Centre .desc_collection h4 {
        margin-bottom: 10px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col p {
        margin-top: 20px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description {
        margin-top: 20px;
    }

    section.massage.mah-Centre.mah {
        padding: 35px 50px;
    }

    section.massage.mah-Centre.mah .slick-list img {
        height: 100%;
        width: 100%;
    }

    .massage.mah-Centre.mah::after {
        height: 100%;
        top: 0;
    }

    .massage.mah-Centre.mah .cont-description p {
        margin-top: 20px;
    }

    .massage.mah-Centre.mah .col-md-6.flex {
        margin-top: 0px;
        align-items: initial;
    }

    section.massage.mah-Centre.mah .cont-description {
        padding: 20px 40px 0 0px;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col .cont-description,
    .massage.coiffure.mah-Centre.mah .cont-description {
        width: 100%;
    }

    .cont-description {

        margin-top: 0px !important;
    }
}

@media (min-width: 767px) and (max-width: 991px) {
    .collection.mah-nouveaute.mah-Centre .col-md-12.col-lg-5.col-md-2.mah {
        width: 100% !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 10px;
    }

    .massage.mah-Centre.mah .carousel.slide img {
        height: auto;
        margin-bottom: 0;
    }

    .massage.mah-Centre.mah .carousel-maquillage.slick-initialized.slick-slider .carousel-caption {
        bottom: 0;
        left: 0;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: auto;
        padding: 0;
    }

    .hamam.mah-Centre.mah .col-sm-12.col-md-6.order-md-2 {
        width: 100% !important;
        order: 0 !important;
    }

    section.hamam.mah-Centre.mah .col-sm-12.col-md-6.order-col {
        width: 100%;
    }

    section.hamam.mah-Centre.mah .row {
        display: flex;
        flex-direction: column;
    }

    .massage.mah-Centre.mah .col-md-6 {
        width: 100%;
    }

    section.mah-Centre.mah:after {
        height: 78%;
    }

    section.massage.coiffure.mah-Centre.mah::before {
        height: 78% !important;
        top: 0 !important;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next:before {
        bottom: -303px !important;
    }

    section.collection.mah-nouveaute.mah-Centre .mah-desc .desc_collection {
        padding: 50px 0px 0px !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 50px;
    }
}

@media (max-width: 767px) {
    .collection.mah-nouveaute.mah-Centre .col-md-12.col-lg-5.col-md-2.mah {
        width: 100% !important;
    }

    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 50px;
    }

    .massage.mah-Centre.mah .carousel-item.shine img {
        height: auto !important;
        width: 100%;
    }

    .massage.coiffure.mah-Centre.mah .carousel-item img {
        height: auto !important;
    }

    section.hamam.mah-Centre.mah .hamam-img {
        height: auto !important;
    }

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 70% !important;
        top: 0px;
    }

    .massage.mah-Centre.mah .carousel-maquillage .carousel-item.shine {
        min-height: auto;
        padding: 0 10px;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage button.slick-prev.slick-arrow,
    .massage.coiffure.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -20px) !important;
        transform: translateX(50%);
        bottom: -45px !important;
        width: 50px;
        height: 50px;
        left: inherit;
        position: absolute;
        top: inherit;
        z-index: 3;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -39px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next.slick-arrow {
        right: calc(50% - 20px) !important;
        transform: translateX(100%);
        bottom: -45px !important;
        top: inherit;
        width: 50px;
        height: 50px;
        left: inherit;
    }

    .massage.coiffure.mah-Centre.mah .carousel-maquillage .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: -34px !important;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px !important;
    }
}

@media (max-width: 500px) {

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 60% !important;

    }
}

@media (max-width: 400px) {

    section.massage.mah-Centre.mah:after,
    section.massage.coiffure.mah-Centre.mah::before {
        height: 48% !important;

    }
}

@media (max-width: 767px) {

    section.esthetique-home.mah-Centre.mah .slick-prev:before,
    section.esthetique-home.mah-Centre.mah .slick-next:before {
        bottom: -35px;
    }

    section.esthetique-home.mah-Centre.mah p {
        margin-bottom: 25px;
    }

    section.esthetique-home.mah-Centre.mah {
        padding: 35px 0px 60px 0px;
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    section.esthetique-home.mah-Centre.mah p {
        margin-bottom: 25px;
        color: black;
    }

    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 10%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -5%) !important;
    }
}

@media (min-width: 768px) {
    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        transform: translateX(50%) !important;
        bottom: -45px !important;
        left: inherit;
        position: absolute;
        z-index: 3;
    }

    section.esthetique-home.mah-Centre.mah .slick-prev:before {
        top: -2px !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {

        transform: translateX(100%) !important;
        bottom: -45px !important;
        left: inherit;
    }

    section.esthetique-home.mah-Centre.mah .slick-next:before {
        top: -2px !important;
    }
}

@media (min-width: 992px) and (max-width: 1024px) {
    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 10%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - -5%) !important;
    }
}

@media (min-width: 1024px) and (max-width:1200px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 35%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 30%) !important;
    }
}

@media (min-width: 1200px)and (max-width: 1440px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 25%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 25%) !important;
    }
}

@media (min-width: 1441px)and (max-width: 1667px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 30%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 30%) !important;
    }
}

@media (min-width: 1667px) {
    section.esthetique-home.mah-Centre.mah .slick-next.slick-arrow {
        right: calc(50% - 20%) !important;
    }

    section.esthetique-home.mah-Centre.mah button.slick-prev.slick-arrow {
        right: calc(50% - 17%) !important;
    }
}

@media (min-width: 1024px) {

    section.esthetique-home.mah-Centre.mah {
        padding-bottom: 65px !important;
    }

    section.esthetique-home.mah-Centre.mah .content-imgMahassen {
        width: 100% !important;
    }

    section.esthetique-home.mah-Centre.mah .slick-prev:before {

        background: url(../images/btnright.png) center no-repeat;
    }

    section.esthetique-home.mah-Centre.mah .slick-next:before {
        background: url(../images/btnleft.png) center no-repeat;
    }
}

.bloc-3-collection.Centre-M .grid-wrapper-colletion img {
    width: auto !important;
}

.bloc-3-collection.Centre-M .grid-wrapper-colletion {
    margin-left: 0;
}

.bloc-1-collection.Centre-M .title-bloc1-collection {
    text-align: center;
    background: var(--grayLighten_color);
    font-family: "Century-Gothic-Std", "Century Gothic";
    color: black;
    margin: 0 30px;
    font-size: 19px;
    padding: 10px;
    text-transform: uppercase;
}

@media (min-width:1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 25px 0 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .container-fluid {
        padding-right: 0;
        padding-left: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .application-img-btb {
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
        margin-top: 85px;
        padding-left: 0;
        margin-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 60px 0 0 !important;
    }

}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 0px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 15px;
    }

    .header-marketing .header-marketing-icons a {
        right: -175px !important;
    }
}

@media (min-width: 1201px) and (max-width: 1667px) {

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 20px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        margin-top: 40px;
    }
}

@media (min-width: 1025px) and (max-width: 1667px) {
    section.bloc3-app-btb.b2b .application-img-btb {
        position: relative;
        left: 0;
        top: 0;
    }

    section.bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        padding-left: 0;
        margin-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 65px 0 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95%;
        padding-left: 0;
        margin-left: 0;
    }
}

@media (max-width:1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b .col-md-6 {
        width: 100%;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .content-img {
        padding-right: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .application-img-btb,
    .bloc3-app-btb.fidelité-b2b.b2b .application-img-btb {
        left: 0;
        top: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 0;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .container-fluid,
    .bloc3-app-btb.fidelité-b2b.b2b .container-fluid {
        padding-right: 0;
        padding-left: 0;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .col-md-6 {
        width: 100%;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .col-md-6.order-md-1 {
        order: -1 !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b {
        padding: 30px 0px 0px 0px;
    }
}

@media (max-width:767px) {
    .carte-mahassen.centre-m.b2b {
        padding: 50px 35px 20px;
    }
}

/*REsponsive Card-B2b-Fidelité*/
section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
    writing-mode: vertical-rl;
    font-size: 100px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: var(--grayLighten_color);
    margin-left: -41px;
    letter-spacing: 0.2rem;
    display: inherit;
    line-height: initial;
}

section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {
    writing-mode: vertical-rl;
    font-size: 80px;
    font-family: var(--Brand_title_fonts);
    text-transform: uppercase;
    font-weight: 900;
    color: #fde2e1;
    margin-top: 361px;
    margin-left: 13px;
    letter-spacing: 0.2rem;
    display: inherit;
}

@media (min-width:1667px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {

        font-size: 150px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 320px;
        margin-left: 2rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 100px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 130px;
        margin-left: -1rem !important;
        height: 0 !important;
    }

}

@media (min-width: 1200px) and (max-width: 1676px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 80px;
        margin-left: -40px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 280px;
        margin-left: 2rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 250px;
        margin-left: -1rem !important;
        height: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 80px;
    }

}

@media (min-width: 1025px) and (max-width: 1200px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 950px !important;
    }
}

@media (min-width: 1201px) and (max-width: 1440px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 1120.06px !important;


    }

}

@media (min-width: 1441px) and (max-width: 1676px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-one {
        height: 1060.06px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .content-carte-one .content-img {
        max-height: 710px !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 100px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 120px;
        margin-left: 1.5rem !important;
        height: 950px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah span {

        font-size: 80px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 80px;
        margin-left: -1.5rem !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1030.05px !important;
    }
}

@media (max-width: 991px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-img.shine {
        width: 100% !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 860px;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 70px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-left: 2.5rem;
        font-size: 110px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 0px 35px 20px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-left: -1.5rem;
        font-size: 110px;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 60px auto 100px;
        margin-top: 0;

    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 70px;

    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 650px !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-img.shine {
        margin-bottom: 35px;
    }

}

@media (min-width: 768px) and (max-width: 775px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1135px !important;
    }
}

@media (min-width: 776px) and (max-width: 867px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1090px !important;
    }
}

@media (min-width: 868px) and (max-width: 991px) {
    .carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .profiter {
        height: 1040px !important;
    }
}

@media (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite span {
        font-size: 65px !important;
        margin-left: 0 !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .remise {
        left: 2px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 215px;
        margin-left: -0.50rem !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        margin-top: 0px;
        margin-left: -0.50rem !important;
    }

    .carte-mahassen.centre-m.fidelitéB2B .b2b-fidelite .content-carte-mahassen .content-img.shine {
        margin-bottom: 30px;
    }
}

@media (min-width: 360px) and (max-width: 400px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 0;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 50px auto 60px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 55px;

    }
}

@media (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen {
        grid-template-columns: 40px auto 60px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        grid-template-columns: auto 55px;

    }

    section.carte-mahassen.centre-m.fidelitéB2B .col-md-12.col-lg-6.b2b-fidelite .profiter {
        height: 954px !important;
    }

}

@media (max-width: 391px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 991px !important;
    }
}

@media (min-width: 391px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 988px !important;
    }
}

@media (max-width: 367px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 510px !important;
    }
}

@media (min-width: 368px) and (max-width: 389px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 465px !important;
    }
}

@media (min-width: 390px) and (max-width: 395px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 420px !important;
    }
}

@media (min-width: 396px) and (max-width: 440px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 490px !important;
    }
}

@media (min-width: 441px) and (max-width: 456px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 445px !important;
    }
}

@media (min-width: 457px) and (max-width: 488px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 390px !important;
    }
}

@media (min-width: 489px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 350px !important;
    }
}

@media (min-width: 501px) and (max-width: 767px) {

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen .fidelite {
        margin-top: 0;
        height: 0px !important;
        margin-left: -0.50rem !important;
    }
}

@media (min-width: 401px) and (max-width: 500px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 10px 0 50px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 890px !important;
    }
}

@media (min-width: 501px) and (max-width: 767px) {
    section.carte-mahassen.centre-m.fidelitéB2B {
        padding: 10px 0 50px;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two .fidelite.Mah {
        height: 890px !important;
    }

    section.carte-mahassen.centre-m.fidelitéB2B .profiter {
        height: 876px;
    }

    .carte-mahassen.centre-m.fidelitéB2B .content-carte-one.b2b {
        height: 860px !important;
    }
}

@media (min-width: 501px) and (max-width:547px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 0px !important;
    }

}

@media (min-width: 548px) and (max-width:570px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 255px !important;
    }
}

@media (min-width: 571px) and (max-width:625px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 215px !important;
    }
}

@media (min-width: 626px) and (max-width:655px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 200px !important;
    }
}

@media (min-width: 656px) and (max-width:682px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 150px !important;
    }
}

@media (min-width: 683px) and (max-width:767px) {
    section.carte-mahassen.centre-m.fidelitéB2B .content-carte-mahassen.carte-two {
        margin-top: 100px !important;
    }
}

.bloc2-app-btb.fidelité-b2b.b2b .application-img-btb .content-img {
    padding-right: 0;
}

@media (min-width: 1024px) {
    .bloc2-app-btb.fidelité-b2b.b2b {
        padding: 0;
    }
}

@media (min-width: 1581px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .cont-description p,
    .bloc3-app-btb.fidelité-b2b.b2b .cont-description p {
        margin-top: 20px;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 100% !important;
        padding-right: 50px !important;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 20px !important;
    }

}

@media (min-width: 1130px) and (max-width: 1580px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .bloc3-app-btb.fidelité-b2b.b2b .cont-description {
        width: 100% !important;
        padding-right: 50px !important;
    }

    .bloc2-app-btb.fidelité-b2b.b2b .cont-description p,
    .bloc3-app-btb.fidelité-b2b.b2b .cont-description p {
        margin-top: 20px;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 10px !important;
    }
}

@media (min-width: 1024px) and (max-width: 1130px) {
    .bloc2-app-btb.fidelité-b2b.b2b .cont-description {
        width: 95% !important;
        padding-left: 53px !important;
    }

    .massage.coiffure.b2b-marque .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .coiffure-hom.marque.block .cont-description,
    .massage.massage.coiffure.marque .col-md-6 .cont-description-right {

        width: 95% !important;
        padding-right: 10px !important;
        margin-left: 10px !important;
    }

}

@media (max-width:991px) {
    .collection.mah-nouveaute.maquillage .desc_collection p {
        text-align: justify;
    }

    section.coiffure-hom.b2b-marque {
        padding: 30px 35px 35px 35px;
    }
}

@media (min-width:396px) and (max-width:470px) {
    .coiffure-hom.b2b-marque .content-img img {
        width: 100% !important;
    }

    section.coiffure-hom.b2b-marque {
        padding: 30px 35px 35px 35px;
    }
}

@media (min-width:396px) and (max-width:470px) {
    .coiffure-hom.b2b-marque .content-img img {
        width: 100% !important;
    }
}

/* @media (min-width:360px) and (max-width:500px){
    .mahassen-lives.soin.soinPeau{
        margin-top: 100px !important;
    }
} */
@media (min-width:360px) and (max-width:365px) {
    .lamarque.soinPeau {
        margin-top: 160px;
    }
}

@media (min-width:366px) and (max-width:384px) {
    .lamarque.soinPeau {
        margin-top: 130px;
    }
}

@media (min-width:768px) and (max-width:800px) {
    .lamarque.soinPeau {
        margin-top: 50px;
    }
}

section.catalogBloc.actualitéBloc::after {
    top: -10px;
}

@media (min-width:1200px) and (max-width:1676px) {
    .massage.coiffure.marque .cont-description-right {
        padding-top: 20px !important;
    }

    .massage.massage.coiffure.b2b-marque .cont-description {
        margin-top: 0px !important;
        padding-top: 50px !important;
        padding-left: 0;
        margin-left: 10px;

    }
}

@media (min-width:1201px) and (max-width:1325px) {

    .coiffure-hom.marque.block .cont-description,
    .coiffure-hom.b2b-marque .cont-description,
    .massage.coiffure .cont-description {
        padding-top: 20px !important;

    }
}

@media (max-width:767px) {
    section.coiffure-hom.b2b-marque::after {
        top: 0 !important;
        height: auto !important;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto;
        top: 0;
    }
}

.coiffure-hom.b2b-marque .content-img {
    padding-top: 0 !important;
}


@media (min-width: 992px) and (max-width: 1200px) {
    .coiffure-hom.b2b-marque .cont-description {
        margin-top: 0 !important;
    }

    .coiffure-hom.b2b-marque::after {
        height: auto;
        top: 0;
    }

    .massage.coiffure.b2b-marque .cont-description {
        margin-left: 0 !important;
        margin-top: 0 !important;
    }

    section.massage.coiffure.b2b-marque::before {
        height: auto !important;
        top: 0;
    }

}

@media (min-width: 1100px) and (max-width: 1200px) {
    section.coiffure-hom.b2b-marque {
        margin-top: 20px !important;
    }
}

@media (min-width: 1581px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 20px !important;
        margin-top: 95px !important;
        margin-left: 53px;
        padding-left: 0;
    }
}

@media (min-width:1260px) and (max-width: 1580px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 40px !important;
        margin-top: 80px !important;
        margin-left: 53px;
        padding-left: 0;
    }
}

@media (min-width:1025px) and (max-width: 1259px) {
    .coiffure-hom-blogs .col-md-6.blogs .cont-description {
        width: 95% !important;
        padding-right: 40px !important;
        margin-top: 45px !important;
        margin-left: 53px;
        padding-left: 0;
    }

    .coiffure-hom-blogs .col-md-6.blogs h1 {
        font-size: 32px;
    }

}

@media (min-width:767px) and (max-width: 991px) {

    .coiffure-hom-blogs .col-md-6.blogsImg,
    .coiffure-hom-blogs .col-md-6.blogs {
        width: 100%;
    }
}

@media (min-width:767px) and (max-width: 1200px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-top: 50px;
        padding-bottom: 70px;
    }

    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        line-height: 35px !important;
    }
}

@media (max-width:767px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-top: 50px;
        padding-bottom: 70px;
    }

    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        line-height: 35px !important;
    }

    .actualité-blogs.blogs {
        margin-top: 0;

    }
}

@media (min-width:1166px) and (max-width: 1200px) {
    .inscriptionBlogs {
        margin-top: -85px;
    }
}

@media (max-width:500px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        font-size: 20px;
        padding-bottom: 105px;
    }

    .inscriptionBlogs {
        margin-top: -50px;
    }

}

@media (min-width:501px) and (max-width:767px) {
    .actualité-blogs.blogs .box-blogs.Card .titre-conseil {
        padding-bottom: 90px !important;
    }

    .inscriptionBlogs {
        margin-top: -50px;
    }
}

@media (max-width:1200px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan {
        display: none !important;
    }
}

@media (min-width:1740px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 52px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0;
    }
}

@media (min-width:1667px) and (max-width:1740px) {
    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        font-size: 50px;
        margin-top: 0px;
        margin-bottom: 0px;
        margin-left: 0;
    }

    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 86%;
        float: left;
    }
}

.bonPlan-img-section-bottom.centre .content-image.shine img {
    width: 100%;
    height: 100%;
}

.bonPlan-img-section-bottom.centre {
    padding: 30px 35px 30px 50px;
}

@media (min-width:767px) and (max-width:1200px) {
    .bonPlan-img-section-bottom.centre .content-image.shine img {
        width: 85% !important;
        height: 100%;
    }
}

@media (max-width:767px) {
    .bonPlan-img-section-bottom.centre .content-image.shine img {
        width: 100% !important;
        height: 100%;
    }
}

@media (min-width: 1200px) and (max-width: 1346px) {
    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 100%;
        float: left;
    }


    .bonPlan-img-section-bottom.centre .fidelite-bon-plan span {
        margin-top: 0px;
        font-size: 32px;
        display: none;
    }
}

@media (min-width: 1347px) {
    .bonPlan-img-section-bottom.centre .content-image.shine {
        width: 85%;
        float: left;
    }
}

@media (max-width: 480px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .close-carte,
    .set-aside {
        height: 35px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

@media (max-width: 768px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }


    .close-carte,
    .set-aside {
        height: 59px;
        padding: 8px;
    }


    .button-space {
        margin-right: 0;
    }
}

@media (max-width: 1116px) and (min-width: 768px) {

    .close-carte,
    .set-aside {
        margin-bottom: 0;
    }

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }

}

@media (max-width: 767px) {

    .close-carte,
    .set-aside {
        display: block;
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
        font-size: 14px;
    }

    .button-space {
        margin-right: 0;
    }
}




@media (min-width: 768px) and (max-width: 1024px) {
    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        top: -38px;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }



    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -42px;
        top: -38px;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
    }

    section.newsletter.soin {
        padding-top: 50px;
    }

    .mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -22px;
        top: -66px;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 123px;
        width: 60px;
        content: "";
    }

    .abonnez-vous.instagram {
        margin-top: -14px !important;
        padding: 74px;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
        padding: 0px;
    }
}

@media (min-width: 1441px) {
    section.mahassen-lives .slick-next:before {
        height: 27px;

    }

    section.mahassen-lives .slick-prev:before {
        height: 27px;
    }

    .abonnez-vous.instagram {
        margin-top: -52px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
    }
}

@media (min-width: 481px) and (max-width: 767px) {

    .abonnez-vous.instagram {
        margin-top: 23px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
        padding-top: 27px !important;
    }
}

@media (max-width: 480px) {
    section.mahassen-lives .slick-next:before {
        height: 27px;

    }

    section.mahassen-lives .slick-prev:before {
        height: 27px;
    }

    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    .abonnez-vous.instagram.soin {
        margin-top: -40px !important;
        padding-top: 27px !important;
    }
}


.modal.produit {
    display: none;
    position: fixed;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
}

.modal.produit .modal-content {
    background-color: #fefefe;
    margin: 15% auto;
    border: 1px solid #888;
    width: 50%;
    text-align: center;
}

span#closeModal {
    text-align: right;
}

.modal.produit .close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    padding-right: 20px;
    padding-top: 20px;
    padding-bottom: 20px;
}

.modal.produit .close:hover,
.modal.produit .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

.flex-Row {
    display: flex;
    align-items: center;
    padding: 45px 20px 45px 20px;
}

.flex-Product-details {
    flex: 1;
}

.flex-Product {
    width: 40%;
}

#productModal .promo-price {
    font-size: 16px;
    font-weight: bold !important;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    margin-bottom: 5px;
}

#productModal .initial-price {
    font-size: 16px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
}

#modalImage {
    width: 80%;
}

#modalProductName {
    text-transform: capitalize;
    font-weight: 600;
}

.modal-buttons {
    margin-top: 20px;
    /* Espacement au-dessus des boutons */
}

.modal-buttons button {
    padding: 12px 20px;
    margin-right: 10px;
    cursor: pointer;
    border: none;
    background: black;
    color: white;
    font-family: "Century Gothic", sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    font-size: 12px;

}

.abonnez-vous-slider-inspirez-vous {
    display: flex;
    justify-content: center !important;
    align-items: center !important;
}

.abonnez-vous-slider-inspirez-vous .item {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 0 15px !important;
}

.abonnez-vous-slider-inspirez-vous img {
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    display: block !important;
}


.modal-buttons button:hover {
    background: white;
    color: black;
    border: 1px solid black;
}

.modal-valid div {
    padding-top: 30px;
    font-size: 18px;
    font-family: var(--Brand_title_fonts);
    color: var(--Heading_color);
    margin-bottom: 20px;
    letter-spacing: 0.02rem;
    text-align: center;
}

.modal-content span {
    font-family: "Century Gothic", sans-serif;
    font-weight: 600;
    font-size: 31px;
}

.notification {
    position: fixed;
    top: 20px;
    right: 20px;
    width: 450px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    display: flex;
    flex-direction: column;
    opacity: 0;
    transition: opacity 0.3s ease;
}


.modal-valid {
    background: #f5f5f5;
    padding: 10px 50px;
    border-radius: 5px;
}



.notification-content {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 10px;
    margin-bottom: 15px;


}

#notificationProductName {
    font-size: 16px;
    font-family: var(--Brand_title_fonts);
    text-transform: capitalize;
    font-weight: 600;
    margin-bottom: 10px;
}

#notificationPrice .promo-price {
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-weight: 400;
    color: #f33f38;
    font-size: 14px;
}

.notification img {
    width: 30%;
    height: 30%;
    margin-right: 15px;

}

.notification-buttons {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 10px
}

.notification-buttons button {
    padding: 10px 7px;
    border: none;
    background: black;
    color: white;
    font-size: 12px;
    cursor: pointer;
}

.notification-buttons button:hover {
    background: white;
    color: black;
    border: 1px solid black;
}

img.hammem {
    width: auto;
    height: 100%;
}


#notificationPrice {
    text-align: center;
}


/* Start Mahaseen live section  */

@media (min-width: 1921px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 20px !important;
        top: -94px !important;
    }

    section.newsletter {
        padding: 50px 0 45px !important;
        text-align: center;
    }

    .newsletter {
        margin-top: -31px !important;
    }

    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        top: 57px;
    } */

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -24px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 132px !important;
        width: 60px;
        content: "";
    }


}


@media (min-width: 1601px) and (max-width: 1920px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 20px !important;

    }


    /* .carousel-maquillage .slick-next:before, .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -64px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    } */

    /* .carousel-maquillage .slick-prev:before, .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 20px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
    } */

    /* .Avis-mah-Centre section.avis-clients {
        margin-top: -100px;
        padding: 20px;
        top: 17px;
    } */

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px;
        width: 60px;
        content: "";
        top: -28px;
    }

    p.text-bon-plan {
        font-size: 25px;
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 38px;
        color: rgb(0, 0, 0);
    }

    section.product-cosmetique .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -120px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 40px;
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -12px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 121px !important;
        width: 60px;
        content: "";
        top: -81px;
    }

    section.autonome .content-autonome-desc .title-maquillage-pro {
        /* padding-left: 98px; */
    }

    .carousel-maquillage .slick-next:before,
    .carousel-inner .slick-next:before {
        height: 20px !important;
        width: 60px;
        content: "";
        left: 3px !important;
    }
}



@media (min-width: 1024px) and (max-width: 1200px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        /* margin-top: 20px !important; */
        /* top: 39px !important; */
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-weight: 700;
        text-transform: uppercase;
        font-size: 27px;
        color: rgb(0, 0, 0);
    }

    p.text-bon-plan {
        font-size: 20px;
    }

    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        top: 16px;
        margin-top: 74px;
    } */

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -530px !important;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 461px !important; */
        width: 60px;
        content: "";
        top: auto;
    }
}


@media (min-width: 1201px) and (max-width: 1440px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;


    }

    /* .Avis-mah-Centre section.avis-clients {
        padding: 39px;
        margin-top: 40px !important;
        /* top: 105px; */
    } */

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 27px;
    }


    p.text-bon-plan {
        font-size: 23px;
    }


}


@media (min-width: 1441px) and (max-width: 1600px) {
    section.mahassen-lives {
        padding: 30px 60px 80px 30px !important;
        position: relative;
        margin-top: 20px !important;

    }

    .Avis-mah-Centre section.avis-clients {
        padding: 20px;
        top: 116px;
        margin-top: 53px;
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 128px !important;
        width: 60px;
        content: "";
        top: -79px;
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -24px;
        font-weight: 300;
        width: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -26px !important;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px !important;
        width: 60px;
        left: -16px !important;
        content: "";
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 33px;
    }


    p.text-bon-plan {
        font-size: 26px;
    }

}

@media (min-width: 991px) and (max-width: 768px) {
    section.mahassen-lives {
        padding: 30px 60px 20px 30px !important;
        position: relative;
        margin-top: 10px !important;
        top: 96px;
    }

    /* .Avis-mah-Centre section.avis-clients {
        padding: 0;
        top: 57px;
    } */

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 461px !important;
        width: 60px;
        content: "";
    }


}


@media (min-width: 300px) and (max-width: 374px) {

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 32px !important;
        width: 60px;
        top: auto;
        content: "";
    }



    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -35px;
        font-weight: 300;
        width: 51px;
        height: 31px !important;
        background: url(../images/btnleft.png) center no-repeat;
        height: 68px;
        top: auto;
        width: 60px;
        content: "";
    }

    /* section.mahassen-lives .slick-next:before {
        height: 124px !important;
    }

    section.mahassen-lives .slick-prev:before {
        height: 124px !important;
    } */

    /* .Avis-mah-Centre section.avis-clients {
        margin-top: 100px !important;
    } */

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 461px !important;
        width: 60px;
        content: "";
    }


}

@media (min-width: 375px) and (max-width: 400px) {

    /* .Avis-mah-Centre section.avis-clients {
        top: 316px;
        margin-top: 100px;
        height: 744px;
    } */

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        /* height: 134px !important; */
        width: 60px;
        content: "";
    }


    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -38px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 135px; */
        width: 60px;
        content: "";
    }

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -149px !important;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 478px !important;
        width: 60px;
        content: "";
    }

    section.product-cosmetique.maquillage {
        margin-bottom: 15px;
    }

}


@media (min-width: 401px) and (max-width: 460px) {

    section.product-cosmetique.maquillage {
        margin-bottom: 15px;
    }

    /* .Avis-mah-Centre section.avis-clients {
        padding: 36px;
        margin-bottom: 50px;

    } */

    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        /* left: -27px; */
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 130px !important; */
        width: 60px;
        content: "";
        /* top: -80px; */
    }

    /* .avis-home {
        padding-top: 42px;
    } */

}

@media (max-width: 500px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 36px;
        margin-top: 100px;
        margin-bottom: 142px;
        top: 132px;
    } */

    /* .Centre-m {
        padding-bottom: 50px;
    } */
}

@media (min-width: 500px) and (max-width: 560px) {
    /* .Avis-mah-Centre section.avis-clients {
        padding: 36px;
        margin-top: 100px;
        margin-bottom: 94px;
        top: 24px;
    } */

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        top: inherit;
        content: "";
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -23px;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 20px !important;
        width: 60px;
        top: inherit;
        content: "";
    }
}

/* End Mahaseen live section */


/* Start abonnez-vous section */
@media (min-width: 1921px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 36px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -80px;
    }



}

@media (min-width: 1601px) and (max-width: 1920px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: -16px;
        width: 60px;
        content: "";
        top: 0px !important;
        left: 0px !important;

    }

    .fidelite-mahassen {
        max-height: 1267px;
        margin-bottom: 100px;
    }


    section.autonome.home .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 4px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 120px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.maquillage.home .content-autonome-desc {
        padding-left: 50px;
    }

    section.autonome.home .slick-prev:before,
    .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -39px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 120px;
        width: 60px;
        content: "";
        top: -7px;
    }

    .carousel-maquillage button.slick-prev.slick-arrow,
    .carousel-inner button.slick-prev.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0;
        right: 0;
        width: 60px;
        height: auto;
        left: inherit;
        z-index: 3;
    }

    section.collection {
        padding-bottom: 100px !important;
    }

}


@media (min-width: 1201px) and (max-width: 1440px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }


    section.collection.home .collection_hiver .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 13px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.collection.home .collection_hiver .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -4px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    .carousel-item img {
        /* width: auto !important; */
        background-size: cover;
        margin: 0 auto;
    }


    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        position: absolute;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnleft.png) center no-repeat;
        height: 16px;
        width: 60px;
        content: "";
        top: -4px !important;
        font-size: 51px;
        position: absolute;
        left: -25px;
    }

    section.mahassen-lives .mahassen-live-desc a.decouvrir {
        margin-top: 10px !important;
    }
}


@media (min-width: 1441px) and (max-width: 1600px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 36px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
    }

    section.collection.home .collection_hiver .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 0px;
        right: 109px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }


    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 90px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -80px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: 20px;
        right: 125px;
    }
}


@media (min-width: 300px) and (max-width: 374px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 83px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -255px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -154px;
        right: 121px;
    }

    /* .avis-home {
        padding-top: 47px;
    } */

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: -35px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 20px;
        width: 60px;
        content: "";
        display: none;
    }

    section.autonome.home .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: 186px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 31px;
        width: 60px;
        left: -16px;
        height: -17px !important;
        top: -15px !important;
        content: "";
    }

    section.nouveaute .content-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .content-noveaute-desc {
        padding-top: 0px !important;
    }
}

@media (min-width: 375px) and (max-width: 400px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 71px !important;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -246px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -145px;
        right: 112px;
        left: -100px !important;
    }

    section.autonome.home .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 85px;
        width: 60px;
        content: "";
    }

    section.autonome.home .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        top: 186px;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 31px;
        width: 60px;
        left: -20px !important;
        height: -17px !important;
        top: -11px;
        content: "";
    }
}


@media (min-width: 401px) and (max-width: 460px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }

    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: 74px;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        /* height: 10px; */
        width: 60px;
        content: "";
        top: -202px;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        height: 10px;
        width: 60px;
        content: "";
        top: -102px;
        right: 68px;
    }
}

@media (min-width: 500px) and (max-width: 560px) {
    .abonnez-vous.instagram {
        margin-top: 13px !important;
    }



    section.collection.home .collection_hiver .slick-prev:before,
    .carousel-inner .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px !important;
        position: absolute;
        bottom: 0 !important;
        left: 38px !important;
        /* right: 52px; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 77px !important;
        width: 60px !important;
        content: "";
        top: -126px !important;
    }

    section.collection.home .collection_hiver .slick-next:before,
    .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0 !important;
        font-weight: 300 !important;
        background: url(../images/btnleft.png) center no-repeat !important;
        width: 60px !important;
        content: "" !important;
        top: -26px !important;
        left: -4px !important;
        height: 77px !important;
    }

    section.autonome.home .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        top: -74px !important;
        background: url(../images/btnright.png) center no-repeat;
        height: 130px !important;
        width: 60px;
        content: "";
        left: -227px !important;
    }

    section.autonome.home .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        top: -74px !important;
        background: url(../images/btnleft.png) center no-repeat;
        height: 130px !important;
        width: 60px;
        content: "";
        left: -227px !important;
    }


    section.autonome.home .slick-next:before, .carousel-inner .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        /* right: -31px !important; */
        /* left: -20px !important; */
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat !important;
        height: 131px !important;
        width: 60px;
        content: "";
        /* top: -90px !important; */
    }
}


/* End abonnez-vous section */

/* Start Carte fidélité section */
@media (min-width: 1921px) {

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

    .fidelite-mahassen {
        max-height: max-content;

    }


}


@media (min-width: 1601px) and (max-width: 1920px) {

    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 189px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: 93px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    .fidelite-mahassen {
        max-height: 1267px;
        margin-bottom: 210px !important;
    }

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 18px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        line-height: 35px;
        padding-bottom: 40px;

    }

    .Centre-m {
        padding-bottom: 100px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 8px;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
        top: -2px;
    }

    section.maquillage .content-autonome-desc {
        margin-left: 54px;

    }

}



@media (min-width: 1024px) and (max-width: 1200px) {


    section.carte-mahassen .content-carte-mahassen:not(.carte-two) .fidelite-one-acceuil span {
        writing-mode: vertical-rl;
        font-size: 120px;
        font-family: var(--Brand_title_fonts);
        text-transform: uppercase;
        font-weight: 900;
        color: var(--grayLighten_color);
        margin-left: 0px;
        letter-spacing: 0.2rem;
        display: inherit;
        line-height: initial;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        line-height: 35px;
        padding-bottom: 40px;
    }

    .Centre-m {
        padding-bottom: 100px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
        padding-top: 20px;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

    section.mahassen-lives .slick-prev:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btleft.png) center no-repeat;
        height: 15px;
        width: 60px;
        content: "";
    }

    section.collection.mah-nouveaute.maquillage .content-img-collection {

        margin-left: auto;
        margin-right: auto;
    }

}


@media (min-width: 1201px) and (max-width: 1440px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    .autonome.home .carousel.slide button.slick-next.slick-arrow {
        position: absolute;
        top: inherit;
        bottom: 0px;
        right: 35px;
        width: 50px;
        height: 0px;
        left: inherit;
        /* right: calc(8% - 10px) !important; */
        transform: translateX(100%);
        z-index: 3;
    }


    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 51px;
        background: url(../images/btnright.png) center no-repeat;
        height: 12px;
        width: 60px;
        content: "";
    }

    section.maquillage.home .content-autonome-desc {
        padding-right: 0px !important;
        margin-left: 0px !important;
        padding-left: 55px !important;
        padding-top: 0px !important;
        margin-top: 0px !important;
    }

}


@media (min-width: 1441px) and (max-width: 1600px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.mahassen-lives .slick-next:before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        bottom: 0;
        font-weight: 300;
        width: 51px;
        height: 10px;
        background: url(../images/btnright.png) center no-repeat;
        width: 60px;
        content: "";
    }

}

@media (min-width: 768px) and (max-width: 991px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        line-height: 35px;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-item img {
        /* height: 600px !important; */
        width: auto !important;
        background-size: cover;
        margin: 0 auto;
    }



    .autonome.home .carousel.slide .slick-prev::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        bottom: 0;
        left: -30px;
        font-weight: 300;
        background: url(../images/btnleft.png) center no-repeat;
        /* height: 205px !important; */
        /* top: 153px !important; */
        width: 60px;
        content: "";
    }

    .autonome.home .carousel.slide .slick-next::before {
        color: var(--Heading_color);
        font-family: "Font Awesome 5 Pro";
        font-size: 51px;
        position: absolute;
        right: 0;
        font-weight: 300;
        background: url(../images/btnright.png) center no-repeat;
        height: 205px !important;
        top: 153px !important;
        width: 60px;
        left: -16px;
        content: "";
    }

    .fidelite-mahassen .carte-mahassen.centre-m {
        padding: 50px 35px 20px;
    }

    .col-md-12.col-lg-6.bloc-two {
        margin-top: 53px;
    }



}


@media (min-width: 300px) and (max-width: 374px) {
    section.carte-mahassen {
        padding: 40px 35px 20px;
    }

    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        line-height: 35px;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

    .product-slider-idees.pro .slick-next.slick-arrow:before {
        width: 60px;
        top: -92px !important;
        right: 0px;
        bottom: 0;
        left: -8px;
    }

    .col-md-12.col-lg-6.col-xl-5.col-xxl-5.modify {
        padding-top: 36px !important;
    }

    .container-fluid.section-abonnez-vous-soin-de-la-peau {
        padding-top: 25px;
    }

}

@media (min-width: 375px) and (max-width: 400px) {

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

    .col-md-12.col-lg-6.col-xl-5.col-xxl-5.modify {
        padding-top: 36px !important;
    }

    .container-fluid.section-abonnez-vous-soin-de-la-peau {
        padding-top: 25px;
    }


    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 15px;
    }

    p.text-bon-plan {
        font-size: 13px;
    }



}


@media (min-width: 401px) and (max-width: 460px) {

    a.decouvrir {
        padding-top: 30px;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        /* margin-bottom: 20px !important; */
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 18px;
    }

    p.text-bon-plan {
        font-size: 14px;
    }

}

@media (min-width: 500px) and (max-width: 560px) {
    a.decouvrir {
        padding-top: 30px;
    }


    section.carte-mahassen .content-carte-mahassen .content-carte-one p {
        font-size: 15px;
        font-family: "Century-Gothic-Std", "Century Gothic";
        text-align: justify;
        line-height: 35px;
        padding-bottom: 40px;
    }

    section.autonome div#carouselExampleCaptions2 .carousel-caption {
        position: relative;
        bottom: 44px;
        z-index: 50;
        width: 100%;
        left: 0;
        text-align: center;
        padding-top: 0;
        padding-bottom: 0;
        top: 0px !important;
    }

    .fidelite-mahassen {
        position: relative !important;
        z-index: 1 !important;
        margin-bottom: 20px !important;
    }

    .page-la-marque {
        position: relative !important;
        z-index: 2 !important;
        margin-top: 20px !important;
    }

    section.lamarque {
        padding: 27px 35px;
    }

    section.bonPlan-img .content-bonplan h2.title-droite {
        font-size: 22px;
    }

    p.text-bon-plan {
        font-size: 18px;
    }

}

/* End Carte fidélité section */
@media (max-width: 1366px) {
    .container-fluid.adjust-container-section-hammem-spa .row {
        display: flex;
        justify-content: space-between;
    }
}

@media (min-width: 1140px) and (max-width: 1200px) {
    section.carte-mahassen .content-carte-mahassen.carte-two {
        padding-top: 0px !important;
    }

    .fidelite-one-acceuil {
        margin-top: 0px;
        margin-left: 0rem !important;
    }

    section.mahassen-lives button.slick-next.slick-arrow {
        bottom: -13px;
    }

    section.mahassen-lives {
        padding: 30px 60px 0px 30px !important;
    }

    .carousel-item.shine {
        height: 100%;
        min-height: 100% !important;
    }

    section.mahassen-lives {
        padding: 0px 30px 0px 30px !important;
    }

    section.newsletter {
        padding: 20px 0 45px !important;
    }

    section.carte-mahassen {
        padding: 50px 20px 0px !important;
    }

    .carousel-caption.custom-caption {
        margin-bottom: 20px !important;
    }

    .autonome.home .carousel.slide button.slick-next.slick-arrow,
    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        bottom: 0px;
    }

    .autonome.home .carousel.slide button.slick-next.slick-arrow {
        height: 0px !important;
        z-index: 3;
    }

    .autonome.home .carousel.slide button.slick-prev.slick-arrow {
        height: 30px;
    }
}

@media (max-width: 1024px) {
    .autonome {
        margin-top: 0 !important;
    }

    .collection_hiver {
        margin-top: 0px !important;
    }

    section.nouveaute .content-noveaute-desc .contnet-nouveaute {
        position: relative !important;
        top: auto !important;
        transform: none !important;
    }

    section.nouveaute.home {
        padding: 40px 10px 40px !important;
    }
}

@media (max-width: 520px) {
    section.carte-mahassen .content-carte-mahassen.carte-two .fidelite-two-acceuil span {
        display: none !important;
    }

    .fidelite-one-acceuil {
        display: none !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one {
        grid-template-columns: auto !important;
    }

    .fidelite-mahassen .carte-mahassen .content-carte-mahassen.carte-two {
        height: auto !important;
    }

    section.carte-mahassen .content-carte-mahassen.carte-two {
        grid-template-columns: auto !important;
    }

    section.mahassen-lives .mahassen-live-desc h2,
    .cont-description h2 {
        margin-top: 20px !important;
    }

    section.mahassen-lives {
        top: 0px !important;
        margin-top: 0px !important;
        padding: 0 !important;
    }

    section.newsletter {
        padding: 20px 0 20px !important;
        margin-top: 0px !important;
    }

    .carte-mahassen.centre-m .content-carte-mahassen.carte-one .content-img.shine,
    .carte-mahassen.centre-m .content-carte-mahassen.carte-two .content-img.shine {
        max-height: max-content !important;
        height: auto !important;
        margin-bottom: 0px !important;
    }

    section.carte-mahassen .content-carte-mahassen .content-carte-one h4 {
        font-size: 22px;
        margin-top: 20px;
    }

    section.carte-mahassen {
        padding: 40px 0 40px !important;
    }



}



@media (max-width: 1024px) {
    .lamarque .row {
        display: flex;
        flex-direction: column;
    }

    .lamarque .col-md-12.col-lg-4 {
        order: 1;
    }

    .lamarque .col-md-12.col-lg-8 {
        order: 2;
    }
}


.row.flex-lives {
    display: flex;
    align-items: center;

}

.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.modal-content {
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    max-width: 80%;
    width: 600px;
    position: relative;
}

.image-collection img {
    width: auto;
    height: auto;
}



.close {
    position: absolute;
    top: -14px;
    right: 7px;
    font-size: 24px;
    cursor: pointer;
    color: black;
}

.bloc-6-collection .img-anciennecoll img {
    cursor: pointer;
    transition: transform 0.2s ease-in-out;
    width: 100%;
}

.bloc-6-collection .img-anciennecoll img:hover {
    /* transform: scale(1.1); */
}


.partners-slider {
    margin-top: 20px;
}

.image-partenaire {
    width: 100%;
    height: auto;
    display: block;

}

.slick-prev,
.slick-next {

    width: auto !important;
    height: auto !important;
    z-index: 3;
}

.slick-dots li button:before {
    color: #000;
}

/* Start page contact */


section.rs-contact {
    padding: 60px 0;
    margin-left: 45px;
    margin-right: 40px;
}

.custom-col {
    width: 22%;
}

.footer,
a {
    color: var(--footer-text-color);
}

.box-contact {
    border: 1px solid #717171;
    margin: 0 10px;
    padding: 39px 20px 48px;
    text-align: center;
    /* box-shadow: inset 0px 2px 4px 0px #d7d7d7; */
    position: relative;
    transition: all .4s;
}

.box-contact span {
    color: #000;
    text-transform: uppercase;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 19px;
    margin-top: 6px;
    display: block;
    margin-bottom: 22px;
    color: black;
}

.icon-contact i {
    color: #6d6d6da8;
    font-size: 30px;
}

.fab {
    font-family: 'Font Awesome 5 Brands';
    font-weight: 400;
}

.box-contact p {
    margin: 0;
    text-transform: uppercase;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 12px;
    color: #0f0f10ab;
}

.map-contact iframe {
    max-width: 100%;
}

.title-contact {
    margin-left: 37px;
    margin-top: 10px;
}


.input-form input {
    border: 1px solid #b5b5b5;
    width: 100%;
    margin-bottom: 20px;
    padding: 18px 12px;
}

.btn-form button {
    background: #000;
    color: #fff;
    padding: 11px 3px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 22px;
    border: 1px solid transparent;
    transition: all .4s;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 30%;
    height: 50px;
    padding: 10px;
}

section.form-contact {
    padding: 30px 85px 70px;
}

.input-form textarea {
    border: 1px solid #b5b5b5;
    width: 100%;
    margin-bottom: 20px;
    padding: 18px 12px;
    height: 250px;
    color: #c9c9c9;
}

section.rs-contact .box-contact:after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 6px;
    opacity: 0;
    background: #000;
}

section.rs-contact a:hover .box-contact:after {
    opacity: 1;
}

.title-contact {
    margin-left: 37px;
    margin-top: 10px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 31px;
    font-weight: 400;
}


.box-contact p {
    margin: 0;
    text-transform: uppercase;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 12px;
    color: #0f0f10ab;
}

section.rs-contact {
    padding: 60px 0;
    margin-left: 45px;
    margin-right: 40px;
}

.custom-col {
    width: 22%;
}

.box-contact {
    border: 1px solid #717171;
    margin: 0 10px;
    padding: 39px 20px 48px;
    text-align: center;
    /* box-shadow: inset 0px 2px 4px 0px #d7d7d7; */
    position: relative;
    transition: all .4s;
}

.icon-contact i {
    color: #6d6d6da8;
    font-size: 30px;
}

.btn-form button {
    background: #000;
    color: #fff;
    padding: 11px 3px;
    font-weight: 400;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 22px;
    border: 1px solid transparent;
    transition: all .4s;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 30%;
    height: 50px;
    padding: 10px;
}

section.rs-contact {
    padding: 60px 0;
    margin-left: 45px;
    margin-right: 40px;
}

section.form-contact {
    padding: 30px 85px 70px;
}

.custom-col {
    width: 22%;
}

@media (max-width: 991px) {
    section.rs-contact {
        padding: 60px 0 0;
        margin-left: 45px;
        margin-right: 40px;
    }

    .custom-col {
        width: 50%;
        margin-bottom: 23px;
    }

    .title-contact {
        margin-left: 0;
        margin-top: 35px;
    }

    .formulaire-contact {
        margin-left: 0px !important;
    }

    section.form-contact {
        padding: 0px 0px 0px;
    }

    section.rs-contact {
        padding: 60px 0 0;
        margin-left: 45px;
        margin-right: 45px;
    }

    section.form-contact {
        padding: 30px 85px 70px;
    }
}

@media (max-width: 1700px) {
    .formulaire-contact {
        margin-left: 0px;
        margin-top: 40px;
    }

}

@media screen and (max-width: 768px) {
    .btn-form button {
        width: 50%;
        font-size: 18px;
        padding: 12px 0;
        height: 45px;
    }

    .input-form input,
    .input-form textarea {
        padding: 15px 10px;
        font-size: 14px;
    }
}

@media screen and (max-width: 576px) {
    .btn-form button {
        width: 50%;
        font-size: 16px;
        padding: 12px 0;
        height: 45px;
    }

    .custom-col {
        width: 100%;
        margin-bottom: 18px;
    }

    .input-form input,
    .input-form textarea {
        padding: 12px 8px;
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    section.form-contact {
        padding: 30px 25px 70px !important;
    }

    .telheader {
        display: none;
    }

}

/* @media (max-width: 1920px){
    .col-lg-6.form-inputs {
        padding-right: 100px;
    }

    .formulaire-contact {
        margin-left: 40px;
    }
} */
/* End page contact */
/* General reset for responsiveness */
.container-fluid {
    padding: 0 15px;
}

.lamarque,
.abonnez-vous {
    padding: 20px 10px;
}

.cont-description {
    /* text-align: center; */
    padding: 10px;
}

.live-slider img,
.abonnez-vous-slider-instagram-centre-mahassen img {
    width: 100%;
    height: auto;
}

.slick-track {
    display: flex;
    justify-content: center;
}

.slick-slide {
    max-width: 100%;
}



/* General styling for the lamarque section */
.lamarque {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    /* Vertically align content */
    margin: 0 !important;
    /* Remove any default margin */
    padding: 0 !important;
    /* Remove any default padding */
}

/* Styling for the container-fluid inside lamarque */
.lamarque .container-fluid {
    height: auto !important;
    /* Ensure container adjusts to content */
    overflow: hidden !important;
    /* Remove extra space caused by overflow */
}

/* Specific styling for mobile devices */
@media (max-width: 768px) {
    .lamarque {
        flex-direction: column !important;
        /* Stack items vertically */
    }

    .lamarque img {
        max-height: 300px !important;
        /* Limit image height on mobile */
        object-fit: cover !important;
        /* Crop image proportionally */
        width: 100% !important;
        /* Ensure the image fits its container */
        display: block !important;
        /* Prevent inline spacing */
        margin: 0 !important;
        /* Remove default margin */
    }

    .lamarque .cont-description {
        margin-bottom: 20px !important;
        /* Add space between text and image */
    }
}

/* responsive panier  */

.cart-vide {
    text-align: center;
    padding: 20px;
    max-width: 100%;
}


.icon-cart-vide i {
    font-size: 50px;
    color: #333;
    margin-bottom: 10px;
}


.cart-vide h3 {
    font-size: 24px;
    color: #000;
    margin: 10px 0;
}

.cart-vide h5 {
    font-size: 18px;
    color: #555;
    margin: 10px 0;
}


.btn-panier-vide {
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    color: #fff;
    background-color: #007bff;
    text-decoration: none;
    border-radius: 5px;
    margin-top: 15px;
}

.cart-vide img {
    max-width: 100%;
    height: auto;
    margin-top: 15px;
}


@media (max-width: 768px) {
    .cart-vide {
        padding: 10px;
    }

    .icon-cart-vide i {
        font-size: 40px;
    }

    .cart-vide h3 {
        font-size: 20px;
    }

    .cart-vide h5 {
        font-size: 16px;
    }

    .btn-panier-vide {
        font-size: 14px;
        padding: 8px 15px;
    }
}


/* End responsive panier */
/* Base styles for the next arrow */
section.collection.home .collection_hiver .slick-next:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: -4px;
    font-weight: 300;

    background: url(../images/btnright.png) center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
    top: 0px;
}

/* Base styles for the previous arrow */
section.collection.home .collection_hiver .slick-prev:before {
    color: var(--Heading_color);
    font-family: "Font Awesome 5 Pro";
    font-size: 51px;
    position: absolute;
    bottom: 0;
    left: 13px;
    font-weight: 300;
    background: url(../images/btnleft.png) center no-repeat;
    height: 10px;
    width: 60px;
    content: "";
    top: 0px;
}

/* Responsive adjustments for both arrows */
@media (max-width: 1440px) {

    section.collection.home .collection_hiver .slick-next:before,
    section.collection.home .collection_hiver .slick-prev:before {
        font-size: 45px;
        /* Slightly smaller font size */
        width: 50px;
        /* Smaller width */
    }

    section.collection.home .collection_hiver .slick-next:before {
        left: -10px;
        /* Adjust position for next arrow */
    }

    section.collection.home .collection_hiver .slick-prev:before {
        left: -115px !important;
    }
}

@media (max-width: 1200px) {

    section.collection.home .collection_hiver .slick-next:before,
    section.collection.home .collection_hiver .slick-prev:before {
        font-size: 40px;
        /* Smaller font size */
        width: 45px;
        /* Smaller width */
    }

    section.collection.home .collection_hiver .slick-next:before {
        left: -81px;
    }


    /* section.autonome.home .carousel.slide .slick-next::before {
        top: -17px;
        left: -176px !important;
    } */

    /* section.autonome.home .carousel.slide .slick-prev::before {
        top: -42px;
        left: -78px !important;
    } */


}

@media (max-width: 992px) {

    section.collection.home .collection_hiver .slick-next:before,
    section.collection.home .collection_hiver .slick-prev:before {
        font-size: 35px;
        /* Smaller font size */
        width: 40px;
        /* Smaller width */
    }

    section.collection.home .collection_hiver .slick-next:before {
        left: -20px;
        /* Adjust position for next arrow */
    }

    section.collection.home .collection_hiver .slick-prev:before {
        left: 0px;
        /* Adjust position for previous arrow */
    }
}

@media (max-width: 768px) {

    section.collection.home .collection_hiver .slick-next:before,
    section.collection.home .collection_hiver .slick-prev:before {
        font-size: 30px;
        /* Smaller font size */
        width: 35px;
        /* Smaller width */
    }

    section.collection.home .collection_hiver .slick-next:before {
        left: -25px;

    }

    section.collection.home .collection_hiver .slick-prev:before {
        left: -5px;

    }
}

@media (max-width: 576px) {

    section.collection.home .collection_hiver .slick-prev:before {
        font-size: 25px;
        width: 30px;
    }

    section.collection.home .collection_hiver .slick-next:before {
        font-size: 25px;
        width: 30px;

    }

    section.collection.home .collection_hiver .slick-next:before {
        left: -30px;

    }

    section.collection.home .collection_hiver .slick-prev:before {
        left: -10px;

    }

    @media (max-width: 768px) {
        .custom-card-conseil {
            max-width: 90%;
            margin: 0 auto;
        }

        .bloc-5-collection {
            padding: 40px 0;
            margin-right: 0px;
            margin-left: 0px;
            width: 100%;
        }
    }

    .image-box-actualité {
        width: 100%;
        max-width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .image-box-actualité img {
        width: 100%;
        height: auto;
        max-width: 100%;
        object-fit: cover;
    }


    @media (max-width: 768px) {
        .image-box-actualité {
            display: block;
            text-align: center;
        }

        .image-box-actualité img {
            width: 100%;
            max-height: 250px;
        }
    }




}
.container-timer {
    position: relative;
    display: inline-block;
}
.container-timer img {

    height: auto;
    display: block;
}
.timer {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.6);
    color: white;
    font-size: 20px;
    padding: 5px 10px;
    border-radius: 5px;
    font-family: Arial, sans-serif;
    text-align: center;
}

.countdown-container {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.6);
    /* background-color: rgba(255, 255, 255, 0.9); */
    border-radius: 15px;
    padding: 10px;
    /* box-shadow: 0 0 20px rgba(0, 0, 0, 0.3); */
}

.countdown-container .countdown {
    display: flex;
    /* justify-content: space-between; */
    font-size: 24px;
    align-items: flex-start;
}

.countdown-container .time-box {
    /* flex: 1; */
    margin: 0 5px;
    background: #f9f6f7;
    padding: 4px;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s;
}



.countdown-container .time-box span {
    display: block;
    font-size: 16px;
    font-weight: bold;
    color: #f33f38;
}

@media (max-width: 768px) {
    .countdown-container .time-box {
        margin: 10px 5px;
    }
    .time-box {
        flex: 20%; /* Les autres prennent l'espace restant */
    }
    .countdown-container .time-box span {
        font-size: 13px;
    }
    .countdown-container {
        right: 0px;
    }
    section.autonome .content-autonome-desc span {
        color: black;
    }
    .modal {
         top: -138px;
    }
}

.countdown-container .label {
    font-size: 18px;
    color: #555;
}

.countdown-container h1 {
    margin: 0;
    transition: transform 0.5s;
}
.countdown-container p {
    color: white;
    font-size: 16px;
    margin-bottom: 0px;
}

.countdown-container .shake {
    animation: shake 0.5s;
    animation-iteration-count: infinite;
}

.countdown-text{
    margin-top: 5px;
}

.image-banier-mobile{
    object-fit: cover !important;
    height: 250px !important;
}

.breadcrumb-mobile.breadcrumb{
    margin: 0px;
}

/**** page index mobile ***/
@media (max-width: 767px) {
    .collection.version-mobile .container .collection_hiver {
        height: 370px !important;
    }
}
@media (max-width: 767px) {
    section.collection.version-mobile {
        padding-bottom: 0px;
        padding-top: 40px;
    }
}
@media (max-width: 767px) {
    section.autonome .content-autonome .picture {
        margin-bottom: 15px;
        height: 100%;
    }
}
/**** fin page index mobile ***/
/**** page centre mobile ***/
.collection.mah-nouveaute.mah-Centre.version-mobile{
    margin-top : 0px;
}
@media (max-width: 500px) {
    section.collection.mah-nouveaute.version-mobile .desc_collection {
        padding: 0px;
    }
}

section.collection.mah-nouveaute.version-mobile .content-img-nouveaute img {
    margin-bottom: 30px;
}
/*** *****/
section.collection.mah-nouveaute.version-mobile-soin .content-img-collection {
    height: 100%;
}

@media (max-width: 767px) {
    .version-mobile-marque .cont-description {
        width: 100%;
        margin-top: 0px;
    }
}

@media (max-width: 767px) {
    .swal2-container.swal2-center.swal2-backdrop-show{
        top: -18%;
    }
    section.hamam .cont-description {
        padding-right: 0px;
        padding-left: 0px;
    }
}

@media (max-width: 767px) {
    section.hamam.mah-Centre.mah .cont-description {
        margin-top: 0px;
    }
}

@media (max-width: 767px) {
    section.hamam .cont-description {
        padding-right: 0px;
        padding-left: 0px;
    }
}

@media (max-width: 767px) {
    section.collection.mah-nouveaute.mah-Centre .desc_collection p {
        text-align: justify;
        padding: 0px 10px;
        margin: 0px;
    }
}

.bloc1-mobile{
    font-size: 19px !important;
}
.bloc1-mobile img{
    width: 100%;
}

.mobile-decouvrir{
    font-size: 15px;
    text-decoration: none;
    color: var(--Heading_color);
    text-transform: uppercase;
    display: inline-block;
    padding: 15px 15px 15px 0;
    letter-spacing: 0.02rem;
    background: transparent !important;
    background-position: center;
    animation: change 3s linear infinite;
    position: relative;
    font-family: "Century-Gothic-Std", "Century Gothic";
    background: transparent !important;
}
.mobile-decouvrir i.fa-solid.fa-arrow-right-long{
    margin-left: 10px;
}
.mobile-decouvrir:after{
    content: "";
    position: absolute;
    bottom: 13px;
    width: 113px;
    height: 1px;
    left: 0;
    right: inherit;
    top: inherit;
    background: black;
}
.mobile-cont-description {
    text-align: justify;
    padding: 10px 0px;
    margin: 0px;
    font-size: 15px;
    font-family: "Century-Gothic-Std", "Century Gothic";
    text-align: justify;
    line-height: 32px;
    font-weight: 400;
}

.mobile-cont-title {
    font-weight: 400;
    text-transform: uppercase;
    font-family: "Century-Gothic-Std", "Century Gothic";
    font-size: 25px;
    padding: 10px 10px;
    color: var(--Heading_color) !important;
}


/* mobile flesh */
.mobile-slick-prev, .mobile-slick-next {
    position: absolute;
    top: 110%;
    transform: translateY(-50%);
    width: 40px; /* Largeur de la flèche */
    height: 40px; /* Hauteur de la flèche */
    border: none;
    background: none;
    z-index: 3;
    cursor: pointer;
}

.mobile-esthetique-slick.mobile-slick-prev,.mobile-esthetique-slick.mobile-slick-next{
    top: 105%;
}

.mobile-slick-live.mobile-slick-prev,.mobile-slick-live.mobile-slick-next{
    top: 103%;
}

/* Positionnement */
.mobile-slick-prev { left: 35%; }
.mobile-slick-next { right: 35%; }

/* Ajout des flèches avec ::before */

.mobile-slick-prev::before, .mobile-slick-next::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
}

/* Image pour la flèche gauche */
.mobile-slick-prev::before {
    background-image: url(../images/btnleft.png); /* Remplace avec le chemin de ton image */
}

/* Image pour la flèche droite */
.mobile-slick-next::before {
    background-image: url(../images/btnright.png); /* Remplace avec le chemin de ton image */
}

@media (max-width: 768px){
    nav:not(.nav-breadcrumb){
        padding: 0px;
    }
    .header_logo_icons .header_icons {
        margin-top: 0px;
    }
    .bloc-3-collection {
        padding: 0px;
    }
    .bloc-3-collection.Centre-M .grid-wrapper-colletion img {
        width: 100% !important;
    }
    .tabsmahassen {
        gap: 0px;
    }
    .content-tabs .container div {
        padding: 0px 20px;
    }
    section.content-tabs {
        padding: 0px;
    }
    .header_logo_icons .header_icons {

        gap: 16px;

    }
    .menu_scrol{
        margin-bottom: 16px;
    }
    .content_networks{
        display: none !important;
    }
    .header_logo_icons {
        padding: 19px 0 19px;
    }
    .cont-description-categorie3 {
        width: 100%;
        padding-left: 0px;
        margin-left: 0px;
    }
    .icons.b2b.accuielb2b{
        margin-top: 0px !important;
    }
    .accuielb2b.cont-description{
        margin-top: 0px;
    }
    .accuielb2b.icons .item , .accuielb2b.icons .description-product-b2b, .accuielb2b.icons .description-product-b2b,.accuielb2b.icons .description-product-b2b {
        padding: 0px;
        margin-bottom: 0px;
    }
    section.brochure-homme.accuielb2b {
        margin-top: 50px;
    }
    .content-prob-commande input[type="text"], .content-prob-commande input[type=number], .content-prob-commande textarea, .content-prob-commande select {
        width: 100%;
    }

    .page-espace-client {
        padding: 50px 0 40px;
    }



}

p.cont-description-b2b {
    font-size: 15px;
    text-align: justify;
}

.spa-mobile{
    background: #f5f5f5;
    padding: 10px 0px;
}
.item-image-produit-gal {
    padding: 5px;
}
.item-image-produit-gal img{
    width: 100%;
}

@media (max-width: 768px){
    .select-product-detail {
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        grid-gap: 11px;
    }
    .shipping-cart{
        margin: 0px;
    }
    .shipping-cart-left {
        display: flex;
        gap: 20px;
        align-content: stretch;
        flex-wrap: wrap;
    }
    .image-shipping-left{
        width: 100%;
        margin: 0px;
    }
    .image-shipping-left img{
        width: 100%;
    }
}

.red-box-produit {
    position: absolute;
    top: 0;
    right: 0;
    width: 60px;
    height: 30px;
    border: 2px solid #e10202;
    background-color: #e10202;
    border-radius: 4px;
    margin: 15px;
    pointer-events: none;
    display: flex;
    justify-content: center;
    align-items: center;
    color: rgb(255, 255, 255);
    font-weight: bold;
    font-size: 16px;
}

.red-box-produit-parent {
    position: relative;
}





/* modal_youtube styles */
.modal_youtube {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0; top: 0;
    width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.8);
}

.modal_youtube-content {
    position: relative;
    margin: 5% auto;
    width: 80%;
    max-width: 80%;
    background-color: #000;
    padding: 20vh 20vh 60vh 20vh;
    overflow: hidden;
    border-radius: 8px;
}

.image_youtube {
    cursor: pointer;
}

.modal_youtube-content iframe {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: none;
}

.modal_youtube-content .close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
    font-weight: bold;
    z-index: 9999999999999999999999;

}
.item_youtube::after {
    position: absolute;
    content: "";
    width: 60px;
    height: 60px;
    top: 50%;
    right: 50%;
    transform: translate(50%, -50%);
    background-image: url(../images/playlive.png);
    cursor: pointer;
    pointer-events: none;
    /* animation: scale 1s linear infinite; */
    border-radius: 50%;
    background-size: contain;
}

.promotion_clignoter  {
   animation-duration: 1.2s;
   animation-name: clignoter;
   animation-iteration-count: infinite;
   transition: none;
  color:
}
@keyframes clignoter {
  0%   { color:#000000; }
  40%   {color:red; }
  100% { opacity:#000000; }
}