:root {

    --red: #eb1118;

    --grey: #9d968d;

    --greybone: #f7f8f6;

    --lightgrey: #ebe8e5;

    --brown: #ab9580;

    --lightbrown: #d9b48f;

    --white: #ffffff;

    --black: #4e4b48;

    --dark: #2e2e2e;

    --offset: #7f8c8d;

}



/*STYLE*/



@font-face {

    font-family: "Noto Serif";

    font-weight: 600;

    font-style: italic;

    src: url("/themes/brimont/fonts/NotoSerifDisplay-SemiBoldItalic.ttf");

}



@font-face {

    font-family: "Noto Serif";

    font-weight: 200;

    font-style: italic;

    src: url("/themes/brimont/fonts/NotoSerifDisplay-LightItalic.ttf");

}



@font-face {

    font-family: "Epilogue";

    font-weight: 200;

    src: url("/themes/brimont/fonts/Epilogue-Light.ttf");

}



@font-face {

    font-family: "Epilogue";

    font-weight: 400;

    src: url("/themes/brimont/fonts/Epilogue-Regular.ttf");

}



@font-face {

    font-family: "Epilogue";

    font-weight: 600;

    src: url("/themes/brimont/fonts/Epilogue-SemiBold.ttf");

}



* {

    font-size: 14px;

    transition: ease-in-out all 0.3s;

}



strong{

    font-weight: 800 !important;

}



body {

    background-color: var(--greybone);

    font-weight: 400;

    line-height: 1.8;

    color: var(--black);

    font-family: "Epilogue", "Arial", "Helvetica", sans-serif;

    overflow-x: hidden;

}



h1 {

    font-family: "Noto Serif", sans-serif;

    margin-top: 0;

    font-weight: 200;

    font-size: 49px;

    font-style: italic;

    letter-spacing: -2px;

}



h2 {

    font-family: "Noto Serif", sans-serif;

    font-size: 39px;

    font-style: italic;

    letter-spacing: -2px;

}



h3 {

    font-family: "Noto Serif", sans-serif;

    font-size: 31px;

    font-style: italic;

    letter-spacing: -2px;

}



h4 {

    font-family: "Noto Serif", sans-serif;

    font-size: 25px;

    font-style: italic;

    letter-spacing: -1px;

}



h5 {

    font-family: "Noto Serif", sans-serif;

    font-size: 20px;

    font-style: italic;

    letter-spacing: -1px;

}



h6 {

    font-family: "Noto Serif", sans-serif;

    font-size: 16px;

    font-style: italic;

    letter-spacing: -1px;

}



p {

    font-family: "Epilogue", "Arial", "Helvetica", sans-serif;

    font-weight: 200;

    font-size: 14px;

    line-height: 1.8;

}



small,

.text_small {

    font-family: "Epilogue", "Arial", "Helvetica", sans-serif;

    font-weight: 400;

    font-size: 12px;

    line-height: 1.2;

}



.small-uppercase {

    font-family: "Epilogue", "Arial", "Helvetica", sans-serif;

    font-weight: 600;

    text-transform: uppercase;

    font-size: 12px;

    line-height: 1.2;

}



/*Display responsive*/

.d-responsive-view {

    display: none;

}

.d-responsive-none {

    display: initial;

}



/* Buttons */

.btn-sm {

    padding: 0.8em 3em !important;

}



.btn-primary {

    border: none;

    font-size: 0.8em;

    padding: 1.2em;

    padding-right: 5rem;

    padding-left: 5rem;

    border-radius: 10px;

    color: var(--white);

    text-transform: uppercase;

    background-color: var(--black);

}



.btn-primary:hover {

    background-color: var(--brown);

}



.btn-primary-outline {

    color: var(--dark);

    font-size: 0.8rem;

    border: 1px solid var(--dark);

    background-color: transparent;

    padding-left: 2rem;

    padding-right: 2rem;

    padding-top: 1.2em;

    padding-bottom: 1.2em;

    text-transform: uppercase;

    border-radius: 10px;

}



.btn-primary-outline:hover {

    background-color: var(--dark);

    color: var(--white) !important;

}



.btn-white-outline {

    color: var(--white) !important;

    font-size: 0.8rem;

    border: 1px solid var(--white);

    background-color: transparent;

    padding-left: 2rem;

    padding-right: 2rem;

    padding-top: 1.2em;

    padding-bottom: 1.2em;

    text-transform: uppercase;

    border-radius: 10px;

}



.btn-white-outline:hover {

    background-color: var(--white);

    color: var(--dark) !important;

}



.btn-secondary {

    border: none;

    font-size: 0.8rem;

    padding: 1.2em;

    padding-right: 2rem;

    padding-left: 2rem;

    border-radius: 10px;

    color: var(--white);

    text-transform: uppercase;

    background-color: var(--lightbrown);

}



.border-right {

    border-right: 2px solid black;

}



.btn-link {

    color: var(--dark);

    font-size: 0.8rem;

    border: none;

    background-color: transparent;

    padding-left: 2rem;

    padding-right: 2rem;

    padding-top: 1.2em;

    padding-bottom: 1.2em;

    text-transform: uppercase;

    border-radius: 10px;

}



.btn-link:hover {

    background-color: var(--dark);

    color: var(--white) !important;

}



/*  HEADER SECTION   */

.headerband-main .swiper-slide {

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

}



.headerband-main a {

    text-decoration: none;

}



.headerband-main p {

    margin-top: 0.2rem;

    font-size: 0.8rem;

    margin-bottom: 0.2rem;

}



.header-desk {

    position: relative;

    top: 0;

    width: 100%;

    z-index: 99;

    background: linear-gradient(var(--greybone), 90%, rgb(255, 255, 255, 0.05));

}



.last-chance {

    padding-right: 1rem;

    color: var(--red) !important;

}



.pre-purchase {

    color: var(--black);

    margin-left: 1rem;

}



.user-bar {

    padding-top: 1rem;

    border-bottom: 1px solid var(--grey);

    padding-bottom: 0.5rem;

    transition: none !important;

}



.user-bar a {

    text-decoration: none;

}



.order-track {

    padding-right: 1rem;

    border-right: 1px solid var(--grey);

    color: var(--black);

}



.wishlist {

    margin-left: 1rem;

    margin-right: 1rem;

    position: relative;

    color: var(--black);

}



.wishlist ion-icon {

    color: var(--black);

    position: relative;

    font-size: 1.5rem;

}



.cart {

    margin-left: 1rem;

    margin-right: 1rem;

    position: relative;

    color: var(--black);

}



.cart ion-icon {

    color: var(--black);

    position: relative;

    font-size: 1.5rem;

}



.cart_info{

    flex-direction: initial;

}



/*Sidebar CART*/

.sidebar-overlay-cart {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

    display: none;

}



body.toggled-cart .sidebar-overlay-cart {

    opacity: 1;

    transform: translateX(0);

    z-index: 2001;

    top: 0px;

    display: block;

}



#sidebar-wrapper-cart {

    position: fixed;

    z-index: 3000;

    width: 35%;

    transition: all 0.5s ease;

    right: -60%;

    background: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    top: 0px;

}



body.toggled-cart #sidebar-wrapper-cart {

    right: 0%;

    transition: all 0.5s ease;

}



.badge-close-menu-cart {

    color: var(--white);

    z-index: 2;

    background-color: var(--brown);

    border-radius: 100%;

    height: 50px;

    width: 50px;

    padding: 0.35em 0.65em;

    font-size: 1rem;

    position: absolute;

    left: -30px;

    top: 30px;

    display: flex;

    justify-content: center;

    align-items: center;

}



body.toggled-cart .badge-close-menu-cart {

    right: -30px;

}



.sidebar-menu-cart {

    flex: 1;

    width: 100%;

    overflow-y: auto;

    padding-left: 40px;

    padding-right: 40px;

    padding-top: 10%;

    display: flex;

    flex-direction: column;

    list-style: none;

}



.sidebar-menu-cart h3 {

    margin-bottom: 20px;

}



.sidebar-menu-cart .cart-items {

    max-height: 55vh;

    list-style: none;

    overflow: hidden;

    overflow-y: scroll;

}



.sidebar-menu-cart .payment-buttons{

    position: relative;

    height: 20%;

}



.searchbar .dropdown-menu {

    margin-left: -330%;

}



.badge-wishlist, .badge-cart {

    color: var(--white);

    z-index: 2;

    background-color: var(--lightbrown);

    border-radius: 100%;

    height: 17px;

    width: 17px;

    padding: 0.35em 0.65em;

    font-size: 0.65em;

    position: absolute;

    left: 10px;

    bottom: 5px;

    display: flex;

    justify-content: center;

    align-items: center;

    font-weight: 700;

}



.login {

    color: var(--black);

}



.login ion-icon {

    margin-right: 2px;

    font-size: 1.3em;

    position: relative;

    top: 2px;

}



.fixed-nav {

    position: fixed !important;

}



.logo {

    width: 200px;

    margin-left: -22px;

}



.logo-bar ion-icon {

    color: var(--black);

    margin-left: 0.3rem;

    margin-right: 0.7rem;

}



.navbar a {

    color: var(--black);

    margin-left: 1rem;

    margin-right: 1rem;

    text-decoration: none;

    justify-content: center;

    align-items: center;

}



.category {

}



.category ion-icon {

    font-size: 10px;

}



.category-dropdown {

    position: absolute;

    z-index: 999999;

    width: 80%;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -200%);

    background-color: var(--white);

    transition: 1s;

}



.category-dropdown .image-area {

    position: relative;

    overflow: hidden;

    width: 40%;

    height: 100%;

    padding-top: 25%;

    padding-bottom: 2%;

}



.category-dropdown .image-area img {

    position: absolute;

    height: 100%;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    z-index: -1;

}



.category-dropdown .text-area {

    padding: 4rem;

    position: relative;

    overflow: hidden;

    width: 60%;

    height: 100%;

}



.text-area .sub-category {

    text-transform: uppercase;

    color: black;

    font-weight: bold;

    font-size: 1.1rem;

    margin-bottom: 2rem;

}



.text-area ul {

    margin-top: 1rem;

}



.text-area .sub-sub-category {

    color: var(--black);

}



.category-dropdown a {

    margin-left: 0;

    margin-right: 0;

}



.link-header {

    justify-content: center;

    align-items: center;

    padding: 5px 5px;

}



.dropped {

    transform: translate(-50%, -56%);

}



.searchbar {

    margin-left: 16px;

}



.searchbar ion-icon {

    margin-right: 0.4rem;

    font-size: 1.5rem;

}



.searchbar input {

    background-color: transparent;

    border: none;

}



body.toggled .sidebar-overlay {

    opacity: 1;

    transform: translateX(0);

    z-index: 2001;

    top: 0px;

}



body.toggled-cart-responsive .sidebar-overlay-cart-responsive {

    opacity: 1;

    transform: translateX(0);

    z-index: 2001;

    top: 0px;

}



body.toggled-catalog .sidebar-overlay-catalog {

    opacity: 1;

    transform: translateX(0);

    z-index: 2001;

    top: 0px;

}



body.toggled #sidebar-wrapper {

    right: -5%;

}



body.toggled-cart-responsive #sidebar-wrapper-cart-responsive {

    right: 0%;

}



body.toggled-catalog #sidebar-wrapper-catalog {

    left: 0%;

}



.text-right {

    text-align: right;

}



/* Responsive nav */

.overlay-nav-movil {

    z-index: 11;

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    height: 110px;

    background: linear-gradient(var(--greybone), 93%, rgb(255, 255, 255, 0.05));

}



.nav-mobile {

    width: 100%;

    display: none;

    max-height: 65px;

    z-index: 299;

    position: relative;

    top: 0px;

    left: 0px;

    background-color: var(--greybone);

}



.nav-movil-scroll{

    position: fixed;

}



.nav-movil-shadow {

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

}



.nav-mobile-icon {

    text-align: center;

    color: var(--black);

}



.nav-mobile-icon ion-icon {

    font-size: 24px;

    margin: 0 5px;

}



.nav-mobile-logo {

    height: 65px;

    width: 120px;



    text-indent: 110%;

    white-space: nowrap;

    overflow: hidden;

}



.nav-mobile-line-separator {

    width: 2px;

    height: 30px;

    background-color: var(--black);

    border-radius: 10px;

    display: block;

    margin: 0 10px;

}



.nav-mobile .no-cart-notification,

.nav-mobile .add-notification {

    right: -34px !important;

    font-size: 0.8rem !important;

    bottom: -63px;

}



.nav-mobile .cart-icon .badge {

    left: 12px !important;

    bottom: 0 !important;

    font-size: 0.8rem !important;

}



.nav-mobile .cart-icon ion-icon {

    font-size: 1.25rem;

    top: 0;

}



.cart-icon {

}



.cart-add-notification {

    background: var(--brown);

    color: #fff;

    text-transform: uppercase;

    font-size: 0.8em;

    padding: 5px 15px;

    border-radius: 3px;

    position: absolute;

    right: 10px;

    top: 60px;

    display: block;

    width: 160px;

    text-align: center;

    display: none;

}



.cart-responsive {

    position: relative;

}



.cart-product-name {

    font-size: 17px;

    line-height: 1;

    margin-top: 5px;

}



.cart-product-details {

    margin-top: 15px;

}



.cart-item-media .wk-price {

    font-size: 1em;

    margin-bottom: 10px;

}



.cart-product-details p {

    font-size: 0.9em;

    line-height: 1.3;

}



.cart-btns a {

    margin-left: 0px;

    margin-right: 0px;

}



.scroll-menu {

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

    background-color: var(--greybone);

    position: fixed;

    top: 0;

    width: 100%;

    z-index: 98;

}

/*

.scroll-menu img {

    width: 130px;

    height: auto;

}

*/



/* --- Nav-mobile-wrap --- */

#sidebar-wrapper {

    position: fixed;

    z-index: 3000;

    width: 85%;

    transition: all 0.5s ease;

    right: -85%;

    background: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    margin-top: 0;

}



.sidebar-overlay {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

}



/* --- Nav-mobile-wrap-cart --- */

#sidebar-wrapper-cart-responsive {

    position: fixed;

    z-index: 3000;

    width: 85%;

    transition: all 0.5s ease;

    right: -100%;

    background: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    margin-top: 0;

}



.sidebar-overlay-cart-responsive {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

}



#sidebar-wrapper-catalog {

    position: fixed;

    z-index: 3000;

    width: 35%;

    transition: all 0.5s ease;

    left: -35%;

    background: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

    top: 0px;

}





.catalog-button {

    margin-top: 2rem;

    margin-bottom: 1rem;

}



.sidebar-overlay-catalog {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

}



/* Busqueda */

#search {

    position: fixed;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    background-color: rgba(246, 247, 245, 0.9);

    color: #000;

    z-index: 10000;



    -webkit-transition: all 0.5s ease-in-out;

    -moz-transition: all 0.5s ease-in-out;

    -o-transition: all 0.5s ease-in-out;

    -ms-transition: all 0.5s ease-in-out;

    transition: all 0.5s ease-in-out;



    -webkit-transform: translate(0px, -100%) scale(0, 0);

    -moz-transform: translate(0px, -100%) scale(0, 0);

    -o-transform: translate(0px, -100%) scale(0, 0);

    -ms-transform: translate(0px, -100%) scale(0, 0);

    transform: translate(0px, -100%) scale(0, 0);



    opacity: 0;

}



#search.open {

    -webkit-transform: translate(0px, 0px) scale(1, 1);

    -moz-transform: translate(0px, 0px) scale(1, 1);

    -o-transform: translate(0px, 0px) scale(1, 1);

    -ms-transform: translate(0px, 0px) scale(1, 1);

    transform: translate(0px, 0px) scale(1, 1);

    border-radius: 0px;

    opacity: 1;

}



#search input[type="search"] {

    position: absolute;

    top: 50%;

    width: 100%;

    color: rgb(255, 255, 255);

    background: rgba(0, 0, 0, 0);

    font-size: 60px;

    font-weight: 300;

    text-align: center;

    border: 0px;

    margin: 0px auto;

    margin-top: -51px;

    padding-left: 30px;

    padding-right: 30px;

    outline: none;

}



#search .btn {

    position: absolute;

    top: 50%;

    left: 50%;

    margin-top: 80px;

    transform: translateX(-50%);

}



#search .btn-search {

    background-color: #fff;

    color: #000;

    border-radius: 3px;

    padding: 15px 25px;

}



#search .btn-search:hover {

    background-color: #000;

    color: #fff;

    border-radius: 3px;

    padding: 15px 50px;

}



#search .btn-search ion-icon {

    font-size: 1.3em;

    position: relative;

    top: 2px;

    margin-left: 15px;

}



#search .close {

    position: fixed;

    top: 15px;

    right: 15px;

    color: #000;

    background-color: #fff;

    border-color: #fff;

    border-radius: 100%;

    opacity: 1;

    padding: 15px 17px;

    font-size: 27px;

}



/* RECOMENDATION PRODUCTS */

.recomendation {

    padding-top: 5rem;

    padding-bottom: 5rem;

    background-color: var(--white);

}



.recomendation h3 {

    margin-bottom: 40px;

}



.recomendation-product {

    margin-right: 30px !important;

    width: 390px !important;

}



.recomendation-product .col-md-4 {

    border-radius: 20px;

    height: 200px;

    overflow: hidden;

    position: relative;

}

.recomendation-product .col-md-8 {

    padding-left: 30px;

    position: relative;

}



.recomendation-product img {

    position: absolute;

    top: 50%;

    right: 50%;

    transform: translate(50%, -50%);

    height: 100%;

    z-index: 1;

}



.recomendation-product .whishlist-btn {

    position: absolute;

    top: 0px;

    left: 0px;

    color: black;

    font-size: 2rem;

    z-index: 3;

}

.new-badge-recomendation {

    background-color: var(--lightbrown);

    color: var(--white);

    padding-top: 0.5rem;

    padding-bottom: 0.5rem;

    padding-left: 1rem;

    padding-right: 1rem;

    font-size: 0.8rem;

    border-radius: 10px;

    margin-bottom: 0.8rem;

}



.recomendation-product .btn-primary-outline {

    font-size: 0.8rem;

    color: var(--black);

    padding: 1rem;

    padding-bottom: 0.6rem;

    padding-top: 0.6rem;

    text-decoration: none;

}



.recomendation-product p {

    color: var(--dark);

    font-size: 1rem;

    margin-bottom: -5px;

}



.recomendation-row .whishlist-btn ion-icon {

    font-size: 1em;

}



.recomendation-row {

    height: 100%;

}



.recomendation-row .discount-badge {

    position: absolute;

    left: 50px;

    bottom: -4px;

    z-index: 2;

    transform: scale(0.8);

}



.product-badge-wrap{

    height: 40px;

}



.rec-text{

    height: 160px;

}



.card-info{

    height: 200px;

}



/* PRODUCT DETAIL */

.product-detail .breadcrumb-wrap {

    margin-bottom: 2rem;

}



#myTabContent .tab-pane ul{

    list-style-position:inside;

}



.product-detail a {

    text-decoration: none;

}



.product-detail-flex-wrap {

    display: flex;

    align-items: flex-start;

}



.product-detail-nav-wrap .nav-tabs .nav-link {

    border: none;

    border-top-left-radius: 0;

    border-top-right-radius: 0;

    padding: 0;

    height: 100%;

}



.product-detail-nav-wrap .nav-tabs .nav-link img {

    max-width: 100%;

    height: auto;

    max-height: 100%;

}



.product-detail-nav-wrap .nav-tabs {

    border-bottom: none;

    height: 100%;

}



.product-detail-nav-wrap {

    width: 80px;

    flex: 0 0 100px;

    margin-right: 15px;

    height: 600px;

    overflow-y: scroll;

}



.product-detail-nav-wrap ul li + li {

    margin-top: 15px;

}



.product-detail-nav-wrap ul li a.active {

    opacity: 0.74;

}



.product-detail-img-wrap {

    flex-grow: 1;

    position: relative;

    overflow: hidden;

    width: 100%;

    height: 550px;

    padding-right: 60px;

}



.product-detail-img-wrap .tab-pane.active {

    animation: none;

}



.product-detail-img,

.product-detail-img a {

    position: relative;

    width: 100%;

    height: 550px;

    overflow: hidden;

}



.product-detail-img img {

    width: auto;

    height: 800px;

    position: relative;

    top: -120px;

    left: -75px;

}



.product-detail-img-wrap .product-badge-wrap {

    position: absolute;

    top: 30px;

    left: 30px;

    z-index: 2;

}



.product-detail-img-wrap .discount-badge {

    position: absolute;

    top: 30px;

    right: 30px;

    z-index: 2;

}



.star-none {

    font-size: 1.2rem;

    color: black;

}



.star-fill {

    font-size: 1.2rem;

    color: var(--brown);

}



.rate {

    float: left;

    height: 46px;

    padding: 0 10px;

}



.rate:not(:checked) > input {

    position: absolute;

    visibility: hidden;

}

.rate:not(:checked) > label {

    float: right;

    width: 1em;

    overflow: hidden;

    white-space: nowrap;

    cursor: pointer;

    font-size: 30px;

    color: #ccc;

}

.rate:not(:checked) > label:before {

    content: "★ ";

}

.rate > input:checked ~ label {

    color: #ffc700;

}

.rate:not(:checked) > label:hover,

.rate:not(:checked) > label:hover ~ label {

    color: #deb217;

}

.rate > input:checked + label:hover,

.rate > input:checked + label:hover ~ label,

.rate > input:checked ~ label:hover,

.rate > input:checked ~ label:hover ~ label,

.rate > label:hover ~ input:checked ~ label {

    color: #c59b08;

}



.active-card {

    color: white;

    background-color: black;

    border-color: black;

}



.modal-dialog {

    max-width: 1000px;

    margin-top: 6rem;

}



.modal-content {

    border-radius: 10px;

}



.btn-close {

    color: var(--red);

    background-color: var(--lightbrown);

}



.modal-header {

    background-color: var(--black);

    color: var(--white);

}



.product-desc-wrap .nav-pills {

    border-top: 1px solid var(--grey);

    border-bottom: 1px solid var(--grey);

    text-align: center;

    justify-content: center;

}



.product-desc-wrap .nav-link {

    color: var(--grey);

    padding: 1rem;

    font-size: 12px;

}



.product-desc-wrap .nav-link.active {

    color: var(--black);

    background-color: var(--grey);

    border-radius: 0;

    padding: 1rem;

    font-size: 12px;

}



.product-desc-wrap {

    margin-top: 3rem;

    margin-bottom: 3rem;

}



.product-desc-wrap .tab-pane {

    text-align: center;

    color: var(--black);

    border-bottom: 1px solid var(--grey);

    padding-top: 4rem;

    padding-bottom: 4rem;

}



.product-desc-wrap p {

    text-transform: uppercase;

    margin-top: 0;

    margin-bottom: 0;

}



.no-stock-variant {

    height: 40px;

    line-height: 40px;

    margin-right: 10px;

    border: 3px solid var(--black);

}



.no-stock-variant .line {

    height: 3px;

    width: 100%;

}



.no-stock-variant .line {

    height: 3px;

    color: var(--black);

    background: rgba(0, 0, 0, 0.8);

}



.social-share-icons {

    margin-top: 15px;

    margin-bottom: 20px;

    text-transform: uppercase;

}



.social-share-icons .social-button {

    font-size: 1.2em;

    margin: 0 5px;

    color: var(--dark);

}



.card {

    padding-top: 2rem;

    padding-bottom: 2rem;

    background-color: var(--greybone);

    border-radius: 20px;

    border: none;

    box-shadow: 8px 15px 25px rgba(0, 0, 0, 0.2);

}



.reviews-card p {

    padding-top: 1rem;

    color: var(--black);

    line-height: 1.5;

}



.reviews-card-title {

    color: var(--black);

    padding-bottom: 0.4rem;

}



.reviews-card-title h5 {

    font-style: italic;

}



.reviews-card-title small {

    padding-top: 0.5rem;

}



.reviews {

    padding-top: 5rem;

    padding-bottom: 5rem;

    background-color: var(--white);

}



.stock-variant {

    border-radius: 10px;

    height: 40px;

    line-height: 40px;

    margin-right: 10px;

    border: 2px solid var(--grey);

    opacity: 1;

    width: 40px;

    text-align: center;

    font-size: 14px;

    color: var(--white);

    background-color: var(--grey);

    display: block;

    position: relative;

    overflow: hidden;

}



.stock-variant:hover {

    background: var(--black);

    color: var(--white);

    border-color: var(--black) !important;

}



.stock-variant.active {

    background: var(--dark);

    color: var(--white);

    border-color: var(--dark) !important;

}



.wk-variant-title {

    color: var(--offset);

}



.product-description {

    color: var(--offset);

}



.color-brown {

    border-radius: 100%;

    height: 40px;

    line-height: 40px;

    margin-right: 10px;

    border: 3px solid var(--dark);

    opacity: 1;

    width: 40px;

    background-color: var(--dark);

    text-align: center;

    font-size: 14px;

    color: #544842;

    display: block;

    position: relative;

}



.detail-title {

    font-size: 2.5rem;

    font-weight: bold;

    margin-bottom: 0.4rem;

}



.review-text h1 {

    color: var(--black);

    font-style: italic;

    padding-bottom: 0.8rem;

}



.rating {

    color: var(--black);

    margin-bottom: 15px;

}



.rating span {

    margin-left: 0.5rem;

    font-size: 0.9rem;

}



.review-span {

    color: var(--black);

    font-size: 0.9rem;

}



.review-title {

    color: var(--black);

    font-style: italic;

}



.review-text p {

    margin-top: 2rem;

    padding-bottom: 2rem;

    font-size: 0.9rem;

    color: var(--black);

    border-bottom: 1px solid var(--black);

}



.active-card {

    color: white;

    background-color: black;

    border-color: black;

}



.product-details-content {

    position: relative;

    padding-right: 20%;

}



.product-details-content .product-title {

    font-size: 2.6em;

}



.reviews-cards {

    padding-left: 80px;

}



/* user */

.sidebar-user {

    width: 100%;

    height: 20%;

    display: flex;

    align-content: flex-end;

    -ms-flex-wrap: wrap;

    flex-wrap: wrap;

    flex: none;

    border-right: 2px solid black;

    padding-bottom: 30px;

}



.sidebar-user .item {

    width: 50%;

    align-self: flex-end;

    background: var(--lightgrey);

    color: var(--black) !important;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    font-weight: 100;

}



.sidebar-user .item ion-icon {

    font-size: 1.4rem;

    padding: 0.4rem 0;

}



.badge-cart-responsive {

    color: var(--white);

    z-index: 2;

    background-color: var(--lightbrown);

    border-radius: 100%;

    height: 17px;

    width: 17px;

    padding: 0.35em 0.65em;

    font-size: 0.65em;

    position: absolute;

    right: 10px;

    bottom: -5px;

    display: flex;

    justify-content: center;

    align-items: center;

}





.badge-close-menu {

    color: var(--white);

    z-index: 2;

    background-color: var(--brown);

    border-radius: 100%;

    height: 50px;

    width: 50px;

    padding: 0.35em 0.65em;

    font-size: 1rem;

    position: absolute;

    left: 10px;

    top: 10px;

    display: flex;

    justify-content: center;

    align-items: center;

}



body.toggled .badge-close-menu {

    left: -30px;

}



.badge-close-menu-catalog {

    color: var(--white);

    z-index: 2;

    background-color: var(--brown);

    border-radius: 100%;

    height: 50px;

    width: 50px;

    padding: 0.35em 0.65em;

    font-size: 1rem;

    position: absolute;

    right: 10px;

    top: 10px;

    display: flex;

    justify-content: center;

    align-items: center;

}



body.toggled-catalog .badge-close-menu-catalog {

    right: -25px;

}



/* menu */



.sidebar-menu {

    flex: 1;

    width: 100%;

    overflow-y: auto;

}



.sidebar-menu ul {

    list-style: none;

    padding: 0;

}



.sidebar-menu li {

    letter-spacing: 1px;

    font-size: 1.5rem;

    padding: 0.85rem 1.4rem;

    padding-top: 2rem;

}



.sidebar-menu li.title {

    background: #f8f8f8 !important;

    font-weight: bold;

    font-size: 1.7rem;

    margin-top: 0;

}



.sidebar-menu a {

    display: flex;

    align-items: center;

    font-size: 1rem;

    text-decoration: none;

    color: var(--black);

}



/* menu Catalog*/



.sidebar-menu-catalog {

    flex: 1;

    width: 100%;

    overflow-y: auto;

    padding-left: 20%;

    padding-right: 20%;

    padding-top: 10%;

}



.sidebar-content {

    height: 50%;

    overflow-y: auto;

}



.sidebar-image {

    height: 50%;

}



.sidebar-image img {

    width: 100%;

    height: 100%;

    object-fit: cover;

}



.filter-text {

    color: var(--black);

    border-bottom: 2px solid var(--black);

    padding-bottom: 2rem;

}



.filter-text h3 {

    font-style: italic;

}



.filter-text p {

    margin-top: 1rem;

    line-height: 2;

}



.index-top-back {

    display: none;

}



.nav-mobile {

    background-color: var(--greybone);

    display: none;

}



.last-chance-responsive {

    color: var(--red) !important;

}

.last-chance-responsive ion-icon {

    margin-right: 0.5rem;

}



.user-nav-resp {

    color: var(--black);

    background-color: var(--lightgrey);

}



/* AUTH SECTION */



.auth {

    margin-top: 18rem;

}



.auth h1 {

    color: var(--black);

    font-style: italic;

}



.label-auth {

    margin-top: -1rem;

    font-size: 0.8rem;

    color: grey;

    text-transform: uppercase;

    position: absolute;

}



.auth .text-input {

    margin-top: 2rem;

}



.auth .btn-primary {

    margin-top: 2rem;

}



.text-input {

    border: none !important;

    background-color: var(--greybone) !important;

    color: var(--black) !important;

    width: 100% !important;

    border-radius: 0 !important;

    border-bottom: 2px solid var(--black) !important;

}



.margin-top-auth {

    margin-top: 2rem;

}



.register-label {

    text-decoration: none;

    color: var(--black);

    font-size: 0.9rem;

}



.register-label a {

    text-decoration: none;

    color: inherit;

}



.register-label a:hover {

    color: var(--brown);

}



/* SPINNER */



.spinner-outer {

    top: 0px;

    position: absolute;

    bottom: 50%;

    left: 50%;

}

.spinner-outer-svg {

    bottom: 0;

    -webkit-animation-name: spin-clockwise;

    -webkit-animation-duration: 25s;

    -webkit-animation-iteration-count: infinite;

    -webkit-animation-timing-function: linear;

    animation-name: spin-clockwise;

    animation-duration: 25s;

    animation-iteration-count: infinite;

    animation-timing-function: linear;

    -ms-animation-name: none;

}

.spinner-outer,

.spinner-outer-svg {

    width: 220px;

    height: 220px;

    backface-visibility: hidden;

    -webkit-backface-visibility: hidden;

    background-color: transparent !important;

}



@-webkit-keyframes spin-clockwise {

    0% {

        transform: rotate(0deg);

    }



    to {

        transform: rotate(1turn);

    }

}



@keyframes spin-clockwise {

    0% {

        transform: rotate(0deg);

    }



    to {

        transform: rotate(1turn);

    }

}



/* INDEX */



.main-img {

    width: 100%;

}



.banner {

    overflow: hidden !important;

}



.promotional-banner {

    overflow: hidden !important;

}



.desktop-banner {

    position: relative;

    margin-top: -100px;

}



.banner .slider-content {

    position: absolute;

    width: 100%;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

}



.banner img {

}



.btn-banner {

    margin-top: 2rem;

}



.responsive-banner {

    display: none;

}



.banner .Left .custom-slider-position {

    text-align: left;

    display: block;

    width: 40%;

}



.banner .Center .custom-slider-position {

    text-align: center;

    display: block;

    width: 40%;

    margin-right: auto;

    margin-left: auto;

}



.banner .Right .custom-slider-position {

    text-align: right;

    display: block;

    width: 40%;

    margin-left: auto;

}



.Left .spinner-outer {

    transform: translate(150%, 50%);

}



.Center .spinner-outer {

    transform: translate(-250%, 50%);

}



.Right .spinner-outer {

    transform: translate(-550%, 50%);

}



.swiper-slide {

    position: relative;

}



.banner {

    position: relative;

}



.banner .swiper-button-next {

    position: absolute;

    z-index: 3;

    bottom: 50%;

    left: 50%;

    width: 150px;

    height: 150px;

    transform: translate(350%, 150%);

    border: 1px solid white;

    background-color: white;

    color: black;

    border-radius: 100px;

}

.banner .swiper-button-next:after {

    content: "";

}



.banner .swiper-button-next p {

    font-size: 0.8rem;

    margin-top: 45px;

}



.banner .swiper-button-next ion-icon {

    position: absolute;

    bottom: 50%;

    left: 50%;

    transform: translate(-100%, 0%);

    font-size: 2rem;

}



.banner .swiper-button-prev {

    position: absolute;

    z-index: 2;

    bottom: 50%;

    left: 50%;

    width: 120px;

    height: 120px;

    transform: translate(373%, 230%);

    border: 1px solid white;

    background-color: white;

    color: black;

    border-radius: 100px;

}



.banner .swiper-button-prev:after {

    content: "";

}



.banner .swiper-button-prev p {

    font-size: 0.8rem;

    margin-top: 45px;

}



.banner .swiper-button-prev ion-icon {

    position: absolute;

    bottom: 50%;

    left: 50%;

    transform: translate(-100%, 0%);

    font-size: 1.5rem;

}



.detailSwiper {

    position: relative;

}



.recSwiper .swiper-wrapper{

    padding-left: 70px;

}



.recSwiper .swiper-button-next {

    position: absolute;

    z-index: 3;

    width: 50px;

    height: 50px;

    border: none;

    background-color: var(--lightgrey);

    color: var(--dark);

    border-radius: 100%;

    text-align: center;

    padding: 15px;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

}



.recSwiper .swiper-slide-invisible-blank{

    width: 0%;

}



.recSwiper .swiper-button-prev {

    position: absolute;

    z-index: 3;

    width: 50px;

    height: 50px;

    border: none;

    background-color: var(--lightgrey);

    color: var(--dark);

    border-radius: 100%;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

    left: 0px;

    text-align: center;

    padding: 15px;

}



.recSwiper .swiper-button-next::after,

.recSwiper .swiper-button-prev::after {

    font-size: 1.3em;

}



.detailSwiper .swiper-button-next {

    position: absolute;

    z-index: 3;

    width: 50px;

    height: 50px;

    border: none;

    background-color: var(--lightgrey);

    color: var(--dark);

    border-radius: 100%;

    text-align: center;

    padding: 15px;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

}



.detailSwiper .swiper-button-prev {

    position: absolute;

    z-index: 3;

    width: 50px;

    height: 50px;

    border: none;

    background-color: var(--lightgrey);

    color: var(--dark);

    border-radius: 100%;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

    left: 0px;

    text-align: center;

    padding: 15px;

}



.detailSwiper .swiper-button-next::after,

.detailSwiper .swiper-button-prev::after {

    font-size: 1.3em;

}



/* INDEX SERVICES */

.services {

    padding-top: 3rem;

    padding-bottom: 3rem;

    color: var(--black);

    background-color: white;

}



.service-box {

    padding: 0px 50px;

}



.services ion-icon {

    font-size: 2rem;

}



.services h5 {

    font-weight: normal;

    margin-top: 0.5rem;

    margin-bottom: 1rem;

}



.services p {

    margin-top: 1rem;

    margin-bottom: 1rem;

    font-size: 0.9rem;

}



.services a {

    margin-top: 1rem;

    margin-bottom: 1rem;

    font-size: 0.9rem;

    text-decoration: underline;

    color: var(--black);

}



/* INDEX COLLECTIONS */

.collections {

    position: relative;

    padding-top: 6rem;

    padding-bottom: 6rem;

    background-color: var(--dark);

    color: var(--white);

    text-align: center;

}



.collections h1 {

    font-weight: 700;

}



.collections .btn-primary-outline {

    color: white;

    border: 3px solid white;

}



.collection-1 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-1 .spinner-outer-svg {

    position: absolute;

    bottom: -50px;

    left: -50px;

}



.collection-1 a {

    position: absolute;

    bottom: 50px;

    right: 50px;

}



.collection-1 h1 {

    position: absolute;

    top: -30px;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

}



.collection-1 small {

    position: absolute;

    top: 0px;

    left: 49%;

    transform: translate(-50%, -50px);

}



.collection-2 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    align-items: flex-end;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-2 .spinner-outer-svg {

    position: absolute;

    top: -50px;

    right: -50px;

}



.collection-2 a {

    position: absolute;

    top: initial;

    left: 50%;

    bottom: 60px;

    transform: translate(-50%, 0);

}



.collection-2 h1 {

    position: absolute;

    top: initial;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

    bottom: -25px;

}



.collection-2 small {

    position: absolute;

    top: 105%;

    left: 50%;

    transform: translate(-50%);

}



.collection-3 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-3 .spinner-outer-svg {

    position: absolute;

    bottom: 50px;

    left: 50px;

}



.collection-3 a {

    position: absolute;

    bottom: 50px;

    right: 50px;

}



.collection-3 h1 {

    position: absolute;

    top: -30px;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

}



.collection-3 small {

    position: absolute;

    top: 0px;

    left: 49%;

    transform: translate(-50%, -50px);

}



.collection-4 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-4 .spinner-outer-svg {

    position: absolute;

    bottom: -50px;

    left: -50px;

}



.collection-4 a {

    position: absolute;

    bottom: 50px;

    right: 50px;

}



.collection-4 h1 {

    position: absolute;

    top: -30px;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

}



.collection-4 small {

    position: absolute;

    top: 0px;

    left: 49%;

    transform: translate(-50%, -50px);

}



.collection-5 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    align-items: flex-end;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-5 .spinner-outer-svg {

    position: absolute;

    top: -50px;

    right: -50px;

}



.collection-5 a {

    position: absolute;

    top: initial;

    left: 50%;

    bottom: 60px;

    transform: translate(-50%, 0);

}



.collection-5 h1 {

    position: absolute;

    top: initial;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

    bottom: -25px;

}



.collection-5 small {

    position: absolute;

    top: 105%;

    left: 50%;

    transform: translate(-50%);

}



.collection-6 {

    position: relative;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    height: 600px;

    margin-top: 100px;

    margin-bottom: 100px;

    padding: 0px 8px;

}



.collection-6 .spinner-outer-svg {

    position: absolute;

    bottom: 50px;

    left: 50px;

}



.collection-6 a {

    position: absolute;

    bottom: 50px;

    right: 50px;

}



.collection-6 h1 {

    position: absolute;

    top: -30px;

    left: 50%;

    width: 200px;

    transform: translate(-50%, 0);

}



.collection-6 small {

    position: absolute;

    top: 0px;

    left: 49%;

    transform: translate(-50%, -50px);

}



.img-overlay {

    height: 100%;

    width: 100%;

    text-align: center;

    overflow: hidden;

    position: relative;

    border-radius: 10px;

}



.img-overlay img {

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    position: absolute;

    height: 100%;

}



/* INDEX NEW FINDINGS */

.new-findings {

    padding-top: 5rem;

    padding-bottom: 2rem;

    position: relative;

    overflow: hidden;

}



.new-findings-text {

    margin-bottom: 2rem;

}



.new-findings-text h2 {

    color: var(--black);

    margin-right: 2rem;

    margin-bottom: 2rem;

}



.new-findings-text p {

    color: var(--dark);

    margin-right: 20%;

    line-height: 2;

}



.decoration-background {

    background-color: var(--white);

    width: 100%;

    height: 350px;

    position: absolute;

    top: 72%;

    left: 0;

    z-index: -1;

}



.decoration-circle {

    background-color: var(--lightgrey);

    width: 650px;

    height: 650px;

    border-radius: 100%;

    position: absolute;

    top: 20%;

    left: -15%;

    z-index: -1;

}



/*INDEX BEST SELLERS */

.best-sellers {

    padding-top: 4rem;

    padding-bottom: 4rem;

}



.best-seller-text {

    padding-bottom: 4rem;

    color: var(--black);

}



.best-seller-text p {

    padding-right: 15%;

    padding-left: 5%;

    line-height: 2;

    font-size: 0.9rem;

}



/* PROMOTIONAL BANNER */

.promotional-banner .swiper-slide {

    height: 300px;

    padding-top: 80px;

}



.promotional-banner .swiper-slide h1 {

    margin-bottom: 1rem;

}



.promotional-banner .main-img {

    height: 300px;

}



.img-background {

    text-align: center;

    background-size: cover;

    background-position: center;

}



/* CATALOG BANNER */

.catalog-bar-image {

    background-color: var(--dark);

    color: var(--black);

    text-align: center;

    position: relative;

    z-index: 10;

    margin-top: -90px;

    padding: 230px 0px 40px 0px;

    margin-bottom: -30px;

}



.catalog-bar-image .overlay {

    width: 100%;

    height: 100%;

    position: absolute;

    top: 0px;

    left: 0px;

    z-index: 2;

    background-color: var(--white);

    opacity: 0.5;

}



.catalog-bar-text {

    position: relative;

    z-index: 2;

}



/*CATALOG CTA*/

.catalog-cta{

    position: relative;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

    background-color: var(--white);

    border-radius: 15px;

    overflow: hidden;

    margin-bottom: 40px;

    height: 520px;

    color: var(--white) !important;

    padding: 50px;

}



.overlay-cta{

    position: absolute;

    background-color: rgba(0, 0, 0, 0.5);

    width: 100%;

    height: 100%;

    top: 0;

    left: 0;

    z-index: 0;

}



.text-cta{

    position: absolute;

    z-index: 1;

    bottom: 50px;

    padding-right: 160px;

}



.text-cta h1{

    margin-bottom: 15px !important;

}



@media (max-width: 960px) {

    .catalog-cta {

        padding: 20px;

    }



    .text-cta {

        padding-right: 110px;

    }

}



/* CATALOG SECTION */

#sidebar {

    position: fixed;

    z-index: 3000;

    width: 85%;

    transition: all 0.5s ease;

    left: -85%;

    background: #fff;

    display: flex;

    flex-direction: column;

    height: 100%;

}



.sidebar-overlay {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

}



.sidebar-overlay-cart-responsive {

    background: rgba(0, 0, 0, 0.3);

    z-index: -1;

    position: fixed;

    width: 100%;

    height: 150%;

    opacity: 0;

    transition: opacity 0.5s ease;

    transform: translate3d(-260px, 0, 0);

}



.filters {

    padding-top: 2rem;

    padding-bottom: 2rem;

}



.filters select {

    border: none;

    background-color: transparent;

    color: var(--black);

    width: 150px;

    border-bottom: 2px solid var(--black);

}



.views-filter-btn {

    position: relative;

    margin-left: 10px;

}



.views-filter-btn .view-filter-element {

    width: 12px;

    height: 12px;

    border: 1px solid var(--dark);

    margin-left: 5px;

    margin-bottom: 5px;

}



.views-filter-btn .double-height {

    height: 29px;

}



.views-filter-btn.active .view-filter-element {

    background-color: var(--black);

}



.views-filter-btn:hover .view-filter-element {

    background-color: var(--black);

}



/*

.view-col-6 {

	height: 100%;

	border: 1px solid var(--black);

	width: 10px;

	margin-right: 5px;

}



.view-col-4 {

	height: 50%;

	border: 1px solid var(--black);

	width: 10px;

	margin-right: 5px;

}



.views-filter-50 {

	height: 50%;

	margin-left: 1rem;

	margin-right: 1rem;

}



.views-filter {

	height: 80%;

	padding-top: 1rem;

	margin-left: 1rem;

	margin-right: 1rem;

}

*/



.views-selector .form-control {

    width: 130px !important;

}



.views-selector p {

    padding-top: 1rem;

    margin-left: 1rem;

    margin-right: 1rem;

    font-size: 1rem;

}



.breadcrumb-wrap {

    color: var(--grey);

    margin-top: 30px;

    padding: 10px 0px;

    border-top: 1px solid var(--grey);

    border-bottom: 1px solid var(--grey);

    width: 100%;

    opacity: 0.7;

}



.breadcrumb-wrap p {

    font-size: 0.8rem;

    text-transform: uppercase;

}



.breadcrumb-wrap ion-icon {

    font-size: 1rem;

    margin-right: 0.4rem;

    margin-top: -0.1rem;

}



.breadcrumb-wrap a {

    font-size: 0.8rem;

    text-decoration: none;

    color: inherit;

    line-height: 1.175;

    text-transform: uppercase;

}



.shop-area .container {

    max-width: 1530px;

    width: 100%;

}



.sidebar-wrapper-catalog button {

    margin-top: 2rem;

    margin-bottom: 1rem;

}



/* USER */



.nav-user a {

    color: var(--black);

    text-decoration: none;

}



/* --- accordion ---  */

.accordion-item {

    border: 0px solid;

    background: var(--lightgrey);

}



.accordion-item:last-of-type {

    border-bottom-right-radius: 1rem !important;

    border-bottom-left-radius: 1rem !important;

}



.accordion-body {

    background: var(--lightgrey);

    border-bottom-right-radius: 20px;

    border-bottom-left-radius: 20px;

    text-align: left;

}

.accordion-body ul {

    padding: 0rem;

}



.accordion-button:not(.collapsed),

.accordion-button {

    color: var(--black);

    background-color: var(--white);

    box-shadow: inset 0 0px 0 rgb(0 0 0);

}



.badge--custom {

    background: var(--brown) !important;

    color: var(--white) !important;

    border-radius: 100%;

    padding: 0.1rem 0.6rem;

    font-size: 0.8rem;

}



/* PRODUCT CARD */



.product-card {

    position: relative;

    box-shadow: 20px 20px 30px -25px rgba(0, 0, 0, 0.3);

    background-color: var(--white);

    border-radius: 15px;

    overflow: hidden;



    margin-bottom: 40px;

    height: 520px;

}



.product-image-wrap {

    width: 100%;

    height: 350px;

    background-color: var(--greybone);

    overflow: hidden;

    position: relative;

}



.product-image-wrap-2 {

    width: 100%;

    height: 350px;

    background-color: var(--greybone);

    overflow: hidden;

    position: relative;

}



.col-md-6 .product-card .product-image-wrap {

    height: 600px;

}



.col-md-6 .product-card .product-image-wrap img {

    height: auto;

    width: 100%;

}



.col-md-6 .product-card .product-image-wrap-2 {

    height: 600px;

}



.col-md-6  .product-card{

    height: 830px;

}



.product-image-wrap img {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);



    -webkit-transform: translate(-50%, -50%);

    -moz-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    -o-transform: translate(-50%, -50%);



    width: 130%;

    height: auto;

}



.product-image-wrap-2 img {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);



    -webkit-transform: translate(-50%, -50%);

    -moz-transform: translate(-50%, -50%);

    -ms-transform: translate(-50%, -50%);

    -o-transform: translate(-50%, -50%);



    width: auto;

    height: 150%;

}



.product-image-wrap .secondary-image {

    opacity: 0;

}



.product-card:hover .secondary-image {

    opacity: 1;

}



.whishlist-btn {

    position: absolute;

    top: 20px;

    right: 20px;

    color: var(--dark);

    z-index: 10;

}



.whishlist-btn ion-icon {

    font-size: 2em;

}



.whishlist-btn:hover ion-icon {

    transition: 0.3s ease;

    transform: scale(1.3);

    color: var(--red);

}



.product-info {

    position: relative;

    padding-top: 30px;

    padding-left: 30px;

    padding-right: 30px;

}



.product-info-wishlist {

    position: relative;

    padding-top: 30px;

    padding-left: 30px;

    padding-right: 30px;

}



.product-badge-wrap .badge {

    padding: 8px 20px;

}



.badge-light-brown {

    background-color: var(--lightbrown);

    color: var(--white);

}



.badge-brown {

    background-color: var(--brown);

    color: var(--dark);

}



.discount-badge {

    width: 70px;

    height: 70px;

    background-color: var(--red);

    color: var(--white);

    border-radius: 100%;

    text-align: center;

    position: relative;

}



.product-card .discount-badge {

    position: absolute;

    top: -50px;

    right: 20px;

}



.discount-badge span {

    position: absolute;

    font-size: 1.5rem;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -60%);

}



.discount-badge small {

    position: absolute;

    text-transform: uppercase;

    font-size: 0.6rem;

    top: 50%;

    left: 50%;

    transform: translate(-50%, 90%);

}



.product-card .product-badge-wrap {

    position: absolute;

    top: -13px;

    left: 20px;

}



.product-title {

    color: var(--black);

    font-size: 1.4rem;

    letter-spacing: -1px;

    margin-bottom: 0px;

    line-height: 1.2;

}



.product-category {

    text-transform: uppercase;

    color: var(--black);

    font-size: 0.8rem;

    margin-bottom: 0px;

}



.product-price {

    color: var(--black);

    font-size: 1.5rem;

}



.product-card .text-danger {

    color: var(--red);

}



.discounted-price {

    font-size: 1.1rem;

    text-decoration: line-through;

    text-decoration-style: solid;

    text-decoration-color: var(--black);

    text-decoration-thickness: 3px;

}



.product-actions {

    margin-top: 50px;

    width: 100%;

    position: absolute;

    bottom: -30px;

    opacity: 0;

}



.product-actions .select-content {

    position: relative;

    margin-top: -20px;

}



.product-actions .select-content span {

    text-transform: uppercase;

    font-weight: bold;

    font-size: 0.8em;

    position: absolute;

    padding-left: 10px;

}



.product-actions .select-content select {

    border-radius: 10px 0px 0px 10px;

    height: 45px;

    padding: 0px 5px 0px 12px;

    font-weight: bold;

    max-width: 80px;

    min-width: 60px;

    border: none;

}



.btn-custom-border {

    border-radius: 0px 10px 10px 0px;

    padding-left: 0rem;

    padding-right: 0rem;

    height: 46px;

    position: relative;

    top: 5px;

}



.size-alert {

    position: absolute;

    top: -27px;

    width: 100%;

    text-align: center;

    left: 0px;

    background: #000;

    padding: 5px;

    border-radius: 10px 10px 0px 0px;

    font-size: 12px;

    color: #fff;

    display: none;

}



.size-alert-card {

    position: absolute;

    top: -26px;

    width: 100%;

    text-align: center;

    left: 0px;

    background: #000;

    padding: 5px;

    border-radius: 10px 10px 0px 0px;

    font-size: 12px;

    color: #fff;

    display: none;

    text-transform: uppercase;

}



.product-card .success-cart-add {

    position: absolute;

    top: 0px;

    left: 0px;

    width: 100%;

    height: 100%;

    z-index: 10;

    background-color: rgba(184, 156, 95, 0.8);

    color: #fff;

    padding: 140px 30px;

    text-align: center;

    border-radius: 10px;

    display: none;

}



.success-cart-add img {

    width: 50%;

    margin-bottom: 20px;

}



.success-cart-add p {

    font-weight: bold;

    font-size: 1.3em;

    padding: 0px 20px;

}



.product-card:hover .product-actions {

    opacity: 1;

    bottom: 0px;

}



.product-card:hover .product-image-wrap {

    height: 300px;

}



.col-md-6 .product-card:hover .product-image-wrap {

    height: 550px;

}



.product-card:hover .product-info {

    padding-bottom: 65px;

}



.product-card .btn-primary {

    height: 46px;

    background-color: var(--grey);

    width: 100%;

}



.product-card .btn-primary:hover {

    background-color: var(--dark);

}



.product-card-colors {

}



.product-card-color-icon {

    width: 20px;

    height: 20px;

    border-radius: 100%;

    text-align: center;

    color: #000;

    position: relative;

    display: block;

    margin-left: 5px;

    background-color: #000;

    text-indent: 110%;

    white-space: nowrap;

    overflow: hidden;

}



.col-md-2 .product-card {

}



.col-md-2 .product-card .discount-badge {

    top: -100px;

    right: 12px;

}



.col-md-2 .product-card .text-end {

    text-align: center !important;

}



.col-md-2 .product-card .product-price {

    font-size: 1.2em;

}



.col-md-2 .product-card .product-badge-wrap {

    left: 12px;

}



.col-md-2 .product-card .product-image-wrap {

    height: 250px;

}



.col-md-2 .product-card .justify-content-end {

    justify-content: center !important;

    margin-top: 10px;

}



.col-md-2 .product-card .btn-primary {

    padding-right: 0px;

    padding-left: 0px;

}



.col-md-2 .product-card .product-actions {

    margin-top: 50px;

    width: 100%;

    position: absolute;

    bottom: 0px;

    opacity: 1;

}



.col-md-2 .product-card .product-info {

    padding-bottom: 35px;

}



.col-md-2 .product-card .product-info-w {

    padding-bottom: 35px;

}



.col-md-2 .product-card:hover .product-info {

    padding-bottom: 35px;

}



.footer-card-wishlist {

    text-align: center;

    background: #ebe8e5;

    color: #4e4b48;

    padding: 8px 20px;

    position: absolute;

    top: 20px;

    left: 20px;

    border-radius: 10px;

}



/* ABOUT US PAGE */

.aboutus-bar-image {

    background-image: url("/themes/brimont/img/trees.jpg");

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    color: var(--white);

    height: 400px;

    text-align: left;

    padding-left: 10%;

}



.aboutus-bar-text {

    padding-top: 230px;

}



.aboutus-bar-text h1,

h2,

h3 {

    font-style: italic;

}



.about-us-btn ion-icon {

    margin-right: 1rem;

}



.about-us-btn .btn-primary {

    margin-right: 2rem;

}



.about-us-first {

    padding-top: 5rem;

}



.about-us-text {

    padding-right: 20%;

    color: var(--black);

    line-height: 1.5;

    font-size: 1rem;

    padding-bottom: 1.5rem;

}



.about-us-card {

    height: 600px;

    padding-top: 0;

    padding-bottom: 0;

    margin-top: -10rem;

}

.image-about-us {

    height: 300px;

    background-image: url("/themes/brimont/img/col1.jpg");

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

}

.about-us-card-text {

    height: 220px;

    padding-top: 10%;

    padding-left: 10%;

    padding-right: 10%;

}



.about-us-card-text p {

    font-size: 1rem;

    color: var(--black);

}



.circle-background {

    height: 1000px;

    width: 1000px;

    background-color: rgba(0, 0, 0, 0.1);

    border-radius: 100%;

    bottom: -50%;

    left: 10%;

    z-index: -1;

    position: absolute;

}



.btn-card-about-us {

    height: 80px;

}



.discovery {

    padding-top: 12rem;

    padding-bottom: 8rem;

    position: relative;

    color: var(--black);

    overflow: hidden;

}

.discovery p {

    line-height: 1.8;

    margin-top: 3rem;

}



.discovery h1 {

    font-style: italic;

}



.discovery-image {

    border-radius: 200px;

    border-top-right-radius: 0;

    border-bottom-right-radius: 0;

    position: relative;

    z-index: 4;

}



.discovery-border {

    border: 3px solid var(--lightbrown);

    border-radius: 200px;

    border-top-right-radius: 0;

    border-bottom-right-radius: 0;

    position: absolute;

    z-index: 4;

    width: 100%;

    height: 100%;

}



.discovery-image img {

    width: 100%;

    height: 100%;

    border-radius: 200px;

    border-top-right-radius: 0;

    border-bottom-right-radius: 0;

    position: absolute;

    top: -5rem;

    right: -2rem;

    z-index: 3;

}

/* FOOTER */



.footer-contact-desk {

    color: var(--white);

    background-color: var(--black);

    padding: 20px 35px;

}



.footer-contact-movil {

    display: none;

}



.footer-contact-movil strong {

    text-transform: uppercase;

}



.footer-contact-desk strong {

    line-height: 1.175;

    font-size: 0.8em;

    text-transform: uppercase;

    margin-bottom: 0px;

}



.footer-contact-desk p {

    margin-bottom: 0;

    font-size: 0.8em;

    line-height: 1.175;

    margin-bottom: 0px;

}



.footer-contact-responsive {

    color: var(--white);

    background-color: var(--black);

    padding: 1.5rem;

    display: none;

}



.footer-contact-responsive .col-md-12 {

    margin-bottom: 2rem;

}



.footer-contact-responsive strong {

    line-height: 1.175;

    margin-bottom: 0.5rem;

    text-transform: uppercase;

}



.footer-contact-responsive p {

    margin-bottom: 0;

    margin-bottom: 0.5rem;

    line-height: 1.175;

}



.footer-logos {

    color: var(--black);

    text-transform: uppercase;

    background-color: transparent;

    padding: 30px 0px 40px 0px;

}



.footer-logos p {

    font-size: 12px;

}



.footer {

    color: var(--dark);

    background-color: var(--lightgrey);

    padding-top: 80px;

    padding-bottom: 40px;

}



.footer-logo {

    width: 150px;

    height: 100%;

    margin-top: -28px;

}



.footer-newsletter {

    padding-left: 25px;

    padding-right: 0px;

    position: relative;

}



.footer-links{

    margin-top: 5px;

}



.coupon-code-newsletter {

    position: absolute;

    height: 100%;

    width: 100%;

    background-color: var(--dark);

    color: #fff;

    text-align: center;

    padding: 40px 20%;

    z-index: -1;

    border-radius: 15px;

    display: none;

}



.coupon-code-newsletter.showCoupon {

    z-index: 2;

    display: block;

}



.coupon-code-newsletter h3 {

    color: #fff !important;

}



.coupon-code-newsletter #couponCodeNews {

    display: inline-block;

    margin-left: auto;

    margin-right: auto;

    padding: 13px 17px;

    border: 2px dashed #fff;

    border-radius: 15px;

}



.newsletter-form {

    border-bottom: 2px solid var(--black);

    justify-content: space-around;

    margin-top: 30px;

    margin-bottom: 30px;

}



.newsletter-form input {

    border: none;

    background-color: transparent;

    color: var(--black);

    width: 100%;

}



.newsletter-form input:focus {

    border: none;

}



.newsletter-form button {

    background-color: transparent;

    color: var(--black);

    border: none;

    font-size: 0.9rem;

    border-radius: 0px;

}



.newsletter-form button:hover {

    background-color: var(--black);

    color: var(--white);

    border: none;

    font-size: 0.9rem;

}



.footer h3 {

    color: var(--black);

    font-style: italic;

    font-weight: normal;

    margin-bottom: 1rem;

}



.footer ul {

    list-style-type: none;

}



.footer li {

    font-size: 0.8em;

    margin: 0.5rem;

    font-weight: 100;

}



.footer .list-title {

    margin-bottom: 1rem;

    font-size: 1em;

    font-weight: bold;

}



.footer p {

    line-height: 2;

}



.footer a {

    font-family: "Epilogue", "Arial", "Helvetica", sans-serif;

    font-weight: 200;

    color: inherit;

    text-decoration: none;

}



.footer a:hover {

    color: var(--lightbrown);

}



#formulario_proveedor .modal-dialog {

    max-width: 1000px;

}



#formulario_proveedor .modal-content {

    background-color: var(--greybone);

}



#formulario_proveedor h6 {

    font-style: normal;

}



.margin-footer {

    margin-left: 4rem;

    margin-right: 4rem;

}



.form-control {

    border: none !important;

    background-color: var(--greybone) !important;

    color: var(--black) !important;

    width: 100% !important;

    border-radius: 0 !important;

    border-bottom: 2px solid var(--black) !important;

}



.form-check {

    display: inline-block !important;

    margin-right: 10px;

}



.vertical-line {

    border-right: 1px solid white;

    margin-left: 1rem;

    margin-right: 1rem;

}



.post-footer {

    padding: 1rem;

    color: var(--white);

    background-color: var(--dark);

}



.post-footer p {

    margin-bottom: 0;

}



.post-footer ion-icon {

    color: var(--white);

    margin-left: 0.3rem;

    margin-right: 0.7rem;

}



.postfooter-responsive {

    display: none;

}



.profile-info {

    margin-top: 20px;

    margin-bottom: -20px;

    padding: 60px 0px;

}



.profile-info p {

    margin-bottom: 0px;

}



.profile-info h1 {

    margin-top: -10px;

    margin-bottom: 40px;

}



.nav-user {

    padding-right: 25%;

}



.nav-user li a {

    padding: 10px 0px;

    display: block;

    border-bottom: 1px solid var(--dark);

}



/* Estilos Hover de tarjetas */

.category-nav .has-menu-card ion-icon {

    font-size: 0.7em;

    opacity: 1;

}



.category-nav .has-menu-card .menu-card {

    position: absolute;

    width: calc(55vw - 120px);

    right: 9%;

    top: 60px;

    transform: scale(1, 0);

    transform-origin: 0 0;

    -webkit-transition: all 0.3s ease-in-out;

    -moz-transition: all 0.3s ease-in-out;

    -ms-transition: all 0.3s ease-in-out;

    -o-transition: all 0.3s ease-in-out;

    transition: all 0.3s ease-in-out;

    opacity: 0;

    margin-top: 10px;

    margin-left: 15px;



    background: var(--white);

    overflow: hidden;

    border-radius: 10px;

    box-shadow: rgb(137 139 142 / 15%) 0px 30px 70px 0px;

}



.category-nav .has-menu-card:hover .menu-card {

    opacity: 1;

    visibility: visible;

    transform: scale(1);

}



.sub-a {

    text-transform: uppercase;

    font-weight: bold;

}



.son-a {

}



/* --- Card Categories ---- */

.card-categories {

    width: 100%;

    margin-top: 50px;

}



.card-categories a {

    color: #000000;

}



@supports (object-fit: cover) {

    .card-categories-image img {

        height: 100%;

        width: 100%;

        object-fit: cover;

        object-position: center center;

    }

}



.card-categories-list {

    width: calc(70vw - 300px);

    padding: 10px 20px;

}



.card-categories .card-categories-image {

    height: 30vw;

    position: relative;

    width: 45%;

}



.card-categories-image small {

    text-transform: uppercase;

    margin-bottom: 0px;

}



.card-categories-image h4 {

    font-size: 45px;

    margin-bottom: 40px;

    line-height: 0.8;

}



.card-categories-image .btn {

    margin: 0px;

}



/*

.card-categories-image img{

	position: absolute;

	top: 50%;

	left: 50%;

	transform: translate(-50%,-50%);

	z-index: 1;

}

*/



.card-categories-image .card-categories-text {

    position: absolute;

    bottom: 30px;

    left: 30px;

    z-index: 2;

    color: var(--white);

}



/*SEARCHBOX*/

.search-box {

    z-index: 9;

    display: flex;

    align-items: center;

    position: relative;

}



.search-div {

    position: absolute;

    z-index: 9;

    transform: translate(-100%);

    padding: 10px;

    border: none;

}



.search-div.open {

    background-color: var(--greybone);

    border: 0px solid var(--black);

}



.search-div2 {

    position: absolute;

    z-index: 9;

    transform: translate(-100%);

    padding: 0px;

    margin-left: 36px;

    height: 50px;

}



.search-div2.open {

    background: var(--greybone);

    border: 0px solid var(--black);

}



.search-reset {

    display: none;

}



.search-div.open .search-reset {

    display: block;

    background-color: transparent;

    border: none;

    text-decoration: none;

}



.search-div2.open .search-reset {

    display: block;

    background-color: transparent;

    border: none;

    text-decoration: none;

}



#search-bar {

    border: 1px solid;

    border-color: var(--black);

    background-color: transparent;

    width: 0;

    opacity: 0;

}



#search-bar2 {

    border: 1px solid;

    border-color: var(--black);

    background-color: transparent;

    width: 0;

    opacity: 0;

}



#search-box2{

    margin-right: 30px;

}



#search-bar:focus {

    outline: none !important;

}



#search-bar.open {

    border: none;

    background-color: var(--greybone);

    color: var(--black);

    width: 45vw;

    opacity: 1;

}



#search-bar2.open {

    border: none;

    background-color: var(--greybone);

    color: var(--black);

    width: 60vw;

    opacity: 1;

}



#search-bartwo {

    border: 1px solid;

    border-color: var(--black);

    background-color: transparent;

    width: 0;

    opacity: 0;

}



#search-bartwo:focus {

    outline: none !important;

}



#search-bartwo.open {

    border: none;

    background-color: transparent;

    color: var(--black);

    width: 45vw;

    background-color: transparent;

    opacity: 1;

}



/*

.search-form .search-bar::-webkit-search-cancel-button {

    -webkit-appearance: searchfield-cancel-button;

}



.search-form .search-bar:hover {

    cursor: pointer;

    background: #dad2cbb6;

}



.search-form .search-bar:hover:focus {

    cursor: text;

}



.search-form .search-bar:hover + span {

    background: rgba(255, 255, 255, 0.2);

}



.search-form .search-bar:focus {

    width: 55vw;

    background-color: var(--lightgrey);

    color: var(--dark);

    padding: 10px 10px;

}



.search-form .search-bar:focus + span::before {

    width: 2px;

    opacity: 0;

    transition: all 0.25s ease-in;

}



.search-form .search-bar + span {

    z-index: -1;

    position: absolute;

    border: 1px solid var(--black);

    top: 0;

    width: 20px;

    height: 20px;

    transition: all 0.25s ease-in 0.25s;

    border-radius: 20px;

    left: 0;

}



.search-form .search-bar + span::before {

    transition: all 0.25s ease-in 0.5s;

    transform-origin: left top;

    content: "";

    position: absolute;

    width: 10px;

    height: 5px;

    border-radius: 5px;

    background: var(--black);

    transform: rotate(45deg) translate(22px, -2px);

}

*/

#search-c {

    position: fixed;

    z-index: 15;

    top: 0;

    left: 0;

    right: 0;

    padding-top: 15vh;

    opacity: 0;

}

#search-c.open {

    background-color: var(--lightgrey);

    opacity: 1;

}



/*SEARCHBOX*/



@media (max-width: 1400px) {

    .logo {

        width: 120px;

    }



    #search-bar.open {

        width: 60vw;

    }



    #search-bartwo.open {

        width: 60vw;

    }

}



@media (max-width: 960px) {

    /*Display responsive*/

    .d-responsive-view {

        display: block;

    }

    .d-responsive-none {

        display: none;

    }



    .container {

        overflow: hidden;

    }



    /* -- MODAL -- */

    .floating-popup{

        width: 400px;

    }



    /* --- Navbar --- */

    .werkn-admin-bar ul {

        padding-left: 10px;

    }



    .werkn-admin-bar ul li {

        padding: 0 10px;

    }



    .header-desk {

        display: none;

    }

    .desktop-banner {

        display: none;

    }

    .responsive-banner {

        display: block;

    }



    .swiper-pagination-progressbar {

        display: none;

    }



    .scroll-menu {

        display: none !important;

    }



    body {

        overflow-x: hidden !important;

    }



    .sidebar-wrapper-cart{

        display: none;

    }



    /*FILTERS WRAP*/

    .filters-wrap {

        padding-left: 0.8rem;

        padding-right: 0.8rem;

    }

    .filters-wrap .btn-primary-outline {

        padding-left: 1rem;

        padding-right: 1rem;

        padding-top: 1.2em;

        padding-bottom: 0.2em;

    }



    /*FOOTER*/

    .margin-footer {

        margin-left: 1.5rem;

        margin-right: 1.5rem;

    }



    .footer {

        text-align: center;

    }



    .footer .d-flex {

        flex-direction: column;

        align-items: center;

    }



    .footer-logo {

        margin-bottom: 25px;

    }



    .newsletter-form {

        flex-direction: initial !important;

    }



    .footer ul {

        text-align: left;

        margin-left: 0;

        padding-left: 0;

    }



    .footer-contact-responsive {

        display: block;

    }



    .footer-newsletter {

        padding-left: 0;

    }



    .footer-contact-desk {

        display: none;

    }



    .footer-contact-movil {

        color: var(--white);

        background-color: var(--black);

        display: block;

    }



    .newsletter button {

        background-color: transparent;

        color: var(--black);

        border: none;

        font-size: 0.8rem;

    }



    .postfooter-responsive {

        text-align: center;

        display: block;

    }



    .postfooter-responsive .col-12 {

        margin-top: 3rem;

    }



    .footer-logos {

        margin-left: 1rem;

        margin-right: 1rem;

    }



    .margin-top-for-header {

        margin-top: 5rem;

    }



    .auth {

        margin-top: 4rem;

        margin-left: 1rem;

    }



    .auth .forms {

        margin-top: 3rem;

    }



    #sidebar-wrapper-catalog {

        position: fixed;

        z-index: 3000;

        width: 85%;

        transition: all 0.5s ease;

        left: -85%;

        background: #fff;

        display: flex;

        flex-direction: column;

        height: 100%;

    }



    .sidebar-overlay-catalog {

        background: rgba(0, 0, 0, 0.3);

        z-index: -1;

        position: fixed;

        width: 100%;

        height: 150%;

        opacity: 0;

        transition: opacity 0.5s ease;

        transform: translate3d(-260px, 0, 0);

    }



    .product-card .card-product-buttons {

        display: flex;

        opacity: 1;

        bottom: -10px;

        transition: 2s;

        pointer-events: all;

    }



    .product-card {

        padding-bottom: 2rem;

    }



    /*Recomendado*/

    .recSwiper{

        height: 500px;

    }

    .recSwiper .swiper-wrapper{

        padding-left: 0px;

    }



    .recomendation-row .discount-badge{

        top: 0px;

        right: 0px;

    }



    .recSwiper .swiper-button-next,

    .swiper-button-prev{

        top: 90%;

    }

    .recomendation-product img{

        width: 100%;

        height: auto;

    }



    .recomendation-product {

        margin-right: 60px !important;

        width: 130px !important;

    }



    .swiper-button-lock{

        display: block;

    }



    .recomendation-row .rec-card{

        flex-direction: column;

    }



    .recomendation-row .col-9, .col-7{

        width: 100%;

    }



    .card-info {

        height: 150px;

    }



    .rec-text {

        height: 170px;

    }



    /*Responsive*/

    .nav-mobile {

        display: block;

    }



    .post-footer ion-icon {

        color: var(--white);

        margin-left: 1rem;

        margin-right: 1rem;

    }



    .service-box {

        margin: 30px 0px;

    }



    .collections .collection-1,

    .collections .collection-2,

    .collections .collection-3,

    .collections .collection-4,

    .collections .collection-5,

    .collections .collection-6 {

        height: 400px;

    }



    .product-card {

        margin-bottom: 40px;

    }



    .best-seller-text {

        text-align: start;

        padding-left: 0;

        padding-right: 0;

    }



    .best-seller-text p {

        padding-right: 0;

        padding-left: 0;

    }



    .best-seller-text .border-right {

        border-color: transparent;

    }



    .col-6 .product-card .discount-badge {

        top: -100px;

        right: 12px;

    }



    .col-6 .product-card .text-end {

        text-align: center !important;

    }



    .col-6 .product-card .product-price {

        font-size: 1.2em;

    }



    .col-6 .product-card .product-badge-wrap {

        left: 12px;

    }



    .col-6 .product-card .product-image-wrap {

        height: 250px;

    }



    .col-6 .product-card .product-image-wrap-2 {

        height: 250px;

    }



    .col-6 .product-card .justify-content-end {

        justify-content: center !important;

        margin-top: 10px;

    }



    .col-6 .product-card .btn-primary {

        padding-right: 0px;

        padding-left: 0px;

    }



    .col-6 .product-card .product-actions {

        margin-top: 50px;

        width: 100%;

        position: absolute;

        bottom: 0px;

        opacity: 1;

    }



    .col-6 .product-card .product-info {

        padding-bottom: 35px;

    }



    .col-6 .product-card .product-info-w {

        padding-bottom: 35px;

    }



    .col-6 .product-card:hover .product-info {

        padding-bottom: 35px;

    }



    .breadcrumb-nav {

        display: none !important;

    }



    .reviews-cards {

        padding-left: initial;

    }



    .product-detail-nav-wrap {

        width: 65px;

        flex: 0 0 100px;

        height: 300px;

    }



    .product-detail-nav-wrap{

        height: 400px;

    }



    .product-details-content {

        padding: 0px;

        margin-top: 40px;

    }



    .new-findings-text p {

        margin-right: 0;

    }



    .new-findings .button-wrapper-new-f {

        flex-direction: column;

        align-items: flex-start !important;

    }



    .new-findings .btn-primary-outline {

        margin-top: 1rem;

        padding-left: 3rem;

        padding-right: 3rem;

    }



    .footer-links{

        margin-top: 80px;

    }



    /*DETAIL*/

    .discount-badge{

        width: 60px;

        height: 60px;

    }



    .product-detail-img-wrap{

        padding-right: 15px;

        height: 450px;

    }



    .product-detail-img-wrap .discount-badge{

        top: 10px;

        right: 0px;

    }



    .product-detail-img img {

        width: auto;

        height: 560px;

        position: relative;

        top: -55px;

        left: -65px;

    }



    .discount-badge span{

        font-size: 20px;

    }



    .discount-badge small{

        font-size: 8px;

    }



    .filters-wrap.fixit{

        top: 60px !important;

    }



    /*CART*/

    .cart_info {

        flex-direction: column-reverse;

    }



    .product-detail{

        padding-top: 0px !important;

    }



    .product-detail-img, .product-detail-img a{

        height: 400px;

    }



    .product-detail-img img{

        height: auto;

        top: 0px;

        left: 50%;

        width: 130%;

        transform: translateX(-50%);

    }

}



.order-card-info h6 {

    font-size: initial;

}

@media (max-width: 768px) {
  
}



@media (max-width: 960px) {
    .desktop-banner {
        display: none !important;
    }

    .responsive-banner {
        display: block !important;
        position: relative;
        margin-top: 0;
    }

    .responsive-banner .index-product-banner {
        position: relative;
        overflow: hidden;
    }

    .responsive-banner .swiper-slide {
        position: relative;
    }

    .responsive-banner .main-img,
    .responsive-banner iframe {
        width: 100%;
        height: 78vw;
        object-fit: cover;
        display: block;
    }

    .responsive-banner .responsive-banner-text {
        position: absolute;
        left: 7%;
        right: 7%;
        top: 50%;
        transform: translateY(-50%);
        z-index: 4;
        margin: 0 !important;
    }

    .responsive-banner .responsive-banner-text h1 {
        font-size: 10vw;
        line-height: .95;
        margin-bottom: 3vw;
    }

    .responsive-banner .responsive-banner-text p {
        font-size: 3.2vw;
        line-height: 1.5;
        margin-bottom: 4vw;
    }

    .responsive-banner .btn-banner {
        margin-top: 0;
        padding: 3.4vw 7vw;
        font-size: 3vw;
        border-radius: 2vw;
        min-width: 52vw;
        text-align: center;
    }

    /* reinicio total de flechas solo en banner responsive */
    .responsive-banner .swiper-button-next,
    .responsive-banner .swiper-button-prev {
        left: auto;
        top: auto;
        bottom: 5vw;
        transform: none !important;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0;
    }

    .responsive-banner .swiper-button-next {
        right: 6vw;
        width: 14vw;
        height: 14vw;
        background: rgba(255,255,255,.95);
        border: none;
    }

    .responsive-banner .swiper-button-prev {
        right: 23vw;
        width: 10vw;
        height: 10vw;
        background: rgba(255,255,255,.75);
        border: none;
    }

    .responsive-banner .swiper-button-next p,
    .responsive-banner .swiper-button-prev p {
        display: none;
    }

    .responsive-banner .swiper-button-next ion-icon,
    .responsive-banner .swiper-button-prev ion-icon {
        position: static;
        transform: none !important;
        font-size: 5vw;
        color: #000;
    }

    .responsive-banner .swiper-button-next:after,
    .responsive-banner .swiper-button-prev:after {
        content: "";
    }
}

/* ===========================
   MOBILE / TABLET
=========================== */
@media (max-width: 960px) {
    .desktop-banner {
        display: none;
    }

    .responsive-banner {
        display: block;
        position: relative;
        margin-top: 0;
    }

    .responsive-banner .index-product-banner {
        position: relative;
        overflow: hidden;
    }

    .responsive-banner .swiper-slide {
        position: relative;
    }

    .responsive-banner .main-img,
    .responsive-banner iframe {
        width: 100%;
        height: 95vw;
        object-fit: cover;
        display: block;
    }

    .responsive-banner .swiper-slide::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 1;
        pointer-events: none;
        background: linear-gradient(
            180deg,
            rgba(255,255,255,.32) 0%,
            rgba(255,255,255,.10) 18%,
            rgba(0,0,0,.08) 60%,
            rgba(0,0,0,.18) 100%
        );
    }

    .responsive-banner .responsive-banner-text {
        position: absolute;
        left: 8vw;
        right: 8vw;
        bottom: 14vw;
        z-index: 3;
        margin: 0 !important;
        text-align: left;
    }

    .responsive-banner .responsive-banner-text h1 {
        font-size: 10vw;
        line-height: .95;
        letter-spacing: -.25vw;
        margin-bottom: 3vw;
    }

    .responsive-banner .responsive-banner-text p {
        font-size: 3.4vw;
        line-height: 1.55;
        margin-bottom: 5vw;
    }

    .responsive-banner .btn-banner {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 58vw;
        min-height: 11vw;
        padding: 0 6vw;
        border-radius: 2.6vw;
        font-size: 3.2vw;
        margin-top: 0;
    }

    .responsive-banner .swiper-button-next,
    .responsive-banner .swiper-button-prev {
        top: auto;
        bottom: 5vw;
        transform: none;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        backdrop-filter: blur(1.2vw);
    }

    .responsive-banner .swiper-button-next {
        right: 6vw;
        left: auto;
        width: 14vw;
        height: 14vw;
        background: rgba(255,255,255,.92);
        border: none;
    }

    .responsive-banner .swiper-button-prev {
        right: 23vw;
        left: auto;
        width: 10vw;
        height: 10vw;
        background: rgba(255,255,255,.75);
        border: none;
    }

    .responsive-banner .swiper-button-next:after,
    .responsive-banner .swiper-button-prev:after {
        content: "";
    }

    .responsive-banner .swiper-button-next p,
    .responsive-banner .swiper-button-prev p {
        display: none;
    }

    .responsive-banner .swiper-button-next ion-icon,
    .responsive-banner .swiper-button-prev ion-icon {
        position: static;
        transform: none;
        font-size: 6vw;
        color: #000;
    }

    .swiper-pagination-progressbar {
        display: none;
    }
    
}