/* OSWALD FONTS */
@font-face {
    font-family: "oswald-light";
    src: url(../fonts/oswald/Oswald-Light.ttf);
}@font-face {
    font-family: "oswald-regular";
    src: url(../fonts/oswald/Oswald-Regular.ttf);
}@font-face {
    font-family: "oswald-medium";
    src: url(../fonts/oswald/Oswald-Medium.ttf);
}@font-face {
    font-family: "oswald-bold";
    src: url(../fonts/oswald/Oswald-Bold.ttf);
}

/* NEXA FONTS */
@font-face {
    font-family: "nexa-light";
    src: url(../fonts/Nexa/Nexa-Light.otf);
}@font-face {
    font-family: "nexa-regular";
    src: url(../fonts/Nexa/NexaRegular.otf);
}@font-face {
    font-family: "nexa-bold";
    src: url(../fonts/Nexa/Nexa-Bold.otf);
}@font-face {
    font-family: "nexa-black";
    src: url(../fonts/Nexa/NexaBlack.otf);
}

/* MONTREAL FONTS */
@font-face {
    font-family: "montreal-light";
    src: url(../fonts/Montreal/Montserrat-Light.otf);
}@font-face {
    font-family: "montreal-regular";
    src: url(../fonts/Montreal/Montserrat-Medium.otf);
}@font-face {
    font-family: "montreal-bold";
    src: url(../fonts/Montreal/Montserrat-Bold.otf);
}@font-face {
    font-family: "montreal-black";
    src: url(../fonts/Montreal/Montreal\ Black.otf);
}

/* MONTREAL FONTS */
@font-face {
    font-family: "myriad-pro-bold";
    src: url(../fonts/Myriad/Myriad\ Pro\ Bold.ttf);
}
/* OTHERS FONTS */
@font-face {
    font-family: "gymkhana-bk";
    src: url(../fonts/others/gymkhana-bk.ttf);
}

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

:root{
    --oswald-light: "oswald-light";
    --oswald-regular: "oswald-regular";
    --oswald-medium: "oswald-medium";
    --oswald-bold: "oswald-bold";
    --nexa-light: "nexa-light";
    --nexa-regular: "nexa-regular";
    --nexa-bold: "nexa-bold";
    --nexa-black: "nexa-black";
    --montreal-light: "montreal-light";
    --montreal-regular: "montreal-regular";
    --montreal-bold: "montreal-bold";
    --montreal-black: "montreal-black";
    --myriad-pro-bold: "myriad-pro-bold";
    --font-size: .9rem;
    --primary: #F0861C;
    --primary-dark: #CC7228;
    --white: #fff;
    --colorText: #68686d;
    --transition: all .4s ease-out;
    --green: #2e9188;
}

body{
    font-size: 16px;
    font-family: sans-serif;
    background: #f2f5fa;
}
.el-btn {
    text-decoration: none;
    border: none;
    outline: none;
    background: none;
    color: inherit;
    font-family: var(--montreal-light) !important;
}
.el-center-box{
    display: flex;
    justify-content: center;
    align-items: center;
}.el-content-area{
    width: 100%;
    margin: 0 auto;
}

#el-page{
    overflow: hidden;
    display: flex;
    flex-direction: column;
    /* background-color: #f2f5fa; */
    background-color: #f2f5fa;
}#el-page.el-bg-white {
    background-color: #fff;
}

#el-header-page{
    display: flex;
    flex-direction: column;
    width: 100%;
}#el-header-page.el-active {
    position: fixed;
    top: 0;
    left: 0;
    box-shadow: 0 8px 10px rgba(0,0,0,.5);
    width: 100%;
    z-index: 3;
}

#el-header-page #el-top{
    padding: 0 .5rem;
    background: var(--primary);
}
#el-header-page #el-top .el-content-area{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}#el-header-page #el-top .el-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 5px;
    width: 31px;
    height: 31px;
}#el-header-page #el-top img,
#el-header-page #el-middle button img{
    width: 15px;
}#el-header-page #el-top div{
    display: none;
    align-items: center;
    gap: .5rem;
}#el-header-page #el-top p{
    font-family: var(--nexa-bold);
    font-size: calc(var(--font-size) * .9);
    color: var(--white);
    display: none;
}#el-header-page #el-top div img{
    width: 22px;
}

#el-header-page #el-top form,
#el-header-page #el-middle form{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 25px;
    width: 50%;
}#el-header-page #el-middle form{
    display: none;
    height: 40px;
}#el-header-page #el-top form button,
#el-header-page #el-middle form button{
    outline: none;
    border: none;
    background-color: var(--white);
    padding: .25rem .5rem;
    display: block;
    height: 100%;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}#el-header-page #el-middle form button{
    background-color: var(--primary);
    padding: .5rem 1rem;
}#el-header-page #el-middle button img{
    width: 18px;
}#el-header-page #el-top form input,
#el-header-page #el-middle form input{
    outline: none;
    border: none;
    background-color: transparent;
    border: 1px solid var(--white);
    display: block;
    width: 100%;
    height: 100%;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    padding-left: .5rem;
    font-family: var(--nexa-light);
    font-size: var(--font-size);
    color: var(--white);
}#el-header-page #el-top form input::placeholder{
    color: var(--white);
    opacity: .5;
}#el-header-page #el-middle form input{
    border-color: var(--primary);
    color: #414142;
}

#el-header-page #el-top .el-account{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    text-decoration: none;
    color: var(--white);
    font-family: var(--nexa-bold);
    font-size: var(--font-size);
    text-transform: capitalize;
    padding: 1rem .5rem;
    background-color: #6e6f72;
}

#el-header-page #el-middle{
    background-color: var(--white);
    padding: .5rem;
}#el-header-page.el-active #el-middle{
    display: none;
}
#el-header-page #el-middle .el-content-area{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
#el-header-page #el-middle .el-logo img{
    height: 50px;
}

#el-header-page #el-middle .el-block{
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: .25rem;
    position: relative;
    width: 80px;
    text-decoration: none;
}#el-header-page #el-middle .el-block img{
    height: 20px;
}#el-header-page #el-middle .el-block span{
    font-family: var(--nexa-regular);
    font-size: calc(var(--font-size) * .8);
    text-transform: capitalize;
    text-align: center;
    color: var(--colorText);
}#el-header-page #el-middle .el-container-blocks{
    display: flex;
    align-items: center;
    gap: .25rem;
    width: fit-content;
    padding-top: .5rem;
}#el-header-page #el-middle .el-block .el-badge{
    position: absolute;
    /* top: -10px;
    right: 20px; */
    top: -24%;
    right: 28%;
    font-family: var(--montreal-light);
    font-size: calc(var(--font-size) * .6);
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--primary);
    color: var(--white);
    border-radius: 50%;
    width: 15px;
    height: 15px;
    padding-top: .15rem;
}
#el-header-page #el-bottom{
    background-color: var(--primary);
    padding: .5rem;
    position: relative;
}
#el-header-page #el-bottom .el-content-area{

    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}#el-header-page #el-bottom .el-btn{
    outline: none;
    border: none;
    background: transparent;
    text-transform: capitalize;
    display: flex;
    align-items: center;
    gap: .5rem;
    font-size: calc(var(--font-size) * 1.3);
    font-family: var(--montreal-regular);
    color: var(--white);
    cursor: pointer;
}#el-header-page #el-bottom .el-btn .svg-inline--fa{
    font-size: calc(var(--font-size) * 2.5);
}#el-header-page #el-bottom .el-link{
    text-decoration: none;
    text-transform: capitalize;
    font-size: calc(var(--font-size) * 1.5);
    font-family: var(--montreal-bold);
    color: var(--white);
    border: 1px solid var(--white);
    border-radius: 10px;
    padding: .5rem 2rem;
    margin-left: auto;
}
#el-sliders .owl-carousel{
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .3) !important;
}
#el-sliders .el-card{
    background-color: #6E6F72;
    position: relative;
    height: 375px;
    display: flex;
    align-items: flex-start;
    overflow: hidden;
}/* #el-sliders .el-card::before{
    background-color: #414142;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 82%;
    height: calc(50%);
} */
#el-sliders .el-card .el-content h1 span{
    color: var(--primary);
    font-size: calc(var(--font-size) * 2);
    text-transform: capitalize;
}.vertical-text {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
}h1.vertical-text{
    font-size: calc(var(--font-size) * 1.3);
    font-family: var(--montreal-bold);
    line-height: calc(var(--font-size) * 2.3);
    color: #DEDFE0;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: .5px;
    text-shadow: 0 0 20px rgba(0, 0, 0, .7);
}#el-sliders .el-card .el-container-grids{
    display: flex;
    flex-direction: column;
    width: 24%;
    padding: 0 1rem;
}#el-sliders .el-card .el-content{
    height: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem 0;
}#el-sliders .el-card .el-container-2{
    display: none;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    background-color: #414142;
}#el-sliders .el-container-2 ul{
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    width: 298px;
}#el-sliders .el-container-2 img{
    height: 22px;
}#el-sliders .el-container-2 .el-catalogue-link{
    background-color: var(--primary);
    padding: 1dvw 4dvw;
    border-radius: 5px;
    width: fit-content;
    text-decoration: none;
    text-transform: capitalize;
    font-family: var(--montreal-bold);
    font-size: calc(var(--font-size) * 1.3);
    color: var(--white);
}#el-sliders .el-container-2 p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: var(--white);
    line-height: 1.5rem;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}#el-sliders .el-card .el-box-img{
    position: relative;
    z-index: 1;
    width: calc(100% - 24% - 8dvw);
    aspect-ratio: 3.5/3.7;
}#el-sliders .el-card .el-box-img img{
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}#el-sliders .el-card .el-bg{
    background-color: #414142;
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 82dvw;
    height: 50%;
}#el-sliders .el-card .el-link{
    position: absolute;
    font-family: var(--montreal-black);
    font-size: calc(var(--font-size) * 1.5);
    color: var(--white);
    text-decoration: none;
    z-index: 2;
    bottom: -85px;
    left: -65px;
    text-transform: uppercase;
    padding: 8dvw 1.5dvw;
    background: rgba(240, 134, 28, .7);
    border: 1px solid var(--white);
    box-shadow: 0 0 10px rgba(0, 0, 0, .2);
    letter-spacing: 1px;
}#el-sliders .el-card .el-link span{
    text-transform: capitalize;
    font-size: calc(var(--font-size) * 1.4);
}/* #el-sliders .el-card .el-container{
    display: flex;
    align-items: flex-start;
} */
#el-sliders .owl-dots{
    display: flex;
    flex-direction: column;
    bottom: auto;
    top: 36%;
    right: 0;
    transform: translateY(-50%);
    width: fit-content;
    gap: 0;
}#el-sliders .owl-dot{
    width: 8dvw;
    height: 8dvw;
    background: var(--primary);
    display: flex;
    justify-content: center;
    align-items: center;
}#el-sliders .owl-dots span{
    background-color: rgba(255, 255, 255, .5);
}#el-sliders .owl-dots .active span{
    outline: none;
    background-color: rgba(255, 255, 255, 1);
}

.el-img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.el-offre{
    position: relative;
    aspect-ratio: 3 / 2.5;
    border: 2px solid rgba(240, 134, 28, .7);
    overflow: hidden;
    box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15);
}.el-offre::before{
    content: '';
    top: 0;
    left: -50%;
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(240, 134, 28, .7);
    z-index: 1;
    transform: skewX(-30deg);
}.el-offre label{
    position: absolute;
    font-family: var(--myriad-pro-bold);
    z-index: 2;
    color: var(--white);
    font-size: calc(var(--font-size) * 2.2);
    top: 5%;
    left: 5%;
    width: 180px;
    text-transform: capitalize;
    word-wrap: break-word;
    text-shadow: 0 0 3px rgba(0, 0, 0, .5);
}.el-offre .el-img{
    width: 100%;
}#el-nos-offres .el-content-area,
#el-nos-categories .el-content-area,
#el-nos-offres-desktop .el-content-area,
#el-nos-categories-desktop .el-content-area{
    padding: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* width: 100%; */
    gap: .5rem;
}#el-nos-offres .el-content-area,
#el-nos-offres-desktop .el-content-area{
    padding-bottom: 0 !important;
}#el-nos-categories-desktop,
#el-nos-offres-desktop{
    display: none;
}#el-nos-categories-desktop .el-grid-card,
#el-nos-offres-desktop .el-grid-card{
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    align-items: normal;
    gap: 1rem;
    width: 100%;
}#el-nos-offres .el-title,
#el-nos-offres-desktop .el-title,
#el-nos-categories .el-title,
#el-nos-categories-desktop .el-title,
#el-nos-forces .el-title{
    font-family: var(--montreal-regular);
    text-transform: uppercase;
    color: #6E6F72;
    text-align: center;
    font-weight: bold;
    position: relative;
    width: fit-content;
    font-size: calc(var(--font-size) * 1.5);
}#el-nos-offres .el-title::before,
#el-nos-offres .el-title::after,
#el-nos-offres-desktop .el-title::before,
#el-nos-offres-desktop .el-title::after,
#el-nos-categories .el-title::before,
#el-nos-categories .el-title::after,
#el-nos-categories-desktop .el-title::before,
#el-nos-categories-desktop .el-title::after,
#el-nos-forces .el-title::before,
#el-nos-forces .el-title::after{
    content: '';
    position: absolute;
    top: 42%;
    left: -40%;
    transform: translateY(-50%);
    width: 30%;
    height: 2px;
    border-radius: 2rem;
    background-color: #6E6F72;
}#el-nos-offres .el-title::after,
#el-nos-categories .el-title::after,
#el-nos-offres-desktop .el-title::after,
#el-nos-categories-desktop .el-title::after,
#el-nos-forces .el-title::after{
    left: auto;
    right: -40%;
    background-color: var(--primary);
}#el-nos-offres .el-title span,
#el-nos-categories .el-title span,
#el-nos-offres-desktop .el-title span,
#el-nos-categories-desktop .el-title span,
#el-nos-forces .el-title span{
    color: var(--primary);
}#el-nos-offres .owl-next,
#el-nos-offres .owl-prev{
    bottom: -10% !important;
    top: auto !important;
    color: var(--primary) !important;
    font-size: 3rem !important;
}#el-nos-offres .owl-prev{
    left: 85% !important;
}#el-nos-offres .owl-next{
    right: 3% !important;
}

#el-nos-categories .el-title::before,
#el-nos-categories .el-title::after,
#el-nos-categories-desktop .el-title::before,
#el-nos-categories-desktop .el-title::after{
    left: -35%;
}#el-nos-categories .el-title::after,
#el-nos-categories-desktop .el-title::after{
    left: auto;
    right: -35%;
}
#el-nos-categories .owl-next,
#el-nos-categories .owl-prev{
    color: var(--primary) !important;
    font-size: 3rem !important;
    top: auto;
    bottom: -75px;
}#el-nos-categories .owl-prev{
    left: 43% !important;
    color: #414142 !important;
}#el-nos-categories .owl-next{
    right: 43% !important;
}

#el-container-bg{
    /* padding-bottom: 2rem; */

}
#el-container-bg .el-content-area{
    background-image: url(../img/bg-abstract.png);
    background-size: contain;
    padding: 1rem 1rem 3rem;
}#el-container-bg .el-grid{
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
}#el-container-bg #el-nos-offres,
#el-container-bg #el-nos-offres-desktop{
    padding-bottom: 1rem;
}
#el-about .el-content-area{
    background-color: #BBBCC0;
    padding: 1rem;
    position: relative;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .15) !important;
}#el-about .el-content-area::before,
#el-about .el-content-area::after{
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50%;
    height: 15%;
    background: var(--primary);
}#el-about .el-content-area::after{
    bottom: auto;
    top: 0;
    left: auto;
    right: 0;
}
#el-about .el-grid{
    background-color: #E6E6E7;
    background-image: url(../img/bg-abstract.png);
    background-size: contain;
    padding: 1rem;
    display: flex;
    flex-direction: column-reverse;
    gap: 1rem;
    position: relative;
    z-index: 1;
    box-shadow: 0 0 20px rgba(0, 0, 0, .2);
}#el-about .el-card-one{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}#el-about .el-card-one h2{
    font-family: var(--montreal-black);
    font-size: calc(var(--font-size) * 2.5);
    text-transform: uppercase;
    color: var(--primary);
}#el-about .el-card-one h2 span{
    color: #414142;
}#el-about .el-card-one p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    line-height: calc(var(--font-size) * 2);
    color: #232020;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    overflow: hidden;
}#el-about .el-card-one a{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: var(--white);
    width: fit-content;
    padding: .5rem 3rem;
    text-decoration: none;
    background-color: var(--primary);
    text-transform: capitalize;
    border-radius: 2rem;
    align-self: flex-end;
}.el-card-two{
    position: relative;
    min-width: 50%;
}.el-card-two::before{
    content: '';
    position: absolute;
    top: 5px;
    left: 6%;
    width: 48%;
    height: 40%;
    background-color: #FAAE3F;
}.el-card-two::after{
    content: '';
    position: absolute;
    bottom: 0;
    right: 19%;
    width: 12%;
    height: 28%;
    background-color: #FAAE3F;
    z-index: 2;
    display: none;
}.el-card-two img{
    width: 100%;
    position: relative;
    z-index: 1;
}
#el-nos-forces{
    padding: 1rem;
}
#el-nos-forces .el-grid{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}.el-force{
    background-color: var(--primary);
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem;
    align-items: flex-start;
    border-radius: 3.5rem 0 3.5rem 3.5rem;
    box-shadow: 0 0.09em 0.2em rgba(0,0,0,0.2);
    margin-bottom: 1rem;
}.el-force img{
    width: 40px !important;
}.el-force h2{
    font-family: var(--montreal-bold);
    font-size: calc(var(--font-size) * .8);
    color: var(--white);
    letter-spacing: 1px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}.el-force p{
    font-family: var(--montreal-light);
    font-size: calc(var(--font-size) * .6);
    color: var(--white);
    letter-spacing: 1px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: calc(var(--font-size) * 1.5);
}

#el-contact .el-content-area{
    padding: 0;
    position: relative;
    height: 900px;
}#el-contact .el-bg-image{
    width: 100%;
    height: 50%;
    position: absolute;
    top: 0;
    left: 0;
 }#el-contact .el-bg-image::before{
    width: 100%;
    height: 100%;
    position: absolute;
    content: '';
    background-color: rgba(0,0,0,.88);
    z-index: 1;
}#el-contact .el-carte{
    overflow: hidden;
    position: absolute;
    /* height: 50%; */
    height: 900px;
    width: 100%;
    bottom: 0;
    left: 0;
}.el-carte iframe{
    left: 0;
    top: 0;
    /* max-height: 100%; */
    height: 100%;
    width: 100%;
    position: absolute;
}
#el-contact .el-grid-content{
    background-color: #fff;
    padding: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 2rem;
    -webkit-box-shadow: 0 3px 8px 0 #000;
            box-shadow: 0 3px 8px 0 #000;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    z-index: 2;
}
.el-coordonnees{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 1rem;
}.el-coordonnees li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
     gap: 1rem;
}.el-coordonnees li:nth-child(4){
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}.el-coordonnees .el-icon{
    border: 2px solid #5e5d5d;
    border-radius: 50%;
    width: 37px;
    height: 37px;
    min-width: 37px;
    min-height: 37px;
}.el-coordonnees .svg-inline--fa{
    color:  #5e5d5d;
}.el-coordonnees p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}.el-coordonnees p a{
    font-family: var(--montreal-light);
    display: block;
    color: inherit;
    text-decoration: none;
    line-height: calc(var(--font-size) * 2);
}
.el-form-contact{
    background-color: #fff;
}.el-form-contact form{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem;
}.el-form-contact form h2{
    position: relative;
    text-transform: uppercase;
    color: #414142;
    font-family: var(--montreal-bold);
    font-size: calc(var(--font-size) * 1.3);
}.el-form-contact form h2::before{
    content: '';
    position: absolute;
    bottom: -5px;
    background-color: var(--accent);
    width: 10%;
    height: 1px;
}.el-form-contact .el-ligne{
    position: relative;
    width: 100%;
    height: 48px;
}.el-form-contact .el-ligne.el-textarea{
    min-height: 70px;
}.el-form-contact input,
.el-form-contact textarea{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    display: block;
    padding: 1rem;
    outline: none;
    border: none;
    border-bottom: 1px solid #8f8f8f;
    color: #929495;
    font-size: var(--font-size);
    font-family: var(--montreal-light);
}.el-form-contact .el-btn{
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    background-color: #414142;
    text-transform: uppercase;
    font-family: var(--font-text);
    font-weight: 400;
    padding: 0.5em 3em!important;
    color: #fff;
    outline: none;
    border: none;
    border-radius: 5px;
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    cursor: pointer;
}
#el-newsletter{
    background-image: url(../img/newsletter.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    position: relative;
    padding: 1rem;
}#el-newsletter::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,.8);
}
#el-newsletter h2{
    font-family: var(--montreal-bold);
    font-size: calc(var(--font-size) * 1.5);
    color: var(--white);
    text-transform: uppercase;
}#el-newsletter p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: var(--white);
    line-height: calc(var(--font-size) * 2);
    text-align: center;
}#el-newsletter .el-grid{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    max-width: 1000px;
    margin: auto;
    position: relative;
    z-index: 1;
}#el-newsletter .el-grid div{
    position: relative;
    width: 100%;
    border: 1px solid var(--white);
    border-radius: 5px;
    height: 40px;
}#el-newsletter .el-grid input{
    display: block;
    height: 100%;
    width: 85%;
    position: absolute;
    top: 0;
    left: 0;
    background: transparent;
    outline: none;
    border: none;
    color: var(--white);
    padding: 0 1rem;
    font-family: var(--montreal-light);
    font-size: var(--font-size);
}#el-newsletter .el-grid button{
    display: block;
    height: 100%;
    width: 15%;
    background: transparent;
    position: absolute;
    top: 0;
    right: 0;
    outline: none;
    border: none;
    color: var(--primary);
    cursor: pointer;
    font-size: calc(var(--font-size) * 1.1);
}

footer{
    padding: 1rem;
    background-color: #222222;
    overflow: hidden;
}footer .el-content-area{
    display: flex;
    flex-direction: column;
    gap: calc(var(--font-size) * 1.5);
}footer .el-top .el-block{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
}footer .el-top .el-block img{
    height: 50px;
}footer .el-top .el-block p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: rgba(255, 255, 255, .5);
    line-height: calc(var(--font-size) * 2);

}footer .el-bottom{
    /* background-color: #272727; */
    display: flex;
    flex-direction: column;
    gap: calc(var(--font-size) * 1.5);
    align-items: center;
    margin-top: 2rem;
}footer .el-block h2{
    font-family: var(--montreal-bold);
    font-size: var(--font-size);
    color: var(--white);
}footer .el-top .el-block ul,
footer .el-bottom ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: .5rem;
}footer .el-top .el-block ul{
    width: 100%;
}footer .el-top .el-block a{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: rgba(255, 255, 255, .5);
    line-height: calc(var(--font-size) * 2);
    text-transform: capitalize;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: .5rem;
    transition: var(--transition);
    width: fit-content;
}footer .el-top .el-block.el-two a{
    font-family: var(--nexa-light);
}footer .el-top .el-block a:hover{
    color: var(--primary);
    gap: 0;
}footer .el-top .el-block .svg-inline--fa{
    font-size: calc(var(--font-size) * .8);
}footer .el-top{
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 2rem;
}footer .el-bottom a{
    width: calc(var(--font-size) * 2.1);
    height: calc(var(--font-size) * 2.1);
    border-radius: 50%;
    border: 1px solid var(--white);
    color: var(--white);
    transition: var(--transition);
    font-size: var(--font-size);
}footer .el-bottom ul{
    flex-direction: row;
    align-items: center;
}footer .el-bottom a:hover{
    color: var(--primary);
    border-color: var(--primary);
}footer .el-bottom p{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    color: var(--white);
}


#el-menu-desktop{
    display: none;
    position: relative;
    width: 100%;
}#el-menu-desktop #el-menu-desktop-level-1{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    list-style: none;
    gap: .5rem;
    justify-content: space-between;
}#el-menu-desktop-level-1 a:not(#el-menu-desktop-level-2 a){
    font-family: var(--montreal-bold) !important;
    font-size: calc(var(--font-size) * .8);
    font-weight: 500;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    padding: .5rem;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
}#el-menu-desktop-level-1 a:hover:not(#el-menu-desktop-level-2 a){
    color: var(--primary);
    background: #fff;
}#el-menu-desktop-level-1 li:hover #el-menu-desktop-level-2{
    display: -ms-grid;
    display: grid;
}#el-menu-desktop-level-1 li #el-menu-desktop-level-2{
    list-style: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    background: #fff;
    z-index: 2;
    grid-template-columns: repeat(auto-fit, minmax(180px, 200px));
    grid-gap: 2rem;
    padding: 2rem;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: none;
    -webkit-box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.3);
            box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.3);
}#el-menu-desktop-level-2 img{
    width: 100%;
}#el-menu-desktop-level-2 a{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 100%;
    height: 100%;
    gap: .5rem;
    color: var(--primary);
    font-family: var(--nexa-bold) !important;
    font-size: calc(var(--font-size) * .8);
    font-weight: 500;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
}#el-menu-desktop-level-2 a:hover{
    color: var(--primary);
}

#el-whatsapp-container{
    display: flex;
    align-items: center;
    gap: 1rem;
    position: fixed;
    width: fit-content;
    right: 5px;
    bottom: 10px;
    z-index: 4;
}#el-whatsapp-container button{
    background-color: rgb(45, 183, 66);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    outline: none;
    border: none;
    cursor: pointer;
    padding: .25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 6px 8px 2px rgba(0,0,0,.14);
}#el-whatsapp-container button svg{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}#el-whatsapp-container .el-info{
    background: rgb(245 247 249);
    font-family: sans-serif;
    font-size: 12px;
    width: 150px;
    border-radius: 5px;
    color: #43474e;
    padding: 8px 12px;
    line-height: 1rem;
    transition: .3s ease-in-out;
}#el-whatsapp-container #el-plus-icon{
    width: 30px;
    opacity: 0;
    transition: .3s ease-in-out;
}
#el-whatsapp-container #el-whatsapp-icon{
    transition: .3s ease-in-out;
    width: 40px;
}#el-whatsapp-container #el-popup-whatsapp{
    width: 351px;
    position: absolute;
    right: 0;
    bottom: 100%;
    box-shadow: 0 10px 10px 4px rgba(0,0,0,.04);
    border-radius: 8px;
    overflow: hidden;
    transform: translateY(40px);
    opacity: 0;
    transition: .3s ease-in-out;
    visibility: hidden;
    pointer-events: none;
 }#el-whatsapp-container .el-popup-header{
    background-color: rgb(45, 183, 66);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1rem 2rem;
    font-family: sans-serif;
    gap: 1rem;
}#el-whatsapp-container .el-popup-header h2{
    font-size: 20px;
}#el-whatsapp-container .el-popup-header p{
    font-size: 12px;
}#el-whatsapp-container .el-el-popup-content{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1rem;
    background: #fff;
}#el-whatsapp-container .el-el-popup-content .el-info{
    width: 100%;
    background: none;
    color: #a5abb7;
}#el-whatsapp-container .el-user-info a{
    text-decoration: none;
    padding: .5rem;
    display: flex;
    align-items: center;
    width: 100%;
    border-left: 2px solid #2db742;
    background: #f5f7f9;
    border-radius: 2px 4px;
    gap: 1rem;
    font-family: sans-serif;
    font-size: 14px;
    color: #363c47;
    line-height: 1.188em;
    transition: .3s ease-in-out;
}#el-whatsapp-container .el-user-info a:hover{
    background: transparent;
    box-shadow: 0 8px 10px rgba(0,0,0,.04);
}#el-whatsapp-container .el-user-info .el-icon{
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: hidden;
}#el-whatsapp-container .el-user-info img{
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* #el-nos-offres .owl-next span{
    width: 0;
    height: 0;
    border-left: 1rem solid transparent;
    border-right: 1rem solid transparent;
    border-bottom: 2rem solid red;
    display: inline-block;
} */

#el-banner img{
    width: 100%;
}#el-path ul {
    list-style: none;
    display: flex;
    align-items: center;
    gap: 1rem;
    color: var(--colorTitle);
    font-family: var(--montreal-light) !important;
    font-weight: 300;
    text-transform: uppercase;
    font-size: calc(var(--font-size)* .9);
    flex-wrap: wrap;
}#el-path a {
    text-decoration: none;
    color: inherit;
}#el-path .el-content-area,
#el-subcategories .el-content-area,
#el-about-categorie .el-content-area,
#el-filter-article .el-content-area,
#el-articles .el-content-area{
    padding: 1rem;
}.el-grid-subcategories {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1rem;
}.el-subcategorie {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
    box-shadow: 0 0.02rem 0.04rem rgba(0,0,0,0.1), 0 0.07rem 0.2rem rgba(0,0,0,0.15);
    border: 1px solid #8282823b;
    padding: 1rem;
    border-radius: 10px;
}.el-subcategorie .el-boxImg {
    width: 35%;
    position: relative;
}.el-subcategorie .el-boxImg::after {
    content: '';
    position: absolute;
    background-color: #6E6F72;
    width: 1px;
    height: 30%;
    bottom: 34%;
    right: 0px;
}.el-subcategorie img {
    width: 100%;
}.el-subcategorie .el-name-subcategorie {
    font-family: var(--nexa-bold) !important;
    font-size: calc(var(--font-size)* 1.1);
    text-transform: uppercase;
    color: #1a1a1a;
    transition: var(--transition);
    width: 100%;
}#el-about-categorie .el-title-categorie,
#el-filter-article h2 {
    font-family: var(--nexa-black) !important;
    font-weight: 800;
    font-size: calc(var(--font-size) * 1.5);
    text-transform: uppercase;
    color: var(--primary);
    /*margin-bottom: 1rem;*/
}.el-description-categorie{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}.el-description-categorie *,
.el-info-article .ui-widget-content ul {
    font-family: var(--montreal-light) !important;
    color: #5e5d5d;
    font-weight: 300;
    line-height: calc(var(--font-size) * 2);
    font-size: var(--font-size);
}.el-description-categorie ul,
.el-info-article .ui-widget-content ul {
    padding: 0 2rem;
}.el-grid-filter-article {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #e0e3e8;
    padding-bottom: 1rem;
}#el-filter-article .el-ligne {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    align-items: center;
    gap: 1rem;
}#el-filter-article .el-col {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
}#el-filter-article label {
    color: #1a1a1a;
    font-family: var(--nexa-black);
    font-size: var(--font-size);
    text-transform: uppercase;
    font-weight: 800;
    display: none;
}#el-filter-article .el-col .ts-control {
    height: 50px;
    box-shadow: 0px 0px 0px 1px #adadad inset;
    color: #656565;
    background: #f4f4f4;
    font-size: 1rem;
    font-family: var(--nexa-bold);
}#el-filter-article .el-col .ts-control input {
    text-transform: uppercase;
    font-family: var(--nexa-bold) !important;
}#el-articles .el-content-area {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}#el-articles .el-grid-articles {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    grid-gap: 1rem;
    justify-content: center;
}.el-article{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.3rem;
    border: 1px solid #8282823b;
    padding: .5rem;
    border-radius: 10px;
    box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15);
    max-width: 343.333px;
    min-width: 300px;
}.el-article a{
    text-decoration: none;
}.el-article .el-boxImg{
    overflow: hidden;
    border-radius: 10px;
    /* box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15); */
    border: 1px solid #8282823b;
    background: #fff;
}.el-article .el-name-article{
    font-size: calc(var(--font-size)* 1.3);
    font-family: var(--nexa-bold) !important;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #5f5f5f;
}.el-article .el-ref-article{
    font-family: var(--nexa-bold) !important;
    font-size: var(--font-size);
    color: var(--primary);
}.el-article .el-content{
    width: 100%;
}.el-article [class^='el-content-']{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}.el-article .el-controls-article{
    margin-top: .5rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}.el-article .el-controls-article a{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #8282823b;
    /* box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15); */
    color: var(--primary);
}.el-article .el-controls-article .svg-inline--fa{
    font-size: 20.5px;
}.el-article .owl-prev,
.el-article .owl-next{
    top: 50% !important;
    transform: translateY(-50%);
    position: absolute;
    left: -40px !important;
    color: #fff !important;
    width: 40px;
    height: 40px;
    background: var(--primary) !important;
    border-radius: 50%;
    transition: .3s ease-in;
    box-shadow: 0 0 10px rgba(0,0,0,0.15);
}.el-article .owl-next{
    left: auto !important;
    right: -40px !important;
}.el-article .owl-prev span,
.el-article .owl-next span{
    font-size: 27px;
    display: block;
    margin-bottom: .25rem;
}.el-article:hover .owl-prev{
    left: 3% !important;
}.el-article:hover .owl-next{
    right: 3% !important;
}.el-article form{
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.el-grid-favoris form, .el-grids-identification form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}
.el-grids-identification form .el-btn{
    background: var(--primary);
    color: #fff;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 1rem 2rem;
    text-transform: uppercase;
    font-family: var(--montreal-light);
    font-weight: 600;
    cursor: pointer;
}.el-grids-identification article{
     -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.15);
     box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.15);
     background: #fff;
     padding: 2rem;
     width: 100%;
 }.el-grids-identification{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: 1rem;
  }.el-grids-identification legend{
       font-family: var(--nexa-black) !important;
       font-size: 2rem;
       font-weight: 600;
       letter-spacing: -0.03em;
   }
.el-grid-favoris .el-row,
.el-grids-identification .el-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}
.el-grid-favoris .el-col,
.el-grids-identification .el-col {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    gap: .5rem;
    width: 100%;
}
.el-grid-favoris input:not(td input),
.el-grid-favoris textarea,
.el-grids-identification input:not(td input),
.el-grids-identification textarea {
    outline: none;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 35px;
    resize: none;
    display: block;
    font-size: 1rem;
    font-weight: 300;
    background: #f4f4f4;
    color: #656565;
    -webkit-box-shadow: 0px 0px 0px 1px #adadad inset;
    box-shadow: 0px 0px 0px 1px #adadad inset;
    font-family: var(--font-text) !important;
    font-size: var(--font-size-text);
    font-weight: 300;
    padding: 0 1rem;
}
.el-grid-favoris form label,
.el-grids-identification form label {
    font-family: var(--montreal-bold) !important;
    font-size: var(--font-size);
    font-weight: 600;
}
.el-grid-catalogs {
    display: -ms-grid;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(327px, 551px));
    grid-template-columns: repeat(auto-fit, minmax(426px, 1fr));
    grid-gap: 1rem;
}
.el-grid-catalogs a {
    position: relative;
    width: 100%;
    display: block;
    -webkit-box-shadow: 0 0.10rem 0.20rem rgba(0,0,0,0.1),0 0.33rem 1.00rem rgba(0,0,0,0.1);
    box-shadow: 0 0.10rem 0.20rem rgba(0,0,0,0.1),0 0.33rem 1.00rem rgba(0,0,0,0.1);
}.el-grid-catalogs img {
     width: 100%;
}
.dataTables_wrapper{
    width: 100%;
    font-family: var(--montreal-light);
}
#table_id_filter{
    margin-bottom: 1rem;
}
th{
    font-weight: 300 !important;
    background: var(--white) !important;
    color: var(--colorTitle);
    font-family: var(--montreal-bold) !important;
    font-size: var(--font-size);
}tbody tr td:nth-child(1),
 thead tr th:nth-child(1){
     border-right: 1px solid #979797;
 }.even{
      background: rgba(69, 127, 132, .1) !important;
  }.odd{
       background: rgba(69, 127, 132, .3) !important;
   }tbody{
        font-size: .9rem;
    }

td img{
    max-width: 100px;
    width: 100%;
}td h4 a{
     text-decoration: none;
     color: var(--primary);
     font-family: var(--montreal-light) !important;
     font-weight: 400;
     font-size: var(--font-size);
 }td ul{
      list-style: none;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      -ms-flex-direction: column;
      flex-direction: column;
      gap: .25rem;
  }td li{
       font-family: var(--montreal-light) !important;
       font-weight: 300;
       font-size: 13px;
       text-transform: capitalize;
   }td p{
        font-family: var(--montreal-light) !important;
        font-weight: 400;
        font-size: var(--font-size);
    }td .el-btn{
         width: 30px;
         height: 30px;
         border-radius: 5px;
         color: #fff;
         -webkit-box-shadow: 0 0.02rem 0.04rem rgba(0,0,0,0.1),0 0.07rem 0.2rem rgba(0,0,0,0.15);
         box-shadow: 0 0.02rem 0.04rem rgba(0,0,0,0.1),0 0.07rem 0.2rem rgba(0,0,0,0.15);
     }tr .el-controls,
      td .dtr-data{
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
          -ms-flex-align: center;
          align-items: center;
          gap: 1rem;
      }td .el-btn.el-info{
           background-color: var(--primary) !important;
           color: #fff;
       }td .el-btn.el-danger{
            background-color: #d03e3e !important;
            color: #fff;
        }tr .el-btn .svg-inline--fa{
             margin: 0;
         }#table_id td {
              vertical-align: middle;
              display: table-cell;
          }
.el-container-back-and-share{
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .5rem;
}
.el-container-back-and-share .el-back{
    font-family: var(--montreal-light) !important;
    font-weight: 300;
    font-size: var(--font-size);
    color: var(--primary);
    text-decoration: none;
}.el-container-back-and-share .el-container-share{
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 1rem;
     font-size: var(--font-size);
     font-family: var(--nexa-black) !important;
 }.el-container-back-and-share ul{
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      gap: 1rem;
      list-style: none;
  }.el-container-back-and-share ul a{
       font-size: calc(var(--font-size) * 1.1);
       color: var(--primary);
       text-decoration: none;
   }.el-grid-favoris .el-download-catalog{
        text-decoration: none;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        background: var(--primary);
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 1rem;
        font-size: var(--font-size);
        font-family: var(--montreal-regular) !important;
        color: #fff;
        font-weight: 400;
        padding: .5rem 1rem;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }.el-grid-favoris .el-btn{
         width: -webkit-fit-content;
         width: -moz-fit-content;
         width: fit-content;
         font-size: var(--font-size);
         font-family: var(--montreal-light) !important;
         font-weight: 400;
         color: var(--primary);
         padding: .3rem 1.5rem;
         background-color: #fff;
         border-radius: 5px;
         text-transform: uppercase;
         font-weight: 500;
         -webkit-box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
         box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
         cursor: pointer;
     }.el-grid-favoris .el-list-controls{
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
          -ms-flex-direction: column;
          flex-direction: column;
          gap: .5rem;
      }.el-grid-favoris{
           display: -webkit-box;
           display: -ms-flexbox;
           display: flex;
           -webkit-box-orient: vertical;
           -webkit-box-direction: normal;
           -ms-flex-direction: column;
           flex-direction: column;
           gap: 1rem;
       }
#el-details-article .el-name-article {
    color: var(--primary);
    font-family: var(--nexa-bold);
    font-size: 40px;
    font-weight: bold;
}
#el-details-article .el-ref-article {
    color: var(--primary);
    font-family: var(--nexa-bold);
    font-size: 25px;
    font-weight: 500;
    color: var(--green);
}
#el-details-article .el-container,
.el-info-article {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}
.el-single-product {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .5rem;
    width: 100%;
    max-width: 654.5px;
}
.el-big-picture {
    max-width: 100%;
    border: 1px solid var(--primary);
    width: 100%;
}
.el-nav-picture {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: .5rem;
    width: 200px;
}.el-nav-picture .owl-item {
     border: 2px solid #E4E7ED !important;
     border-color: transparent;
     width: 100px;
     cursor: pointer;
    border-radius: 10px;
    overflow: hidden;
 }.el-nav-picture .owl-item {
      cursor: pointer;
}.el-nav-picture img.el-active,
 .el-nav-picture img:hover{
     border-color: var(--primary) !important;
}
.el-nav-picture .owl-next{
    right: -18%!important;
}.el-nav-picture .owl-prev{
     left: -18%!important;
 }
#el-details-article .owl-prev,
#el-details-article .owl-next {
    font-size: calc( 1 * var(--font-size)) !important;
    font-weight: bolder !important;
}
.el-nav-picture .owl-prev {
    left: -18% !important;
}
.el-nav-picture .owl-next {
    right: -18% !important;
}

.el-info-article .el-btn:not(:last-of-type) {
    margin-bottom: .5rem;
    background-color: var(--primary);
}
.el-info-article .el-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    padding: .7rem 1rem;
    color: #fff;
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    text-align: center;
    background-color: var(--green);
}
.el-info-article .ui-state-default {
    background-color: var(--primary);
    color: #fff;
    font-family: var(--montreal-light);
    font-weight: 800;
}
.el-info-article .ui-state-active {
    border-color: var(--accent);
}
.el-info-article .ui-widget-content {
    border-color: var(--primary);
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem;
}.el-info-article h2 {
     color: var(--primary);
     font-family: var(--nexa-black) !important;
     font-weight: 800;
     font-size: calc(var(--font-size) * 1.3);
}.el-info-article p {
     color: #68686d;
     font-family: var(--montreal-light) !important;
     font-weight: 300;
     font-size: var(--font-size);
     line-height: 2rem;
 }
.el-info-article .el-disponibility,
.el-article .el-disponibility {
    color: var(--green);
    font-family: var(--nexa-light), sans-serif !important;
    font-size: var(--font-size);
}.el-info-article input[type="number"] {
     display: block;
     height: 40px;
     height: 28px;
     width: 100%;
     padding: 0 1rem;
 }
.el-article .el-content [id*="el-content-"] {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
}
#el-articles .el-paginator {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
}#el-articles .el-paginator .flex.justify-between.flex-1.sm\:hidden {
     display: none;
}#el-articles .el-paginator .hidden.sm\:flex-1.sm\:flex.sm\:items-center.sm\:justify-between {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     gap: 1rem;
}#el-articles .el-paginator .relative.z-0.inline-flex.shadow-sm.rounded-md {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 1rem;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
 }#el-articles .el-paginator a {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      align-items: center;
      width: 47px;
      height: 47px;
      font-size: 1rem;
      line-height: 1.20;
      font-weight: 700;
      font-family: var(--font-nexa-light);
      text-transform: uppercase;
      letter-spacing: 0em;
      border-radius: 0em;
      padding: .55rem;
      background: #ffffff;
      color: #434343;
      text-decoration: none;
      -webkit-box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
      box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
      -webkit-transition: var(--transition);
      -o-transition: var(--transition);
      transition: var(--transition);
  }#el-articles .el-paginator a:hover{
       font-family: var(--nexa-light),sans-serif;
       background: var(--primary);
       color: #fff;
       -webkit-box-shadow: none;
       box-shadow: none;
   }
.el-article .el-content [id*="el-content-"] form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
}.el-article form .el-btn {
     padding: .5rem 1.5rem;
     background-color: var(--primary);
     border-radius: 5px;
     text-transform: uppercase;
     font-weight: 600;
     -webkit-box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
     box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.2);
     color: #fff;
 }.el-article form input {
      height: 30px;
      width: 100%;
}

#el-container-menu-phone {
    position: absolute;
    width: calc(100% - 1rem);
    background: var(--primary-dark);
    top: calc(100% + .7rem);
    z-index: 9;
    overflow-y: auto;
    max-height: calc(100vh - 100px);
    display: none;
}#el-container-menu-phone.el-active {
     display: block;
}
#el-container-menu-phone .accordion-header {
    position: relative;
    background-color: var(--primary);
    color: #fff;
    cursor: pointer;
    padding: 1rem;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: var(--font-size);
    -webkit-transition: 0.4s;
    -o-transition: 0.4s;
    transition: 0.4s;
    font-family: var(--montreal-light);
    text-transform: uppercase;
}#el-container-menu-phone .accordion-header:hover{
    background: #1a1a1a;
 }
#el-container-menu-phone .accordion-header .svg-inline--fa {
    position: absolute;
    top: 50%;
    right: 16px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
#el-container-menu-phone .accordion-header a {
    text-decoration: none;
    color: #fff;
    width: 80%;
    text-transform: uppercase;
    display: block;
}
#el-container-menu-phone .accordion-content {
    padding: 0 18px;
    background-color: inherit;
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-out;
    -o-transition: max-height 0.2s ease-out;
    transition: max-height 0.2s ease-out;
}
#el-container-menu-phone .accordion-content ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    list-style: none;
}

#el-container-menu-phone .accordion-content a {
    padding: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
}#el-container-menu-phone .accordion-content img {
     width: 80%;
 }
#el-container-menu-phone .accordion-content p {
    color: #fff;
    text-transform: uppercase;
    font-family: var(--montreal-light);
    font-size: var(--font-size);
}
#el-bottom .el-icon-home {
    width: 40px;
    height: 40px;
    background: #fff;
    color: var(--primary);
    -webkit-transition: var(--transition);
    -o-transition: var(--transition);
    transition: var(--transition);
    border-radius: 4px;
    display: none;
}
#el-sliders .el-card .el-content .el-promo{
    color: var(--primary);
    font-family: var(--montreal-bold);
    font-size: calc(var(--font-size) * 1.3);
    text-transform: capitalize;
    width: 1000%;
    margin: 1rem 0;
    display: none;
}
#el-about-details .el-content-area{
    padding: 1rem;
}#el-about-details .el-grid-about{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}#el-about-details .el-paragraph{
    font-family: var(--montreal-light);
    font-size: var(--font-size);
    line-height: calc(var(--font-size) * 2);
    color: #5e5d5d;
}#el-about-details .el-paragraph em,
#el-about-details .el-paragraph strong{
    font-style: normal;
    text-transform: uppercase;
    font-size: calc(var(--font-size) * 1.2);
    color: var(--primary);
    font-weight: bold;
    font-family: var(--montreal-regular);
}#el-about-details .el-paragraph strong{
    color: inherit;
    font-size: inherit;
    text-transform: none;
}

#el-container-detail-article{
    width: calc(100% - 2rem);
    max-width: 800px;
    height: 400px;
    box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15);
    border-radius: 10px;
    overflow: scroll;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 1);
}.el-grid-details-article{
    display: flex;
    flex-direction: column;
    gap: 2rem;
    padding: 1rem;
}.el-big-picture/*,
  .el-nav-picture*/{
    max-width: 100%;
    width: 100%;
    border: 1px solid #E4E7ED ;
    border-radius: 10px;
    overflow: hidden;
}/*.el-nav-picture{
    display: flex;
    align-items: center;
    gap: .5rem;
    width: 190px;
}.el-nav-picture .owl-item {
    cursor: pointer;
    border: 1px solid #E4E7ED !important;
    border-radius: 10px;
    overflow: hidden;
}.el-nav-picture img{
    width: 100%;
}*/
.el-info-article h2 {
    color: var(--primary);
    font-family: var(--nexa-black) !important;
    font-weight: 800;
    font-size: calc(var(--font-size) * 1.3);
}.el-info-article p {
    color: #68686d;
    font-family: var(--montreal-light) !important;
    font-weight: 300;
    font-size: var(--font-size);
    line-height: 2rem;
}.el-info-article ul,
.el-info-article ol{
    padding: 0 2rem;
    font-family: var(--montreal-light) !important;
    color: #5e5d5d;
    font-weight: 300;
    line-height: calc(var(--font-size) * 2);
    font-size: var(--font-size);
}

#el-single-article{
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}.el-nav-picture .owl-prev,
.el-nav-picture .owl-next{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -10px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 20px;
    height: 20px;
    background: #f0861c !important;
    border-radius: 50%;
}.el-nav-picture .owl-next{
    left: auto;
    right: -10px;
}.el-nav-picture button span{
    margin-bottom: 2.5px;
    color: #fff;
}#el-info-article .el-name-article{
    font-family: var(--nexa-bold);
    font-size: 1.5rem;
    color: #f0861c;
}#el-info-article .el-reference{
    color: #68686d;
    font-size: 1rem;
}#el-info-article{
    display: flex;
    flex-direction: column;
    gap: .5rem;
}#el-info-article .el-description{
/* margin-top: 1rem; */
    display: flex;
    flex-direction: column;
    gap: .5rem;
    color: #68686d;
}#el-info-article .el-description *{
    font-family: var(--nexa-light);
    color: inherit;
    font-size: var(--font-size);
    line-height: 1.5rem;
}#el-info-article .el-description h2{
    color: #f0861c;
    font-size: calc(var(--font-size) * 1.3);
    font-family: var(--nexa-bold);
}#el-info-article .el-btns a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    box-shadow: 0 0.1rem 0.2rem rgba(0,0,0,0.1), 0 0.33rem 1rem rgba(0,0,0,0.15);
    border-radius: 50%;
    color: #f0861c;
}#el-info-article .el-btns{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
}#el-info-article .el-btns .el-control-btn{
    display: flex;
    align-items: center;
    gap: 1rem;
   font-family: var(--nexa-bold);
    color: #68686d;
    font-size: var(--font-size);
}#el-info-article .el-controls{
    display: flex;
    flex-direction: column;
    gap: .5rem;
    /*border: 1px solid #E4E7ED !important;
    padding: .5rem;*/
}#el-info-article .el-control-item{
    display: flex;
    flex-direction: column;
    gap: .5rem;
    width: 100%;
}#el-info-article .el-control-item #quantity{
    display: inline-block;
    height: 26px;
}#el-info-article .el-control-item h2{
   color: #68686d;
   font-size: calc(var(--font-size) * 1.1);
    font-family: var(--nexa-bold);
}#el-info-article .el-description ul,
#el-info-article .el-description ol{
    margin-left: 2rem;
}
#el-info-article #social-links ul{
    display: flex;
    align-items: center;
    gap: 1rem;
    list-style: none;
    margin-left: 0;
}#el-info-article #social-links svg{
     font-size: calc(var(--font-size) * 1.5);
}#el-info-article #social-links li:nth-child(1) svg{
     color: #0866ff;
}#el-info-article #social-links li:nth-child(2) svg{
     color: #0a66c2;
}#el-info-article #social-links li:nth-child(3) svg{
    color: #e60023;
}#el-info-article #social-links li:nth-child(4) svg{
    color: #0866ff;
}#el-info-article #social-links li:nth-child(5) svg{
    color: #00a884;
}