/*-----------------------------------*\
  #style.css
\*-----------------------------------*/

/**
 * copyright 2022 @codewithsadee 
 */

/*-----------------------------------*\
  #CUSTOM PROPERTY
\*-----------------------------------*/
@font-face {
    font-family: "abel";
    src: url("../fonts/Abel-Regular.ttf");
}

:root {
    /**
   * colors
   */

    --spanish-gray: hsl(0, 0%, 60%);
    --sonic-silver: hsl(0, 0%, 47%);
    --eerie-black: hsl(0, 0%, 13%);
    --salmon-pink: #df0209;
    --sandy-brown: hsl(29, 90%, 65%);
    --bittersweet: #df0209;
    --ocean-green: hsl(152, 51%, 52%);
    --davys-gray: hsl(0, 0%, 33%);
    --cultured: hsl(0, 0%, 93%);
    --white: hsl(0, 100%, 100%);
    --onyx: hsl(0, 0%, 27%);

    /**
   * typography
   */

    --fs-1: 1.563rem;
    --fs-2: 1.375rem;
    --fs-3: 1.25rem;
    --fs-4: 1.125rem;
    --fs-5: 1rem;
    --fs-6: 0.938rem;
    --fs-7: 0.875rem;
    --fs-8: 0.813rem;
    --fs-9: 0.75rem;
    --fs-10: 0.688rem;
    --fs-11: 0.625rem;

    --weight-300: 300;
    --weight-400: 400;
    --weight-500: 500;
    --weight-600: 600;
    --weight-700: 700;

    /**
   * border-radius
   */

    --border-radius-md: 10px;
    --border-radius-sm: 5px;

    /**
   * transition 
   */

    --transition-timing: 0.2s ease;
}

/*-----------------------------------*\
  #RESET
\*-----------------------------------*/

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

a {
    text-decoration: none;
}

li {
    list-style: none;
}

button {
    background: none;
    font: inherit;
    border: none;
    cursor: pointer;
}

img,
ion-icon,
button,
a {
    display: block;
}

span {
    display: inline-block;
}

html {
    /* font-family: 'Josefin Sans', sans-serif; */
    font-family: "abel";

    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
}

input {
    display: block;
    width: 100%;
    font: inherit;
}

input::-webkit-input-placeholder {
    font: inherit;
}

input::-moz-placeholder {
    font: inherit;
}

input:-ms-input-placeholder {
    font: inherit;
}

input::-ms-input-placeholder {
    font: inherit;
}

input::placeholder {
    font: inherit;
}

body {
    background: var(--white);
    font-size: 20px;
}

/**
 * scrollbar style
 */

body::-webkit-scrollbar {
    width: 15px;
}

body::-webkit-scrollbar-track {
    background: var(--white);
    border-left: 1px solid var(--cultured);
}

body::-webkit-scrollbar-thumb {
    background: hsl(0, 0%, 80%);
    border: 3px solid var(--white);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

body::-webkit-scrollbar-thumb:hover {
    background: hsl(0, 0%, 70%);
}

.banner-section .flecha-izquierda,
.banner-section .flecha-derecha{
    position: absolute;
    top: 50%;
    font-size: 3.5rem;
    z-index: 100;
    transform: translateY(-50%);
    cursor: pointer;
    color: #fff;
    font-weight:bold;
}
.banner-section .flecha-derecha{
    right: 1rem;
}
.banner-section .flecha-izquierda{
    position: absolute;
    left: 1rem;
}
.banner-section {
    /* width: 100%;
    height: 80vh;
    position: relative; */
    /* .home { */
    background-color: #f8f7ef;
    max-width: 100%;
    width: 100%;
    position: relative;
    padding-left: 0;
    padding-right: 0;
    margin-top: 7rem;
    margin-bottom: 3rem;
    /* } */
}
.img_banner {
    /* height: 68vh; */
    position: relative;
    text-align: center;
    /* margin: 0 7rem; */
}
.banner__escritorio{
    display: block !important;
}
.banner__movil{
    display: none !important;
}
.link-nosotros-a {
    color: #72718f;
}
.link-nosotros-a:hover {
    text-decoration: underline;
}
.img_banner img {
    width: 100%;
    max-height: 100vh;
    height: inherit;
    cursor: pointer;
    vertical-align: top;
    transition: 2s;
    animation: fadeIn;
    animation-duration: 1s;
}
.banner-section .dirreciones {
    position: absolute;
    bottom: -1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 50%;
    transform: translateX(-50%);
    gap: 1rem;
}
.banner-section .dirreciones span.active-arrow {
    background-color: #b33334;
}
.banner-section .dirreciones span {
    transform: rotate(45deg);
    cursor: pointer;
    border: 1px solid #b33334;
    width: 10px;
    height: 10px;
}
.banner-inicio {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}
.banner-inicio .content-textbanner button {
    margin: 0.5rem 0;
}
.banner-inicio .content-textbanner h2 {
    font-size: 1.5rem;
}
.banner-inicio .content-textbanner {
    width: 30rem;
    margin-left: -5rem;
}

.ul-modal .li-modal i {
    font-size: 2rem;
    vertical-align: middle;
}

/* .text-modalh .enlace-ul{
    width: 9rem;
} */
.text-modalh {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.ul-modal .li-modal .ul-modal-2 .article-header article img {
    width: 100%;
    height: auto;
    /* object-fit: cover; */
}
.ul-modal .li-modal .ul-modal-2 .article-header article a {
    font-weight: 600;
    margin: 0.7rem 0;
    color: #e3403e;
    font-size: 1rem;
}
.ul-modal .li-modal .ul-modal-2 .article-header article {
    padding: 1.5rem;
    width: 13rem;
    border-radius: 20px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    cursor: pointer;
    border: 2px solid #e3403e;
    text-align: center;
}
.ul-modal .li-modal .ul-modal-2 .article-header article:hover {
    border: 4px solid #e3403e;
    box-shadow: 0px 10px 19px 0px rgba(0, 0, 0, 0.4);
}
.ul-modal .li-modal .ul-modal-2 .article-header {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    padding: 1rem 6%;
    background-color: #fff;
    width: 100%;
    gap: 3rem;
    box-shadow: 0px 10px 19px 0px rgba(0, 0, 0, 0.4);
}
.ul-modal .li-modal .ul-modal-2 .botones-modal button {
    margin-right: 0.6rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.ul-modal .li-modal .ul-modal-2 .botones-modal {
    /* margin-top: 1rem; */
    background-color: #fff;
    padding: 0 6%;
}
.ul-modal .li-modal .ul-modal-2.li-visible {
    visibility: visible;
    opacity: 1;
    display: block;
    animation: fadeIn;
    animation-duration: 1s;
}

.ul-modal .li-modal .ul-modal-2 {
    background-color: transparent;
    position: absolute;
    width: 100%;
    left: 0;
    z-index: 10;
    transition: 0.1s ease all;
    visibility: hidden;
    opacity: 0;
}

.ul-modal .li-modal {
    list-style: none;
    /* position: relative; */
}

.filtros__categorias {
    width: 100%;
    justify-content: flex-start;
    align-items: center;
    position: fixed;
    left: 0;
    top: 4.8rem;
    padding: 0.5rem 1rem;
    font-size: 1.3rem;
    z-index: 100;
    color: #fff;
    display: none;
    background-color: #dd232a;
}
.header-principal {
    width: 100%;
    z-index: 1000;
    position: fixed;
    top: 2rem;
    display: flex;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.518);
    font-family: "abel";
    align-items: center;
    padding: 1rem 3%;
    background-color: #e3403e;
    color: #eae1e1;
}
#cart__header {
    position: relative;
}
#cart__header #countCarrito {
    position: absolute;
    right: -4px;
    top: -12px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: white;
    color: #000;
    font-size: 0.8rem;
    font-weight: bold;
    display: grid;
    font-family: 'Abel', sans-serif;
    place-items: center;
}
.header-principal img {
    width: 9rem;
    margin-right: 2rem;
}
.header-principal img:hover {
    animation: pulse;
  animation-duration: 1s;
}
.header-principal h2 {
    margin-right: 2rem;
}
.header-principal nav {
    /* width: 55rem; */
    width: 90%;
    display: flex;
    justify-content: space-between;
    /* justify-content: center; */
    align-items: center;
    gap: 2rem;
}
.header-principal ion-icon {
    font-size: 2.5rem;
    cursor: pointer;
    display: none;
}
.header-principal nav .enlaces-header a {
    color: white;
    font-weight: 650;
}
.header-principal nav .enlaces-header a:hover {
    text-decoration: underline;
}
.header-principal nav .enlaces-header ion-icon {
    cursor: pointer;
    font-size: 2.5rem;
    display: none;
}
.header-principal nav .enlaces-header {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: center;
}
.header-principal nav .si-header i {
    position: absolute;
    right: 0;
    width: 2rem;
    height: 100%;
    color: #eae1e1;
    padding-top: 0.2rem;
    text-align: center;
    font-size: 1.5rem;
    vertical-align: middle;
    background-color: #dd232a;
}
.header-principal nav .si-header {
    display: flex;
    /* width: 27rem; */
    width: 21rem;
    height: 2rem;
    border: 2px solid #fff;
    position: relative;
}
.header-principal nav .si-header select {
    width: 30%;
    height: 100%;
    border: none;
    outline: none;
    color: #fff;
    font-size: 1rem;
    padding: 0 0.3rem;
    background-color: transparent;
}
.header-principal nav .si-header input[type="text"] {
    /* width: 70%; */
    width: 90%;
    height: 100%;
    border: none;
    outline: none;
    background-color: #fff;
    padding: 0.6rem 1rem;
}
.header-principal .iconos-header {
    width: 8rem;
    display: flex;
    gap: .2rem;
    justify-content: flex-end;
}
.header-principal .iconos-header i {
    font-size: 1.5rem;
}

/* formulario */
.section-form {
    /* padding-top: 5rem;
    padding-bottom: 3rem; */
    margin: 2rem auto;
}
.section-form .contenedor-sform {
    width: 70%;
    margin: auto;
    padding: 2rem;
    border-radius: 15px;
    background-color: #eee;
    /* box-shadow: 1px 1px 39px 0px rgba(0, 0, 0, 0.15); */
}
.section-form .contenedor-sform form {
    margin-top: 2rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.section-form .contenedor-sform form div label{
    color: #1a0b5b;
}
.section-form .contenedor-sform form div input[type="text"],
.section-form .contenedor-sform form div textarea {
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    height: 2.5rem;
    border: none;
    outline: none;
    border-radius: 12px;
    background-color: #fff;
    padding: 0 0.5rem;
    resize: none;
    width: 100%;
    font-family: "abel";
    font-size: 17px;
}
.section-form .contenedor-sform form div textarea {
    height: 5rem;
}
.section-form .contenedor-sform form div:nth-child(1),
.section-form .contenedor-sform form div:nth-child(2) {
    width: 47%;
}
.section-form .contenedor-sform form div:nth-child(3),
.section-form .contenedor-sform form div:nth-child(4) {
    width: 100%;
}
.section-form .contenedor-sform form div:nth-child(5) {
    width: 100%;
}

/* section equipo */
.section-equipo {
    padding: 2.5rem 0 !important;
    width: 100%;
    position: relative;
    padding-bottom: 0.4rem !important;
}
.section-equipo #left-asesor,
.section-equipo #right-asesor {
    position: absolute;
    top: 50%;
    font-size: 4rem;
    cursor: pointer;
    color: #1a0b5b;
    transform: translateY(50%);
}
.section-equipo #left-asesor {
    left: -10px;
}
.section-equipo #right-asesor {
    right: -10px;
}
.section-equipo .pagination-equipo {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: 1rem;
}
.section-equipo .pagination-equipo button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.section-equipo .pagination-equipo button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.section-equipo .contenedor-team {
    width: 90%;
    margin: 1rem auto;
    display: flex;
    align-items: center;
    gap: 2rem;
    margin-top: -1.5rem;
    overflow: auto;
    height: 22rem;
    scroll-behavior: smooth;
}
.section-equipo .contenedor-team::-webkit-scrollbar {
    background-color: transparent;
}
.section-equipo .contenedor-team article {
    min-width: calc(25% - 1.5rem);
    width: calc(25% - 1.5rem);
    height: 15.5rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background-color: #f7f7f7;
    position: relative;
    border-radius: 20px;
}
.section-equipo .contenedor-team article:hover button {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.518);
    animation: pulse;
    animation-duration: 1s;
    background-color: #03d160;
}
.section-equipo .contenedor-team article img {
    width: 71%;
}
.section-equipo .contenedor-team article button {
    padding: 0.4rem 1rem;
    background-color: #02be57;
    color: white;
    margin-top: 0.5rem;
    position: absolute;
    bottom: -2rem;
    border-radius: 20px;
}
.section-equipo .contenedor-team article button:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.518);
    animation: pulse;
    animation-duration: 1s;
    background-color: #03d160;
}

/* tesstimonios */
.section-testimonios {
    padding: 2.5rem 0 !important;
    width: 100%;
    position: relative;
}
.jquery-modal {
    z-index: 10000000 !important;
    max-height: 100vh !important;
    height: 100vh !important;
    display: flex;
    justify-content: center;
    align-items: center;
}
.section-testimonios #right-testimonio,
.section-testimonios #left-testimonio {
    position: absolute;
    font-size: 4rem;
    top: 50%;
    z-index: 100;
    cursor: pointer;
    color: #1a0b5b;
    display: none;
}
.section-testimonios .pagination-testimonios {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: -1rem;
}
.section-testimonios .pagination-testimonios button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.section-testimonios .pagination-testimonios button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.section-testimonios #left-testimonio {
    left: 20px;
}
.section-testimonios #right-testimonio {
    right: 20px;
}
.section-testimonios .contenedor-testimonios::-webkit-scrollbar {
    background-color: transparent;
}
.section-testimonios .contenedor-testimonios {
    margin: 1rem auto;
    display: flex;
    width: 90%;
    align-items: center;
    gap: 2rem;
    overflow: auto;
    scroll-behavior: smooth;
}
.section-testimonios .contenedor-testimonios article {
    min-width: calc(34.4% - 2rem);
    width: calc(34.4% - 2rem);
    text-align: center;
    display: flex;
    /* border: 1px solid #dd232a; */
    border-radius: 10px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1rem;
}
.section-testimonios .contenedor-testimonios article img {
    width: 7rem;
    height: 7rem;
    border-radius: 50%;
}
.section-testimonios .contenedor-testimonios article h2 {
    margin: 0.5rem 0;
    font-size: 1.3rem;
    color: #1a0b5b;
}
.section-testimonios .contenedor-testimonios article i {
    font-size: 2.1rem;
    color: #dd232a;
}
.section-testimonios .contenedor-testimonios article p {
    margin: 0.5rem 9;
    font-size: 1rem;
    color: #72718f !important;
}
.section-testimonios .contenedor-testimonios article .name-test{
    color: #1a0b5b !important;
}

.imagen-section {
    width: 100%;
    height: 12rem;
    display: grid;
    place-items: center;
    background-image: linear-gradient(to top, #000000ae 0%, #00000074 100%),
        url(https://rab-import-assets.s3.amazonaws.com/kaizen/nosotros/banner-vistas.jpg);
    color: #fff;
    font-size: 1.5rem;
    margin-top: 6rem;
}

/* boton de inicio */
.form-modal {
    position: fixed;
    z-index: 1060;
    bottom: 0rem;
    right: 0%;
    height: 34.5rem;
    max-height: 55rem;
    overflow: auto;
    width: 20rem;
    border-radius: 10px;
    background-color: #fff;
    border: 2px solid #e63b40;
    padding: 2rem;
    transition: 0.3s ease all;
    /* transform: translate(-120%, -50%); */
    transform: translateY(120%);
}
.form-modal.form-visible {
    transform: translateY(0%);
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.518);
}
.form-modal #close-form {
    position: absolute;
    top: 1rem;
    right: 1rem;
    font-size: 2rem;
    cursor: pointer;
}
.form-modal h3 {
    font-size: 1.2rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-weight: 600;
}
/* .form-modal p{
    font-size: 1.5rem;
} */
.form-modal .content__text {
    margin-top: .5rem;
}
.form-modal label {
    font-size: 1rem;
    color: #1a0b5b;
}
.form-modal input[type="text"] {
    width: 100%;
    height: 2rem;
    border: 1px solid #dcdcdc;
    outline: none;
    background-color: #fff;
    border-radius: 12px;
    padding: 0.2rem 0.4rem;
}
.form-modal button ion-icon {
    vertical-align: middle;
}
.form-modal button {
    /* width: 100%; */
    display: flex;
    margin: 1rem auto;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    text-align: center;
}
.form-modal textarea {
    padding: 0.2rem 0.4rem;
    width: 100%;
    height: 3rem;
    border: 1px solid #dcdcdc;
    outline: none;
    border-radius: 10px;
    resize: none;
    font-family: 'abel';
    font-size: 20px;
}

.btn-fixed i{
    font-size: 2rem;
    color: #e3403e;
}
.btn-fixed {
    cursor: pointer;
    position: fixed;
    z-index: 500;
    bottom: 5%;
    right: 5%;
    background-color: #fcf3f3;
    padding: 0.5rem;
    border-radius: 10px;
    color: #000;
    font-size: 1rem;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.518);
    width: 7rem;
    height: 7rem;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.btn-fixed:hover {
    animation: heartBeat;
    animation-duration: 1s;
}

/* whatsatt */

.bottomright {
    position: fixed;
    bottom: 20px;
    left: 75px;
    font-size: 18px;
    z-index: 100;
    width: 80px;
    height: 80px;
    /* border-radius: 100px;
    background-image: url(../images/whatsapp-icon.png);
    background-repeat: no-repeat;
    background-size: 80px 80px;
    background-position: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.75); */
}

.circlephone {
    text-rendering: optimizelegibility;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
    cursor: pointer;
    color: inherit;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    border: 2px solid #45ac4b;
    width: 150px;
    height: 150px;
    bottom: -25px;
    right: 10px;
    /* left: 16px; */
    position: absolute;
    border-radius: 100%;
    opacity: 0.5;
    animation: circle-anim 2.4s infinite ease-in-out !important;
    transition: all 0.5s;
    transform-origin: center;
}
.img-circle {
    text-rendering: optimizelegibility;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
    cursor: pointer;
    color: inherit;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    background-color: #45ac4b;
    width: 72px;
    height: 70px;
    bottom: 14px;
    right: 49px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    opacity: 0.9;
    transform-origin: center;
}
@-webkit-keyframes tossing {
    0% {
        -webkit-transform: rotate(-8deg);
    }
    50% {
        -webkit-transform: rotate(8deg);
    }
    100% {
        -webkit-transform: rotate(-8deg);
    }
}
@-moz-keyframes circle-anim {
    0% {
        -moz-transform: rotate(0deg) scale(0.5) skew(1deg);
        opacity: 0.1;
        -moz-opacity: 0.1;
        -webkit-opacity: 0.1;
        -o-opacity: 0.1;
    }
    30% {
        -moz-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.5;
        -moz-opacity: 0.5;
        -webkit-opacity: 0.5;
        -o-opacity: 0.5;
    }
    100% {
        -moz-transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.6;
        -moz-opacity: 0.6;
        -webkit-opacity: 0.6;
        -o-opacity: 0.1;
    }
}
@-webkit-keyframes circle-anim {
    0% {
        -webkit-transform: rotate(0deg) scale(0.5) skew(1deg);
        -webkit-opacity: 0.1;
    }
    30% {
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        -webkit-opacity: 0.5;
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        -webkit-opacity: 0.1;
    }
}
@-o-keyframes circle-anim {
    0% {
        -o-transform: rotate(0deg) kscale(0.5) skew(1deg);
        -o-opacity: 0.1;
    }
    30% {
        -o-transform: rotate(0deg) scale(0.7) skew(1deg);
        -o-opacity: 0.5;
    }
    100% {
        -o-transform: rotate(0deg) scale(1) skew(1deg);
        -o-opacity: 0.1;
    }
}
@keyframes circle-anim {
    0% {
        transform: rotate(0deg) scale(0.5) skew(1deg);
        opacity: 0.1;
    }
    30% {
        transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.5;
    }
    100% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.1;
    }
}
@-moz-keyframes circle-fill-anim {
    0% {
        -moz-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
    50% {
        -moz-transform: rotate(0deg) -moz-scale(1) skew(1deg);
        opacity: 0.2;
    }
    100% {
        -moz-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
}
@-webkit-keyframes circle-fill-anim {
    0% {
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
    50% {
        -webkit-transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.2;
    }
    100% {
        -webkit-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
}
@-o-keyframes circle-fill-anim {
    0% {
        -o-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
    50% {
        -o-transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.2;
    }
    100% {
        -o-transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
}
@keyframes circle-fill-anim {
    0% {
        transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
    50% {
        transform: rotate(0deg) scale(1) skew(1deg);
        opacity: 0.2;
    }
    100% {
        transform: rotate(0deg) scale(0.7) skew(1deg);
        opacity: 0.2;
    }
}
@keyframes pulse {
    0% {
        transform: scale(0.9);
        opacity: 1;
    }
    50% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0.9);
        opacity: 1;
    }
}
@-webkit-keyframes pulse {
    0% {
        -webkit-transform: scale(0.95);
        opacity: 1;
    }
    50% {
        -webkit-transform: scale(1);
        opacity: 1;
    }
    100% {
        -webkit-transform: scale(0.95);
        opacity: 1;
    }
}
@keyframes tossing {
    0% {
        transform: rotate(-8deg);
    }
    50% {
        transform: rotate(8deg);
    }
    100% {
        transform: rotate(-8deg);
    }
}
.img-circleblock {
    text-rendering: optimizelegibility;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
    cursor: pointer;
    color: inherit;
    border: 0;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    -webkit-box-sizing: content-box;
    width: 68px;
    height: 65px;
    background-image: url(https://rab-import-assets.s3.amazonaws.com/whatsapp-icon.png);
    fill: #fff;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    background-repeat: no-repeat;
    -webkit-animation-name: tossing;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    transform-origin: center;
    border-radius: 100%;
}
.circle-fill {
    cursor: pointer;
    color: inherit;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    background-color: #45ac4b;
    width: 100px;
    height: 100px;
    bottom: 0px;
    right: 35px;
    position: absolute;
    border-radius: 100%;
    border: 2px solid transparent;
    animation: circle-fill-anim 2.3s infinite ease-in-out;
    transition: all 0.5s;
    transform-origin: center;
}
#wa_button {
    text-rendering: optimizelegibility;
    -webkit-tap-highlight-color: transparent;
    -webkit-text-size-adjust: none;
    -webkit-font-smoothing: antialiased;
    border: 0;
    font: inherit;
    vertical-align: baseline;
    margin: 0;
    padding: 0;
    outline: 0;
    cursor: pointer;
    text-decoration: none;
    color: inherit;
    bottom: 25px;
    right: 0px;
    position: fixed;
    z-index: 999;
}

/* nosotros */
.container-nosotros {
    width: 100%;
}
.nosotros_tiendas h2{
    text-align: center;
}

.nosotros_tiendas .contenedor_nosotros_tiendas article img {
    width: 100%;
    height: 10.7rem;
    transform: scale(1.15);
    border-radius: 20px;
}
.nosotros_tiendas .contenedor_nosotros_tiendas article .iconos-tiendas {
    margin: 2.5rem 0.4rem;
}
.nosotros_tiendas .contenedor_nosotros_tiendas article .iconos-tiendas p {
    display: flex;
    margin: 1.5rem 0;
    vertical-align: top;
    color: #72718f !important;
    position: relative;
}

.nosotros_tiendas .contenedor_nosotros_tiendas article .iconos-tiendas p ion-icon {
    font-size: 1.4rem !important;
    margin-right: 0.4rem;
    position: absolute;
    left: 0;
    top: -6px;
    vertical-align: top;
    color: #1a0b5b !important;
}
.nosotros_tiendas .contenedor_nosotros_tiendas article .iconos-tiendas p b {
    margin-right: 0.3rem;
    margin-left: 2rem;
    color: #1a0b5b !important;

}
.nosotros_tiendas .contenedor_nosotros_tiendas article #location-tiendas {
    padding: 0.6rem;
    border-radius: 50%;
    color: #dd232a !important;
    font-size: 1.7rem;
    position: absolute;
    background-color: #fcf3f3;
    right: -30px;
    bottom: 45%;
}
.nosotros_tiendas .contenedor_nosotros_tiendas article {
    position: relative;
    width: 17rem;
    height: 24rem;
    border: 2px solid #dd232a;
    border-radius: 20px;
}
.nosotros_tiendas .contenedor_nosotros_tiendas article:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.5);
}
.nosotros_tiendas .contenedor_nosotros_tiendas{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 3rem;
    flex-wrap: wrap;
    gap: 4rem;
}
.nosotros_tiendas{
margin-top: 3rem;
}

.container-nosotros .section-nosotros {
    padding: 3rem 0;
    text-align: justify;
}
.container-nosotros .section-nosotros .article-nosotros {
    display: flex;
    justify-content: center;
    gap: 3rem;
    margin-top: 3rem;
    flex-wrap: wrap;
}
.container-nosotros .section-nosotros .article-nosotros article {
    width: calc(50% - 2rem);
}
.container-nosotros .section-nosotros .article-nosotros .img-nosotros {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 2rem;
}
.container-nosotros
    .section-nosotros
    .article-nosotros
    .img-nosotros
    img:nth-child(2) {
    margin-top: -4rem;
}
.container-nosotros
    .section-nosotros
    .article-nosotros
    .img-nosotros
    iframe {
    margin-bottom: 4rem;
}
.container-nosotros .section-nosotros .article-nosotros .img-nosotros iframe,
.container-nosotros .section-nosotros .article-nosotros .img-nosotros img {
    width: calc(50% - 1rem);
    min-width: calc(50% - 1rem);
    object-fit: cover;
    height: 11rem;
}
.container-nosotros .section-nosotros .article-nosotros .text-nosotros p {
    font-size: 1rem;
    margin: 1rem 0;
    color: #72718f !important;
}
.container-nosotros .section-nosotros .article-nosotros2 h2 {
    font-size: 1.9rem;
}
.container-nosotros .section-nosotros .article-nosotros2 {
    margin-top: 3rem;
    text-align: center;
}
.container-nosotros .section-nosotros .article-nosotros2 .article-div {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
    margin-top: 2rem;
}
.container-nosotros .section-nosotros .article-nosotros2 .article-div article {
    width: 20rem;
    text-align: justify;
    padding: 1rem;
    height: 15rem;
}

.limite_parrafomarca {
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.container-nosotros
    .section-nosotros
    .article-nosotros2
    .article-div
    article:nth-child(1) {
    background-color: #eeeffb;
}
.container-nosotros
    .section-nosotros
    .article-nosotros2
    .article-div
    article:nth-child(3) {
    background-color: #eeeffb;
}
.container-nosotros
    .section-nosotros
    .article-nosotros2
    .article-div
    article:nth-child(2) {
    background-color: #eeeffb;
}
.container-nosotros
    .section-nosotros
    .article-nosotros2
    .article-div
    article
    p {
    color: #72718f !important;
}
.container-nosotros
    .section-nosotros
    .article-nosotros2
    .article-div
    article
    h3 {
    color: #1a0b5b !important;
    font-size: 1.3rem;
    margin-bottom: 1rem;
}

/* serivios 2 */
.section-servicio {
    padding: 2rem 0;
}
.section-servicio .contenedor-servicio {
    margin: 1rem 0;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 3rem;
    padding: 1rem 0;
}
.section-servicio .contenedor-servicio article img {
    width: 100%;
    height: 120px;
    border-radius: 20px;
}
.section-servicio .contenedor-servicio article img:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.35);
    animation: pulse;
    animation-duration: 1s;
}
.section-servicio .contenedor-servicio article {
    width: 14rem;
    /* height: 9rem; */
    display: grid;
    place-items: center;
    /* border-radius: 20px;
    background-color: #fcf7f7; */
}

/* servicios */
.section-service {
    /* padding-top: 5rem !important;
    padding-bottom: 0 !important; */
    padding: 0.5rem 0;
}
.section-service .contenedor-service {
    width: 40rem;
    height: 33rem;
    /* margin: 3rem auto; */
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    position: relative;
    margin-top: -9rem;
}
.section-service .contenedor-service img:nth-child(1) {
    position: absolute;
    bottom: 0%;
    left: 6.5%;
    /* transform: translateY(-50%); */
}
.section-service .contenedor-service img:nth-child(2) {
    position: absolute;
    top: 20%;
    left: -22%;
    /* transform: translateX(-50%); */
}
.section-service .contenedor-service img:nth-child(3) {
    position: absolute;
    bottom: 20%;
    right: 15.5%;
    /* transform: translatX(-50%); */
}
.section-service .contenedor-service img:nth-child(4) {
    position: absolute;
    bottom: 0%;
    right: -12.5%;
    /* transform: translateX(-50%);
    /* transform: translateX(-50%); */
}

.section-service .contenedor-service img {
    width: 20rem;
}

/* tiendas */
.section-tiendas {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 4rem;
    padding-top: 5rem;
    padding-bottom: 3rem;
}
.section-tiendas article img {
    width: 100%;
    height: 10.7rem;
    transform: scale(1.15);
    border-radius: 20px;
}
.section-tiendas article .iconos-tiendas {
    margin: 2.5rem 0.4rem;
}
.section-tiendas article .iconos-tiendas p {
    display: flex;
    margin: 1.5rem 0;
    vertical-align: top;
    color: #72718f !important;
    position: relative;
}

.section-tiendas article .iconos-tiendas p ion-icon {
    font-size: 1.4rem !important;
    margin-right: 0.4rem;
    position: absolute;
    left: 0;
    top: -6px;
    vertical-align: top;
    color: #1a0b5b !important;
}
.section-tiendas article .iconos-tiendas p b {
    margin-right: 0.3rem;
    margin-left: 2rem;
    color: #1a0b5b !important;
}
.section-tiendas article #location-tiendas {
    padding: 0.6rem;
    border-radius: 50%;
    color: #dd232a !important;
    font-size: 1.7rem;
    position: absolute;
    background-color: #fcf3f3;
    right: -30px;
    bottom: 45%;
}
.section-tiendas article {
    position: relative;
    width: 17rem;
    height: 24rem;
    border: 2px solid #dd232a;
    border-radius: 20px;
}
.section-tiendas article:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.5);
}

/* ofertas */
.ofertas {
    /* min-width: 100%; */
    width: 100%;
    background-color: white;
    width: 100%;
    padding: 2rem 0 !important;
    position: relative;
    z-index: 1;
}

/* lista de destacados */
.contenedor__listadestacados {
    margin-top: 3rem;
    margin-bottom: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
}
.contenedor__listadestacados .article-ofert:nth-child(1) {
    margin-left: 0 !important;
}

/* lista de ofertas */
.contenedor__listafertas {
    margin-top: 3rem;
    margin-bottom: 3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
}
/* .contenedor__listafertas .article-ofert:nth-child(1) {
    margin-left: 0 !important;
} */
.ofertas i {
    position: absolute;
    top: 50%;
    font-size: 4rem;
    cursor: pointer;
    z-index: 100;
}
.ofertas #right-oferta {
    right: -5px;
}
.ofertas #left-oferta {
    left: -5px;
}

.ofertas .pagination-button {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: -1rem;
}
.ofertas .pagination-button button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.ofertas .pagination-button button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.ofertas .contenedor-ofertas::-webkit-scrollbar {
    background-color: transparent;
}
.ofertas .contenedor-ofertas {
    width: 90%;
    display: flex;
    margin: 1rem auto;
    overflow: auto;
    scroll-behavior: smooth;
    align-items: center;
    /* gap: 1rem; */
}
.article-ofert {
    position: relative;
    min-width: calc(25% - 1rem);
    width: calc(25% - 1rem);
    text-align: center;
    display: flex;
    margin: .5rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.35);
    cursor: pointer;
    transition: 0.3s ease all;
    padding-bottom: 20px;
    border-radius: 20px;
}
.article-ofert:hover {
    border: 2px solid #b33334;
}
.article-ofert .icons-ofertas {
    display: flex;
    gap: 0.5rem;
    position: absolute;
    top: 0.5rem;
    visibility: hidden;
    left: 0.5rem;
}
.article-ofert .icons-ofertas ion-icon {
    font-size: 1.1rem;
    color: #fff;
    background-color: #dd232a;
    border-radius: 50%;
    padding: 0.2rem;
}
.article-ofert .text-ofert p {
    margin: 1rem 0;
}
.article-ofert:hover .icons-ofertas {
    visibility: visible;
}
.article-ofert:hover .text-ofert p {
    color: #fff !important;
}
.article-ofert:hover .text-ofert b {
    color: #fff !important;
}
.article-ofert:hover .text-ofert {
    background-color: #dd232a;
    color: #fff !important;
}
.article-ofert .text-ofert b {
    color: #dd232a !important;
}
.article-ofert .text-ofert {
    padding: 0.5rem;
    color: #000;
    transition: 0.3s ease all;
    text-align: center;
    background-color: white;
    width: 100%;
    height: 7.5rem;
}

.article-ofert img {
    width: 100%;
    height: 13rem;
    border-radius: 20px;
    /* padding: .5rem; */
}

/*ultimos productos */
.ultimosp {
    margin-top: 5rem !important;
    margin-bottom: 5rem !important;
}
.nav-up {
    width: 25rem;
    display: flex;
    margin: 2rem auto;
    justify-content: space-between;
    align-items: center;
}
.nav-up a {
    color: #000;
}
.nav-up a:first-child {
    color: red;
    text-decoration: underline;
}
.ultimosp .contenedor-ultimosp {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 3rem;
}
.ultimosp .contenedor-ultimosp article {
    width: 16rem;
}
.ultimosp .contenedor-ultimosp article img {
    width: 100%;
    object-fit: contain;
    height: 15rem;
}
.ultimosp .contenedor-ultimosp article .info-up b {
    color: red;
}
.ultimosp .contenedor-ultimosp article .info-up {
    display: flex;
    justify-content: space-between;
    margin: 0.5rem 0;
}

/* tendencia */
.trending-home {
    min-width: 100%;
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
    padding: 1rem 0 !important;
    /* background-color: #fcf3f3; */
    background-image: url(https://rab-import-assets.s3.amazonaws.com/kaizen/home/que-maquina-comprar.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.trending-home .contenedor-trending {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
    margin: 1rem 0;
    padding: 1.5rem 1.5rem;
}
.trending-home .contenedor-trending img {
    width: 20rem;
    object-fit: contain;
}
.trending-home .contenedor-trending .text-trending {
    width: 33rem;
    margin-left: -19rem;
}
.trending-home .contenedor-trending .text-trending2{
    margin-left: 45%;
}
.trending-home .contenedor-trending .text-trending p {
    margin: 1rem 0;
    /* color: #72718f !important; */
    color: #000 !important;
}

.trending-home .contenedor-trending .text-trending p span {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 0.3rem;
}
.trending-home .contenedor-trending .text-trending p:nth-child(2) span {
    background-color: #f52b70;
}
.trending-home .contenedor-trending .text-trending p:nth-child(3) span {
    background-color: #2b2bf5;
}
.trending-home .contenedor-trending .text-trending p:nth-child(4) span {
    background-color: #2bf5cc;
}

/* top productos */
.top-productos {
    width: 100%;
    padding: 2rem 0 !important;
    position: relative;
}
.top-productos #right-destacado {
    right: -5px;
}
.top-productos #left-destacado {
    left: -5px;
}
.top-productos i {
    cursor: pointer;
    z-index: 100;
    position: absolute;
    top: 50%;
    font-size: 4rem;
}
.top-productos .pagination-featured {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: -1rem;
}
.top-productos .pagination-featured button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.top-productos .pagination-featured button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.top-productos .contenedor-top {
    width: 90%;
    display: flex;
    align-items: center;
    /* gap: 2rem; */
    margin: 1rem auto;
    padding: 1rem 0;
    overflow: auto;
    scroll-behavior: smooth;
}
.top-productos .contenedor-top::-webkit-scrollbar {
    background-color: transparent;
}
.products-featured {
    text-align: center;
    min-width: calc(25% - 1rem);
    width: calc(25% - 1rem);
    position: relative;
    margin: 0.5rem;
    box-shadow: 1px 1px 18px 0px rgba(0, 0, 0, 0.15);
    padding-bottom: 20px;
    border-radius: 20px;
    transition: 0.3s ease all;
}
.products-featured:hover {
    border: 2px solid #b33334;
}
.products-featured img {
    width: 100%;
    height: 13rem;
    border-radius: 20px;
}
.products-featured .div-des {
    margin: 0.5rem;
    display: flex;
    flex-direction: column;
    height: 6rem;
    align-items: center;
}
.products-featured .div-des p {
    margin-top: 0.5rem;
}
.products-featured .icon-destacados ion-icon {
    font-size: 1.1rem;
    cursor: pointer;
    color: #1a0b5b;
    background-color: #d0ceda;
    border-radius: 50%;
    padding: 0.2rem;
    font-weight: bold;
}
.products-featured:hover .icon-destacados {
    display: flex;
}
.products-featured .icon-destacados {
    position: absolute;
    bottom: 38%;
    left: 10px;
    gap: 0.4rem;
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* banner ayuda */
.help-banner {
    width: 100%;
    display: grid;
    place-items: center;
    color: #fff;
    margin-top: 0rem;
    background-color: #e3403e;
    padding: 1rem;
}

.help-banner p {
    font-weight: 650;
    font-size: 1.5rem;
    display: flex; 
    flex-wrap:wrap; 
    gap:.2rem;
    text-align: center;
}

.help-banner p a {
    color: inherit;
}

.help-banner p a:hover {
    text-decoration: underline;
    font-weight: bold;
}

/* checkout */
.contenedor-checkout {
    margin: 3rem 0;
}
.contenedor-checkout article .delete-cart ion-icon {
    vertical-align: middle;
}
.contenedor-checkout {
    width: 95%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 3rem;
    margin-left: auto;
    margin-right: auto;
    
    /* margin-top: 5rem; */
    margin-bottom: 0rem;
}
.contenedor-checkout article .delete-cart {
    /* position: absolute;
    right: 3rem;
    bottom: 2rem; */
    vertical-align: middle;
    font-size: 1.5rem;
    background-color: transparent;
    cursor: pointer;
    display: flex;
}
.contenedor-checkout article {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.15);
    width: 100%;
    display: flex;
    /* flex-wrap: wrap; */
    justify-content: space-between;
    align-items: center;
    gap: 4rem;
    background-color: white;
    padding: 1rem 3rem;
    border-radius: 12px;
    position: relative;
}
.contenedor-checkout article div:nth-child(1) {
    width: 10rem;
    height: 10rem;
}
.contenedor-checkout article div:nth-child(1) img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.contenedor-checkout article div:nth-child(2) {
    width: 20rem;
}
.contenedor-checkout article div:nth-child(2) h2 {
    font-size: 1.3rem;
}

.contenedor-checkout article div:nth-child(2) p {
    text-transform: uppercase;
}
.contenedor-checkout article div:nth-child(2) p {
    font-size: 1rem;
    margin: 1rem 0;
}
.contenedor-checkout article .div-num {
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
}
.contenedor-checkout article .div-num span {
    padding: 0.6rem 1rem;
    border: 1px solid #e0d4d4;
    font-weight: bold;
    cursor: pointer;
    font-size: 2rem;
}
.contenedor-checkout article .div-num span:nth-child(1) {
    color: red;
    cursor: pointer;
}
.contenedor-checkout article .div-num span:nth-child(2) {
    color: #000;
}
.contenedor-checkout article .div-num span:nth-child(3) {
    cursor: pointer;
    color: red;
}
.contenedor-checkout article div:nth-child(3) p {
    font-size: 1rem;
    margin: 1rem 0;
}
.contenedor-checkout article div:nth-child(4) h3 {
    font-size: 2rem;
}

.pagination-products {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}
.pagination-products button.button__pagination {
    background-color: #e3403e;
    color: #fff;
}
.pagination-products button {
    margin-top: 3rem;
    margin-bottom: 1rem;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background-color: #eee;
}
/* cotizar form */
.cotizar__form {
    margin-bottom: 2rem !important;
    margin-top: 2rem !important;
    padding-top: 1rem;
    padding-bottom: 2rem;
    background-color: #eee;
    border-radius: 20px;
}
.cotizar__form .contenedor__cotizar article:nth-child(1) {
    width: 45%;
}
.cotizar__form .contenedor__cotizar article:nth-child(2) {
    width: 45%;
}
.cotizar__form .contenedor__cotizar article:nth-child(2) img {
    width: 100%;
    height: 25rem;
    object-fit: contain;
}
.cotizar__form .contenedor__cotizar {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
    /* background-color: #eee;
    border-radius: 20px; */
}
.cotizar__form .contenedor__cotizar .form-pago input[type="text"]{
    border: none;
    border-radius: 12px;
}

/* cotizaciones */
.cotizaciones {
    min-width: 100%;
    width: 100%;
    /* background-color: #eae1e1; */
    display: flex;
    justify-content: center;
    align-items: center;
    height: 23rem;
    background-image: linear-gradient(to top, #000000ae 0%, #000000ac 100%),
        url(https://cdn.computerhoy.com/sites/navi.axelspringer.es/public/media/image/2022/04/mujer-utilizando-maquina-coser-electrica-2689051.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.cotizaciones div h2 {
    margin-bottom: 1rem;
    color: #fff !important;
}
.cotizaciones div {
    width: 30rem;
    display: grid;
    place-items: center;
    text-align: center;
}

/* asesores */
.section-asesores {
    position: relative;
    width: 100%;
    padding: 2rem 0 !important;
    background-color: white;
}
.section-asesores i {
    position: absolute;
    top: 50%;
    font-size: 4rem;
    color: #1a0b5b;
}
.section-asesores #left-asesor {
    left: 10%;
}
.section-asesores #right-asesor {
    right: 10%;
}
.section-asesores .arrow-asesores {
    width: 100%;
    position: absolute;
    bottom: 4rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}
.section-asesores .arrow-asesores span.active-arrow-asesor {
    width: 2rem;
    background-color: #e3403e;
}
.section-asesores .arrow-asesores span {
    border-radius: 10px;
    width: 1.4rem;
    background-color: #e3413e7b;
    height: 0.3rem;
}
.section-asesores .contenedor__asesores::-webkit-scrollbar{
    background-color: transparent;
}
.section-asesores .contenedor__asesores {
    width: 90%;
    display: flex;
    align-items: center;
    margin: 1rem auto;
    overflow: auto;
    scroll-behavior: smooth;
    text-align: center;
    vertical-align: middle;
}
.section-asesores .contenedor__asesores article.active-asesores {
    min-width: 33.3%;
    width: 33.3%;
    height: 20rem;
    opacity: 1;
}
.active-asesores {
    min-width: 33.3%;
    width: 33.3%;
    height: 20rem;
    opacity: 1;
}
.section-asesores .contenedor__asesores button {
    color: #000;
}
.section-asesores .contenedor__asesores article {
    min-width: 30.5%;
    width: 30.5%;
    height: 15rem;
    opacity: 0.5;
    transition: 0.3s ease all;
    position: relative;
}
.section-asesores .contenedor__asesores .wrap .slider .item b p {
    transform-style: preserve-3d;
    transform: skew(-40deg);
    color: #fff !important;
}
.section-asesores .contenedor__asesores .wrap .slider .item a p {
    transform-style: preserve-3d;
    transform: skew(-40deg);
    color: #fff !important;
}
.section-asesores .contenedor__asesores .wrap .slider .item a {
    position: absolute;
    bottom: 0.7rem;
    left: 50%;
    padding: 0.2rem 0.3rem;
    background: #dd232a;
    transform-style: preserve-3d;
    transform: skew(40deg) translateX(-50%);
    color: white !important;
}
.section-asesores .contenedor__asesores .wrap .slider .item b {
    position: absolute;
    bottom: 2rem;
    padding: 0.2rem 0.6rem;
    background: #000;
    transform-style: preserve-3d;
    transform: skew(40deg) translateX(-50%);
    color: white;
    left: 50%;
}
.section-asesores .contenedor__asesores article img {
    max-width: 100%;
    width: 100%;
}

/* todods los asesores */
.section-allasesores {
    padding: 3rem 0;
}
.contenedor-allasesores {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
}

/* .contenedor-allasesores b p {
    transform-style: preserve-3d;
    transform: skew(-40deg);
    color: #fff !important;
}
.contenedor-allasesores a p {
    transform-style: preserve-3d;
    transform: skew(-40deg);
    color: #fff !important;
}

.contenedor-allasesores article a {
    position: absolute;
    bottom: 0.7rem;
    left: 50%;
    padding: 0.2rem 0.3rem;
    background: #dd232a;
    transform-style: preserve-3d;
    transform: skew(40deg) translateX(-50%);
    color: white !important;
}
.contenedor-allasesores article b {
    position: absolute;
    bottom: 2rem;
    padding: 0.2rem 0.6rem;
    background: #000;
    transform-style: preserve-3d;
    transform: skew(40deg) translateX(-50%);
    color: white;
    left: 50%;
}
.contenedor-allasesores article {
    width: 20rem;
    transition: 0.3s ease all;
    position: relative;
}
.contenedor-allasesores article img {
    max-width: 100%;
    width: 100%;
    object-fit: contain;
} */

.contenedor-allasesores article {
    width: 17rem;
    height: 17rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #f7f7f7;
    border: 2px solid #000;
    position: relative;
    margin: 1rem 0;
}
.contenedor-allasesores article img {
    width: 71%;
}
.contenedor-allasesores article button {
    padding: 0.4rem 1rem;
    background-color: #04d15f;
    color: white;
    margin-top: 0.5rem;
    position: absolute;
    bottom: -2rem;
}

.sidebar-menu-category {
    margin-right: 0.4rem;
}
.sidebar-menu-category-list {
    margin-right: 0.3rem;
}
.sidebar-menu-category-list::-webkit-scrollbar {
    background-color: transparent;
    width: 11px !important;
}
.sidebar-menu-category-list::-webkit-scrollbar-thumb {
    background-color: #e63b41d1 !important;
    border-radius: 10px;
}

/* promociones */
.promociones {
    min-width: 100%;
    padding: 0.5rem 0 !important;
    /* background-color: #eae1e1; */
}
.nav-promociones {
    display: flex;
    margin: 2rem auto;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}
.nav-promociones a.active-categoria div {
    display: block;
}
.nav-promociones a.active-categoria {
    color: #fb4997 !important;
    text-decoration: underline;
}
.nav-promociones a {
    color: #000;
    display: flex;
    justify-content: center;
    align-items: center;
}
.nav-promociones a div {
    width: 5px;
    height: 5px;
    background-color: #fb4997;
    border-radius: 50%;
    margin-left: 0.5rem;
    display: none;
}

.title-div {
    width: 100%;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
}
.title-div button {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}

.blog-content {
    cursor: pointer;
}
.blog-content:hover .p2-b {
    color: #fb2e86 !important;
}

.promociones .nav-promociones a.active-categoria div {
    display: block;
}
.promociones .nav-promociones a.active-categoria {
    color: #fb4997 !important;
    text-decoration: underline;
}
.promociones .contenedor-promociones {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.promociones .contenedor-promociones article h2,
.promociones .contenedor-promociones article b,
.promociones .contenedor-promociones article p {
    margin: 1rem 0;
}
.promociones .contenedor-promociones article p {
    color: #72718f !important;
}

.promociones .contenedor-promociones article {
    width: 35rem;
    padding: 0;
    margin-top: -4rem;
}
.promociones .contenedor-promociones img {
    width: 20rem;
}

/* header */

.header-2 {
    background-color: #b33334;
    height: 2rem;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2000;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 3%;
    font-family: "abel";
}
.header-2 .header-info {
    display: flex;
    gap: 0.8rem;
    margin-top: -.3rem;
}
.header-2 .header-info a {
    font-size: 1rem;
    color: #eae1e1;
}
.header-2 .header-info a:hover {
    text-decoration: underline;
}
.header-2 .header-info a:active {
    color: inherit;
}
.header-2 .header-cambio {
    display: flex;
    /* width: 13rem; */
    margin-top: -.3rem;
    gap: 2rem;
    justify-content: space-between;
    align-items: center;
}
.header-2 .header-cambio i {
    font-size: 1.2rem;
    margin: 0 0.2rem;
    vertical-align: middle;
}
.header-2 .header-cambio div a i {
    text-align: center;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    color: #b33334;
    font-size: 1rem;
    padding-top: 0.3rem;
    border-radius: 50%;
    background-color: #fff;
}
.header-2 .header-cambio div a i:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
}

.header-2 .header-cambio div {
    display: flex;
    gap: 0.2rem;
}
.header-2 .header-cambio a {
    color: #fff;
    font-size: 1.2rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.header-2 .header-cambio a:active {
    color: inherit;
}
.footer-kaizen .center-footer .article1-footer div a {
    color: #fff;
    font-size: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 10px;
}

/*-----------------------------------*\
  #REUSED STYLE
\*-----------------------------------*/

.container h1,
.container h2,
.container h3,
.container h4,
.container h5,
.container h6,
.container p,
.container b,
.container {
    color: #1a0b5b;
    /* padding: 0 15px; */
}
.banner-title {
    color: #1a0b5b !important;
}

.has-scrollbar {
    padding-bottom: 5px;
}

.has-scrollbar::-webkit-scrollbar {
    width: 12px; /* for vertical scroll */
    height: 12px; /* for horizontal scroll */
}

.has-scrollbar::-webkit-scrollbar-thumb {
    background: transparent;
    border: 3px solid var(--white);
    -webkit-border-radius: 20px;
    border-radius: 20px;
}

.has-scrollbar:hover::-webkit-scrollbar-thumb {
    background: hsl(0, 0%, 90%);
}

.has-scrollbar::-webkit-scrollbar-thumb:hover {
    background: hsl(0, 0%, 80%);
}

.title {
    color: var(--eerie-black);
    font-size: var(--fs-5);
    font-weight: var(--weight-600);
    letter-spacing: 0.4px;
    text-transform: capitalize;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--cultured);
    margin-bottom: 30px;
}

/*-----------------------------------*\
  #MAIN
\*-----------------------------------*/

/**
 * overlay 
 */

.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: hsla(0, 0%, 0%, 0.5);
    opacity: 0;
    pointer-events: none;
    z-index: 15;
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
}

.overlay.active {
    opacity: 1;
    pointer-events: all;
}

/* features */
.content-scrollf::-webkit-scrollbar {
    background-color: transparent;
}
.container-features {
    /* position: relative; */
    min-width: 100%;
    width: 100%;
    padding: 3rem 0 !important;
    background-color: #fff;
}
.contenedor-principal-destacados {
    width: 100%;
    margin-top: 3rem;
    margin-bottom: 3rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.content-textf .article-text .banner-title {
    width: 70%;
    font-weight: 300;
    font-size: 2.8rem;
    text-align: left;
}
.content-textf .article-text p {
    margin: 2rem 0;
}
.content-textf .article-text {
    width: 75%;
}
.content-textf {
    /* padding: 3rem 0; */
    width: 39%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.content-scrollf {
    width: 100%;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    overflow: auto;
    scroll-behavior: smooth;
    gap: 1.5rem;
    padding-left: 2rem;
}
.contenendor-destacados {
    /* background-color: green;
  display: flex;
  align-items: center;
  overflow: auto;
  scroll-behavior: smooth; */
    width: 55%;
    position: relative;
}
.contenendor-destacados .left-f {
    position: absolute;
    top: 40%;
    left: 0px;
    font-size: 3rem;
    color: var(--bittersweet);
    cursor: pointer;
}
.contenendor-destacados .right-f {
    position: absolute;
    top: 40%;
    cursor: pointer;
    right: -30px;
    font-size: 3rem;
    color: var(--bittersweet);
}
.contenendor-destacados .content-scrollf article {
    text-align: center;
    min-width: 30%;
    width: 30%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.container-features h2 {
    font-size: 2rem;
    text-align: center;
    /* margin-top: 4rem; */
    margin-bottom: 2rem;
}
.contenendor-destacados .content-scrollf article h5 {
    font-size: 1.1rem;
    text-transform: initial;
    overflow: hidden;
}
.contenendor-destacados .content-scrollf article .banner-btn {
    text-align: center;
    display: block;
    margin: 1rem auto;
}
.contenendor-destacados .content-scrollf article img {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
}

/* mascotas */
.mascotas1-6 {
    bottom: 40%;
    right: 30%;
}
.mascotas1-5 {
    bottom: 19%;
    right: 73%;
}
.mascotas1-4 {
    bottom: 43%;
    right: 70%;
}
.mascotas1-3 {
    bottom: 60%;
    right: 45%;
}
.mascotas1-2 {
    bottom: 65%;
    right: 45%;
}
.mascotas1-1 {
    bottom: 55%;
    right: 49%;
}

/* mochilas */
.mochilas2-8 {
    bottom: 40%;
    right: 25%;
}
.mochilas2-7 {
    bottom: 20%;
    right: 27%;
}
.mochilas2-6 {
    bottom: 29%;
    right: 50%;
}
.mochilas2-5 {
    bottom: 38%;
    right: 65%;
}
.mochilas2-4 {
    bottom: 55%;
    right: 40%;
}
.mochilas2-3 {
    bottom: 73%;
    right: 60%;
}
.mochilas2-2 {
    bottom: 82%;
    right: 64%;
}
.mochilas2-1 {
    bottom: 85%;
    right: 48%;
}
.mochilas1-6 {
    bottom: 41%;
    right: 78%;
}
.mochilas1-5 {
    bottom: 37%;
    right: 50%;
}
.mochilas1-4 {
    bottom: 60%;
    right: 50%;
}
.mochilas1-3 {
    bottom: 55%;
    right: 45%;
}
.mochilas1-2 {
    bottom: 60%;
    right: 66%;
}
.mochilas1-1 {
    bottom: 80%;
    right: 48%;
}

/* tapicería */
.tapiceria1-5 {
    bottom: 49%;
    right: 65%;
}
.tapiceria1-4 {
    bottom: 19%;
    right: 34%;
}
.tapiceria1-3 {
    bottom: 50%;
    right: 30%;
}
.tapiceria1-2 {
    bottom: 74%;
    right: 9%;
}
.tapiceria1-1 {
    bottom: 89%;
    right: 23%;
}

/* gorras */
.gorras1-7 {
    right: 80%;
    bottom: 37%;
}
.gorras1-6 {
    bottom: 26%;
    right: 50%;
}
.gorras1-5 {
    bottom: 37%;
    right: 55%;
}
.gorras1-4 {
    bottom: 55%;
    right: 40%;
}
.gorras1-3 {
    bottom: 69%;
    right: 55%;
}
.gorras1-2 {
    bottom: 69%;
    right: 63%;
}
.gorras1-1 {
    bottom: 83%;
    right: 52%;
}

/* ropa de bebe */
.ropa-de-bebe2-5 {
    right: 63%;
    bottom: 32%;
}
.ropa-de-bebe2-4 {
    bottom: 18%;
    right: 83%;
}
.ropa-de-bebe2-3 {
    right: 78%;
    bottom: 50%;
}
.ropa-de-bebe2-2 {
    bottom: 58%;
    right: 50%;
}
.ropa-de-bebe2-1 {
    bottom: 82%;
    right: 60%;
}

.ropa-de-bebe1-6 {
    bottom: 55%;
    right: 31%;
}
.ropa-de-bebe1-5 {
    bottom: 16%;
    right: 60%;
}
.ropa-de-bebe1-4 {
    bottom: 44%;
    right: 70%;
}
.ropa-de-bebe1-3 {
    bottom: 60%;
    right: 75%;
}
.ropa-de-bebe1-2 {
    bottom: 81%;
    right: 70%;
}
.ropa-de-bebe1-1 {
    bottom: 87%;
    right: 42%;
}

/* jeans */
.jeans1-15 {
    bottom: 85%;
    right: 39%;
}
.jeans1-14 {
    bottom: 76%;
    right: 49%;
}
.jeans1-13 {
    bottom: 92%;
    right: 30%;
}
.jeans1-12 {
    bottom: 94%;
    right: 50%;
}
.jeans1-11 {
    bottom: 79%;
    right: 71%;
}
.jeans1-10 {
    bottom: 16%;
    right: 58%;
}
.jeans1-9 {
    bottom: 5%;
    right: 30%;
}
.jeans1-8 {
    bottom: 40%;
    right: 24%;
}
.jeans1-7 {
    bottom: 55%;
    right: 45%;
}
.jeans1-6 {
    right: 73%;
    bottom: 86%;
}
.jeans1-5 {
    right: 50%;
    bottom: 78%;
}
.jeans1-4 {
    bottom: 89%;
    right: 53%;
}
.jeans1-3 {
    bottom: 90%;
    right: 44%;
}
.jeans1-2 {
    bottom: 83%;
    right: 36%;
}
.jeans1-1 {
    bottom: 91%;
    right: 30%;
}

/* ropa-deportiva */
.ropa-industrial1-12 {
    bottom: 20%;
    right: 60%;
}
.ropa-industrial1-11 {
    bottom: 5%;
    right: 41%;
}
.ropa-industrial1-10 {
    bottom: 89%;
    right: 59%;
}
.ropa-industrial1-9 {
    right: 74%;
    bottom: 52%;
}
.ropa-industrial1-8 {
    bottom: 31%;
    right: 45%;
}
.ropa-industrial1-7 {
    bottom: 40%;
    right: 48%;
}
.ropa-industrial1-6 {
    bottom: 55%;
    right: 50%;
}
.ropa-industrial1-5 {
    bottom: 62%;
    right: 48%;
}
.ropa-industrial1-4 {
    bottom: 72%;
    right: 46%;
}
.ropa-industrial1-3 {
    right: 55%;
    bottom: 75%;
}
.ropa-industrial1-2 {
    bottom: 78%;
    right: 37%;
}
.ropa-industrial1-1 {
    bottom: 90%;
    right: 40%;
}

/* pantalon y terno */
.pantalon-y-terno2-8 {
    bottom: 4%;
    right: 36%;
}
.pantalon-y-terno2-7 {
    bottom: 6%;
    right: 90%;
}
.pantalon-y-terno2-6 {
    bottom: 95%;
    right: 50%;
}
.pantalon-y-terno2-5 {
    bottom: 85%;
    right: 27%;
}
.pantalon-y-terno2-4 {
    bottom: 80%;
    right: 15%;
}
.pantalon-y-terno2-3 {
    bottom: 32%;
    right: 73%;
}
.pantalon-y-terno2-2 {
    bottom: 33%;
    right: 50%;
}
.pantalon-y-terno2-1 {
    bottom: 49%;
    right: 50%;
}

.pantalon-y-terno1-9 {
    right: 50%;
    bottom: 54%;
}
.pantalon-y-terno1-8 {
    bottom: 75%;
    right: 78%;
}
.pantalon-y-terno1-7 {
    bottom: 80%;
    right: 6%;
}
.pantalon-y-terno1-6 {
    bottom: 2%;
    right: 54%;
}
.pantalon-y-terno1-5 {
    bottom: 60%;
    right: 60%;
}
.pantalon-y-terno1-4 {
    bottom: 90%;
    right: 72%;
}
.pantalon-y-terno1-3 {
    bottom: 94%;
    right: 53%;
}
.pantalon-y-terno1-2 {
    bottom: 83%;
    right: 40%;
}
.pantalon-y-terno1-1 {
    bottom: 91%;
    right: 22%;
}

/* camisas */
.camisa1-14 {
    bottom: 5%;
    right: 90%;
}
.camisa1-13 {
    bottom: 4%;
    right: 5%;
}
.camisa1-12 {
    bottom: 85%;
    right: 50%;
}
.camisa1-11 {
    bottom: 25%;
    right: 10%;
}
.camisa1-10 {
    bottom: 40%;
    right: 73%;
}
.camisa1-9 {
    bottom: 80%;
    right: 80%;
}
.camisa1-8 {
    bottom: 5%;
    right: 10%;
}
.camisa1-7 {
    bottom: 5%;
    right: 40%;
}
.camisa1-6 {
    bottom: 48%;
    right: 52%;
}
.camisa1-5 {
    bottom: 59%;
    right: 50%;
}
.camisa1-4 {
    bottom: 72%;
    right: 50%;
}
.camisa1-3 {
    bottom: 67%;
    right: 38%;
}
.camisa1-2 {
    bottom: 90%;
    right: 50%;
}
.camisa1-1 {
    bottom: 87%;
    right: 40%;
}

/* ropa deportiva */
.ropa-deportiva2-7 {
    bottom: 88%;
    right: 80%;
}
.ropa-deportiva2-6 {
    bottom: 85%;
    right: 50%;
}
.ropa-deportiva2-5 {
    bottom: 4%;
    right: 80%;
}
.ropa-deportiva2-4 {
    bottom: 43%;
    right: 40%;
}
.ropa-deportiva2-3 {
    bottom: 80%;
    right: 85%;
}
.ropa-deportiva2-2 {
    bottom: 74%;
    right: 50%;
}
.ropa-deportiva2-1 {
    bottom: 85%;
    right: 25%;
}

.ropa-deportiva1-7 {
    bottom: 30%;
    right: 78%;
}
.ropa-deportiva1-6 {
    bottom: 10%;
    right: 35%;
}
.ropa-deportiva1-5 {
    bottom: 92%;
    right: 58%;
}
.ropa-deportiva1-4 {
    bottom: 5%;
    right: 90%;
}
.ropa-deportiva1-3 {
    bottom: 70%;
    right: 84%;
}
.ropa-deportiva1-2 {
    bottom: 84%;
    right: 25%;
}
.ropa-deportiva1-1 {
    bottom: 80%;
    right: 50%;
}

/* polo y tejido */
.polo-y-tejido1-10 {
    bottom: 47%;
    right: 75%;
}
.polo-y-tejido1-9 {
    bottom: 85%;
    right: 53%;
}
.polo-y-tejido1-8 {
    bottom: 4%;
    right: 53%;
}
.polo-y-tejido1-7 {
    bottom: 80%;
    right: 17%;
}
.polo-y-tejido1-6 {
    bottom: 62%;
    right: 15%;
}
.polo-y-tejido1-5 {
    bottom: 75%;
    right: 35%;
}
.polo-y-tejido1-4 {
    bottom: 66%;
    right: 50%;
}
.polo-y-tejido1-3 {
    bottom: 72%;
    right: 50%;
}
.polo-y-tejido1-2 {
    bottom: 80%;
    right: 50%;
}
.polo-y-tejido1-1 {
    bottom: 91%;
    right: 50%;
}

/* botones de moda fitness */
.moda-fitness2-5 {
    bottom: 70%;
    right: 26%;
}
.moda-fitness2-4 {
    bottom: 3%;
    right: 24%;
}
.moda-fitness2-3 {
    bottom: 38%;
    right: 68%;
}
.moda-fitness2-2 {
    bottom: 75%;
    right: 57%;
}
.moda-fitness2-1 {
    bottom: 89%;
    right: 42%;
}

.moda-fitness1-4 {
    bottom: 90%;
    right: 20%;
}
.moda-fitness1-3 {
    bottom: 20%;
    right: 90%;
}
.moda-fitness1-2 {
    bottom: 12%;
    right: 42%;
}
.moda-fitness1-1 {
    bottom: 76%;
    right: 45%;
}

/* botones de lencería y ropa */
.lenceria-y-ropa4-5 {
    bottom: 13%;
    right: 87%;
}
.lenceria-y-ropa4-4 {
    bottom: 51%;
    right: 22%;
}
.lenceria-y-ropa4-3 {
    bottom: 15%;
    right: 55%;
}
.lenceria-y-ropa4-2 {
    bottom: 13%;
    right: 44%;
}
.lenceria-y-ropa4-1 {
    bottom: 45%;
    right: 40%;
}

.lenceria-y-ropa3-4 {
    bottom: 55%;
    right: 60%;
}
.lenceria-y-ropa3-3 {
    bottom: 8%;
    right: 57%;
}
.lenceria-y-ropa3-2 {
    bottom: 47%;
    right: 30%;
}
.lenceria-y-ropa3-1 {
    bottom: 49%;
    right: 47%;
}

.lenceria-y-ropa2-4 {
    bottom: 60%;
    right: 60%;
}
.lenceria-y-ropa2-3 {
    bottom: 56%;
    right: 47%;
}
.lenceria-y-ropa2-2 {
    bottom: 40%;
    right: 40%;
}
.lenceria-y-ropa2-1 {
    bottom: 70%;
    right: 27%;
}

.lenceria-y-ropa1-4 {
    bottom: 50%;
    right: 75%;
}
.lenceria-y-ropa1-3 {
    bottom: 2%;
    right: 31%;
}
.lenceria-y-ropa1-2 {
    bottom: 52%;
    right: 38%;
}
.lenceria-y-ropa1-1 {
    bottom: 75%;
    right: 33%;
}

/* maquinas detalles */

.maquinas-detalles {
    padding: 2rem 1%;
    background-color: #fff;
    width: 100%;
    margin: 0 auto;
    max-width: 1200px;
    margin-top: 5rem;
    padding-top: 3rem;
    margin-bottom: 2rem;
}
.maquinas-detalles .detallesm-contenedor {
    width: 100%;
}
.maquinas-detalles .detallesm-contenedor article {
    width: 100%;
}
.maquinas-detalles .detallesm-contenedor article h2 {
    font-size: 2rem;
    margin-bottom: 1.5rem;
}
.maquinas-detalles .detallesm-contenedor article p {
    font-size: 1rem;
}
.maquinas-detalles .detallesm-contenedor article .container-img {
    margin-top: 4rem;
    position: relative;
    width: 45%;
    height: 50%;
}
.contennedor__imgs-maquinas {
    width: 100%;
    margin-top: 1rem;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 3rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina {
    width: 15rem;
    height: auto;
    position: relative;
    top: 10rem;
    /* margin-right: 1rem; */
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .modal-maquina
    img {
    height: 10rem;
    width: 80%;
    display: block;
    margin: auto;
    object-fit: contain;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .span-m1 {
    position: absolute;
    bottom: -0.5rem;
    right: -1.7rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm1
    .span-m1
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2 {
    padding: 1rem;
    display: flex;
    position: absolute;
    /* top: 10%;
    right: 30%; */
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2 {
    width: 15rem;
    height: auto;
    margin-right: 2.4rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .modal-maquina2
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .span-m2 {
    position: absolute;
    top: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm2
    .span-m2
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .modal-maquina3
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .span-m3 {
    position: absolute;
    bottom: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm3
    .span-m3
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .modal-maquina4
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .span-m4 {
    position: absolute;
    bottom: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm4
    .span-m4
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .modal-maquina5
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .span-m5 {
    position: absolute;
    bottom: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm5
    .span-m5
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .modal-maquina6
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .span-m6 {
    position: absolute;
    top: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm6
    .span-m6
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .modal-maquina7
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .span-m7 {
    position: absolute;
    top: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm7
    .span-m7
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .modal-maquina8
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .span-m8 {
    position: absolute;
    bottom: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm8
    .span-m8
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9 {
    padding: 1rem;
    display: flex;
    position: absolute;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9.modal-hidden {
    display: none;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9 {
    width: 15rem;
    height: auto;
    margin-right: 2.5rem;
    overflow: hidden;
    text-align: center;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.1);
    background-color: #fff;
    z-index: 100;
    padding: 0.6rem;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9
    h2 {
    font-size: 1rem;
    font-weight: 500;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9
    a {
    font-size: 0.9rem;
    text-decoration: none;
    color: #000;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9
    a:hover {
    text-decoration: underline;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .modal-maquina9
    img {
    width: 75%;
    object-fit: cover;
}

.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .span-m9 {
    position: absolute;
    bottom: 0rem;
    right: 0.4rem;
    cursor: pointer;
    background-color: #fff;
    border-radius: 50% 50% 50% 0;
    border: 8px solid var(--bittersweet);
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    vertical-align: top;
    line-height: 14px;
}
.maquinas-detalles
    .detallesm-contenedor
    article
    .container-img
    .container-modalm9
    .span-m9
    div {
    color: #000000;
    transform: rotate(-45deg);
    font-weight: 700;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
}

.maquinas-detalles .detallesm-contenedor article .container-img img {
    width: 100%;
    object-fit: contain;
    height: 100%;
}

/* maquinas */
.contenedor-maquinas {
    width: 100%;
    /* padding: 2rem 0; */
}
.contenedor-maquinas:nth-child(1) nav h2 {
    margin-bottom: 1rem;
}
.contenedor-maquinas:nth-child(1) nav {
    width: 20rem;
    padding: 1.5rem;
    border-radius: 20px;
    background-color: #fcf3f3;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    text-align: left;
    margin-top: 3rem;
}
.contenedor__maquinas {
    display: flex;
    justify-content: center;
    /* align-items: center; */
    gap: 2rem;
    /* margin: 3rem 0; */
}
.container-maquinas {
    /* margin-top: 10rem; */
    width: 100%;
    /* padding: 2rem 1%; */
    background-color: #fff;
}
.container-maquinas .contenedor-maquinas {
    /* margin-top: 3rem; */
    width: 100%;
}
.container-maquinas .contenedor-maquinas .title-m {
    font-size: 1.9rem;
    margin-bottom: 1.8rem;
    font-weight: bold;
}
.container-maquinas .contenedor-maquinas .description-m {
    font-size: 1rem;
}
.container-maquinas .contenedor-maquinas .article-maquinas {
    width: 100%;
    /* margin-top: 8rem; */
}
.container-maquinas .contenedor-maquinas .article-maquinas .content-m {
    width: 100%;
    /* background-color: #df0209cd; */
    display: flex;
    /* align-items: center; */
    justify-content: center;
    margin: 2rem 0;
    padding: 1rem;
    gap: 3rem;
    border-radius: 30px;
    color: #fff;
}
.container-maquinas
    .contenedor-maquinas
    .article-maquinas
    .content-m
    .text-m
    h3 {
    font-size: 1.9rem;
    margin-bottom: 0.8rem;
}
.container-maquinas
    .contenedor-maquinas
    .article-maquinas
    .content-m
    .text-m
    p {
    font-size: 1rem;
    text-align: justify;
    color: #72718f !important;
}
.container-maquinas
    .contenedor-maquinas
    .article-maquinas
    .content-m
    .text-m
    a {
        width: 10rem;
    margin: 1rem 0;
}
.container-maquinas
    .contenedor-maquinas
    .article-maquinas
    .content-m
    .text-m
    a:hover {
    background-color: rgb(104, 2, 2);
}
.container-maquinas .contenedor-maquinas .article-maquinas .content-m .text-m {
    /* width: 65%; */
    width: 100%;
}
.container-maquinas .contenedor-maquinas .article-maquinas .content-m .img-m {
    width: 70%;
}
.container-maquinas
    .contenedor-maquinas
    .article-maquinas
    .content-m
    .img-m
    img {
    width: 100%;
}

/* compra exitosa */
.compra__exitosa {
    margin-top: 7rem;
    margin-bottom: 3rem;
}
.compra__exitosa .bg_green h2 {
    font-size: 2.5rem;
}
.compra__exitosa .bg_green {
    height: 22rem;
    display: grid;
    width: 100%;
    color: #fff;
    place-items: center;
    background-color: green;
}
.compra__exitosa article b {
    font-size: 1.5rem;
}
.compra__exitosa article p {
    width: 70%;
}
.compra__exitosa article {
    /* padding: 2rem; */
    width: 50%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    gap: 1rem;
    text-align: center;
    margin: 0 auto;
    height: 24rem;
    margin-top: -3rem;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.15);
    border-radius: 20px;
}

/* blogs detalles */
.contenedor-blogd {
    display: flex;
    justify-content: space-between;
    margin-top: 9rem;
}
.contenedor-blogd .blogs__recientes {
    width: 26%;
}
.contenedor-blogd .blogs__recientes div img {
    width: 80%;
    object-fit: contain;
}
.contenedor-blogd .blogs__recientes hr {
    height: 2px;
    border: none;
    width: 40%;
    margin: 0.5rem 0;
    background-color: #b33334;
}
.contenedor-blogd .blogs__recientes {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}
.contenedor-blogd .blogs__recientes div .titulo__blog {
    font-size: 1.2rem;
    display: block;
    margin: 0.3rem 0;
}
.contenedor-blogd .blogs__recientes div .fecha__blog {
    font-size: 0.9rem;
}
.contenedor-blogd .blogs__recientes div {
    width: 100%;
    padding: 1rem;
}
.contenedor-blogd .article-textd {
    /* width: 70%; */
    width: 100%;
}
.contenedor-blogd .article-textd h2 {
    font-size: 2rem;
    text-transform: initial;
}
.contenedor-blogd .article-textd p {
    margin: 1rem 0;
}
.contenedor-blogd .article-textd .imagen__blog {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 1rem;
    gap: 3rem;
}
.contenedor-blogd .article-textd img {
    width: 45%;
    height: 30rem;
    object-fit: contain;
}
.contenedor-blogd .article-recientes h3 {
    font-size: 1.1rem;
    text-transform: uppercase;
}
.contenedor-blogd .article-recientes .blog-recientes {
    width: 100%;
}
.contenedor-blogd .article-recientes .blog-recientes button:hover {
    transform: scale(1.02);
}
.contenedor-blogd .article-recientes .blog-recientes button {
    width: 100%;
    transition: 0.2s ease all;
    height: 3rem;
    background-color: #e9eff5;
    text-align: left;
    margin: 1rem 0;
    padding: 0 0.6rem;
    font-weight: 600;
}
.contenedor-blogd .article-recientes {
    margin-top: 3rem;
    width: 30%;
}
.btn-blog {
    margin-bottom: 4rem;
}
.blogs-relacionados {
    width: 100%;
    margin: 3rem 0;
}
.blogs-relacionados .banner-title {
    font-size: 1.6rem;
}
.blogs-relacionados .blog-r {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 2rem;
    margin: 2rem 0;
}
.blogs-relacionados .blog-r .blog-card img {
    width: 100%;
    max-width: 100%;
    object-fit: cover;
    height: 15rem;
}
.blogs-relacionados .blog-r .blog-card {
    width: 21rem;
}
/* .blogs-relacionados .blog-r article .date-r {
    width: 100%;
    display: flex;
}
.blogs-relacionados .blog-r article .date-r p {
    margin-right: 15px;
} */
/* team */
.container-team {
    margin: 2rem 0;
    position: relative;
}
input:checked {
    background-color: red;
}
.arrows-team i {
    margin: 0 0.2rem;
    cursor: pointer;
}
.arrows-team {
    position: absolute;
    bottom: -2rem;
    width: 100%;
    color: var(--bittersweet);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3rem;
}
.container-team .container-arrows {
    position: absolute;
    bottom: -4rem;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.container-team .container-arrows div::after {
    content: "";
    position: absolute;
    width: 0.2rem;
    height: 0.2rem;
    border-radius: 50%;
    background-color: var(--bittersweet);
    top: 20%;
    left: 20%;
}
.container-team .container-arrows div {
    position: relative;
    width: 0.6rem;
    height: 0.6rem;
    border: 2px solid var(--bittersweet);
    border-radius: 50%;
    margin: 0.5rem;
}
.container-team .container-arrows .div-f.active-arrows {
    background-color: var(--bittersweet);
}
.container-team h2 {
    font-size: 2rem;
    text-align: center;
}
.contenedor-equipo::-webkit-scrollbar {
    background-color: transparent;
}
.contenedor-equipo {
    margin: 4rem 0;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    overflow: auto;
    scroll-behavior: smooth;
}
.contenedor-equipo article:hover .text-team {
    bottom: 0;
}
.contenedor-equipo article {
    min-width: calc(20% - 1rem);
    margin: 0.5rem;
    width: calc(20% - 1rem);
    text-align: center;
    height: 17rem;
    position: relative;
    overflow: hidden;
    transition: 0.4s ease-in all;
}
.text-team {
    transition: 0.4s ease-in all;
    position: absolute;
    bottom: -6rem;
    width: 100%;
    color: #fff;
    background-color: #df0209cd;
}
.contenedor-equipo article a {
    color: #ffff;
}
.contenedor-equipo article a:active {
    color: inherit;
}
.contenedor-equipo article h3 {
    font-weight: 500;
}
.contenedor-equipo article img {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
    object-fit: cover;
    height: 100%;
}

.container-team2 {
    position: relative;
    min-width: 100%;
    width: 100%;
    padding: 3rem 0 !important;
    background-color: #fff;
}
.container-team2 .banner-title {
    font-size: 2rem;
    text-align: center;
}

.contenedor-equipo2 {
    width: 90%;
    margin: 3rem auto;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    /* margin: 3rem 0; */
    overflow: auto;
    scroll-behavior: smooth;
    gap: 2rem;
    padding: 0.3rem;
}
.contenedor-equipo2::-webkit-scrollbar {
    background-color: transparent;
}
.arrows-team2 i {
    margin: 0 0.2rem;
    cursor: pointer;
}
.arrows-team2 {
    position: absolute;
    bottom: 2rem;
    z-index: 100;
    width: 100%;
    color: var(--bittersweet);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 3rem;
}

.contenedor-equipo2 article img {
    width: 11rem;
    height: 11rem;
    display: block;
    margin: 0 auto;
    border-radius: 50%;
    border: 2px solid var(--bittersweet);
    object-fit: cover;
    object-position: 100% -50%;
}
.contenedor-equipo2 article i {
    font-size: 1.3rem;
}
.contenedor-equipo2 article a {
    color: #000;
    font-size: 1rem;
}
.contenedor-equipo2 article a:active {
    color: inherit;
}
.contenedor-equipo2 article h3 {
    font-weight: 600;
    margin: 0.5rem 0;
    font-size: 1rem;
}
.contenedor-equipo2 article {
    text-align: center;
    min-width: calc(24.5% - 1.4rem);
    width: calc(24.5% - 1.4rem);
    padding: 0.9rem 0.7rem;
    /* margin: 0.7rem; */
    height: 18rem;
    border-radius: 9px;
    box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.2);
}

/* num */
.category-num {
    display: flex;
    justify-content: center;
    align-items: center;
}
.category-num button {
    margin: 0.4rem;
}

.content__detalles {
    margin-bottom: 2rem;
    background-color: #eee;
    border-radius: 20px;
    padding: 2rem 0;
}
.contenedor__detalles {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: -1rem;
    gap: 2rem;
}
.contenedor__detalles article img {
    width: 10rem;
    object-fit: contain;
}
.contenedor__detalles article div {
    display: grid;
    place-items: center;
}
.contenedor__detalles article {
    width: 15rem;
    padding: 1.2rem;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    display: flex;
}
/* detalles */
.contenedor-detalles {
    width: 100%;
    /* margin-top: 9rem; */
}
.contenedor-detalles .content-details {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    border-radius: 20px;
    margin: 2rem 0;
    padding: 2rem;
    background-color: #eeeeeeab;
}
.pagination-pd {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
}
.pagination-pd button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.pagination-pd button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.carousel-producto {
    width: 75%;
    display: flex;
    overflow: auto;
    margin: auto;
    height: 8rem;
    margin-top: 1rem;
    gap: 0.5rem;
    margin-bottom: .5rem;
    scroll-behavior: smooth;
    align-items: center;
}
.carousel-producto::-webkit-scrollbar {
    background-color: transparent;
}
.carousel-producto div {
    min-width: calc(33% - 0.5rem);
    width: calc(33% - 0.5rem);
    background-color: white;
    height: 6rem;
    padding: 0.8rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 2px solid #000;
    border-radius: 20px;
    cursor: pointer;
}
.carousel-producto div img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.contenedor-detalles .content-details .contenedor-imagen {
    width: 47%;
}

.contenedor-detalles .content-details .contenedor-imagen .img__principal {
    overflow: hidden;
    height: 27rem;
    padding: 2rem;
    background-color: white;
    display: block;
    margin: 0 auto;
    border-radius: 20px;
    border: 3px solid #000;
    display: grid;
    place-items: center;
    width: 100%;
}
.contenedor-detalles .content-details .contenedor-imagen .img-pd {
    object-fit: contain;
    width: 100%;
}
.contenedor-detalles .content-details .contenedor-detalle {
    width: 47%;
}
/* .contenedor-detalles
    .content-details
    .contenedor-detalle
    .button-detalles
    button {
    margin-right: 0.7rem;
} */
.contenedor-detalles .content-details .contenedor-detalle .button-detalles {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
.descriptiond {
    font-size: 1.1rem;
}
.contenedor-detalles .content-details .contenedor-detalle .category {
    font-size: 1.4rem !important;
}
.contenedor-detalles .content-details .contenedor-detalle .category b {
    font-size: 0.86rem !important;
}
.contenedor-detalles
    .content-details
    .contenedor-detalle
    .category
    b
    span:hover {
    color: #e3403e;
}
.contenedor-detalles .content-details .contenedor-detalle .category {
    margin: 1rem 0;
}
.contenedor-detalles .content-details .contenedor-detalle .price {
    color: #df0209;
    font-size: 2.8rem;
    margin: 1rem 0;
    font-weight: 600;
}
.contenedor-detalles .content-reviews {
    width: 100%;
    padding: 2rem;
    background-color: #eeeeeeab;
    border-radius: 20px;
}
.contenedor-detalles .content-reviews .contenedor__iframe h2 {
    font-size: 2rem;
    text-align: center;
}
.contenedor-detalles .content-reviews .contenedor__iframe {
    margin-top: 3rem;
}
.contenedor-detalles .content-reviews iframe {
    display: block;
    margin: auto;
    width: 85%;
    margin-top: 1rem;
    height: 40rem;
}
.contenedor-detalles .content-reviews .contenedor-reseña {
    width: 100%;
}
.contenedor-detalles .content-reviews .contenedor-reseña article .title-reseña {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2rem;
}
.contenedor-detalles
    .content-reviews
    .contenedor-reseña
    article
    .title-reseña
    h3 {
    font-size: 1.1rem;
    margin: 0 0.2rem;
    padding-bottom: 0.7rem;
    padding: 0.6rem;
    cursor: pointer;
}
.contenedor-detalles
    .content-reviews
    .contenedor-reseña
    article
    .title-reseña
    h3.focus {
    border-bottom: 2px solid #df0209;
}
.contenedor-detalles
    .content-reviews
    .contenedor-reseña
    article
    .text-reseña{
        margin-left: 8%;
    }
.contenedor-detalles
    .content-reviews
    .contenedor-reseña
    article
    .text-reseña
    h2 {
    margin-bottom: 1rem;
}
.contenedor-detalles
    .content-reviews
    .contenedor-reseña
    article
    .text-reseña
    p {
    margin: 1.4rem 0;
}
.content-relations {
    width: 100%;
    padding: 2rem;
    position: relative;
    border-radius: 20px;
    background-color: #eeeeeeab;
    margin: 2rem 0;
}
.content-relations2 {
    width: 100%;
    padding: 2rem;
    border-radius: 20px;
    position: relative;
    background-color: #eeeeeeab;
    margin: 2rem 0;
}
.pagination-relations {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
}
.pagination-relations button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.pagination-relations button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.pagination-relations2 {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
}
.pagination-relations2 button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.pagination-relations2 button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.right-relations {
    right: -1rem;
}
.left-relations {
    left: -1rem;
}
.right-relations,
.left-relations {
    position: absolute;
    top: 50%;
    font-size: 4rem;
    color: #000;
    cursor: pointer;
    z-index: 100;
}
.content-relations h2 {
    text-align: center;
    font-size: 2rem;
}
.content-relations .contenedor-relacionados::-webkit-scrollbar {
    background-color: transparent;
}
.content-relations .contenedor-relacionados {
    display: flex;
    align-items: center;
    overflow: auto;
    margin: 1rem 0;
    gap: 1rem;
    scroll-behavior: smooth;
}
.content-relations .contenedor-relacionados .showcase {
    min-width: 23.6%;
    width: 23.6%;
    border: 1px solid #c9c7c7;
}

.content-relations2 h2 {
    font-size: 2rem;
    text-align: center;
}
.content-relations2 .contenedor-relacionados2::-webkit-scrollbar {
    background-color: transparent;
}
.content-relations2 .contenedor-relacionados2 {
    display: flex;
    align-items: center;
    overflow: auto;
    margin: 1rem 0;
    gap: 1rem;
    scroll-behavior: smooth;
}
.content-relations2 .contenedor-relacionados2 .showcase {
    min-width: 23.6%;
    width: 23.6%;
    border: 1px solid #c9c7c7;
    /* text-align: center; */
}
/* .content-relations2 .contenedor-relacionados2 article .price-r {
    color: #df0209;
    font-weight: bold;
}
.content-relations2 .contenedor-relacionados2 article img {
    max-width: 80%;
    width: 80%;
    display: block;
    margin: auto;
} */

/* car */
.contenedor-carrito {
    width: 100%;
    margin: 3rem 0;
    background-color: #eee;
    border-radius: 20px;
    padding: 2rem;
}
.contenedor-carrito .content-car {
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
}
.contenedor-carrito .content-car article {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    border: 1px solid #000;
    padding: 2rem 1rem;
    border-radius: 20px;
    position: relative;
}
.contenedor-carrito .content-car article div b {
    font-size: 2rem;
}
.contenedor-carrito .content-car article div:nth-child(2){
    min-width: 17rem;
    width: 17rem;
}
.contenedor-carrito .content-car article div {
    min-width: 15%;
    text-align: left;
}
.contenedor-carrito .content-car article div:nth-child(5) {
    position: absolute;
    right: 2rem;
    bottom: 1rem;
    width: auto;
    text-align: right;
}
.contenedor-carrito .content-car article div:nth-child(1) {
    width: 9rem;
}
.contenedor-carrito .content-car article .trash {
    font-size: 1.7rem;
    cursor: pointer;
}
.contenedor-carrito .content-car article .trash:hover {
    color: #df0209;
}
.contenedor-carrito .content-car article img {
    width: 100%;
    object-fit: cover;
}
.contenedor-carrito .content-resume {
    margin-top: 3rem;
    width: 100%;
    display: flex;
    justify-content: space-between;
    /* align-items: center; */
}
.contenedor-carrito .content-resume article:nth-child(1){
    width: 58%;
}
.contenedor-carrito .content-resume article:nth-child(1) img{
    width: 55%;
    display: block;
    margin: auto;
    object-fit: contain;
}
.contenedor-carrito .content-resume article:nth-child(2) {
    width: 40%;
}
.contenedor-carrito .content-resume article p {
    position: relative;
    /* background-color: #f5dedf6d; */
    background-color: #fff;
    border-radius: 12px;
    padding: 1rem;
    margin: 1rem 0;
}
.contenedor-carrito .content-resume article p b {
    position: absolute;
    right: 10px;
}
.contenedor-carrito .content-resume article .banner-btn {
    display: block;
    margin: 0 auto;
}

/* formulario */
.contendorp-form {
    display: flex;
    justify-content: space-between;
}
.form-title {
    text-transform: uppercase;
    font-size: 1.6rem;
}
.contendorp-form {
    margin: 3rem 0;
    padding: 0 1rem;
}
.contendorp-form .article-form2 {
    width: 30%;
}
.contendorp-form .article-form1 {
    width: 67%;
}
.contendorp-form .article-form1 h2 {
    font-size: 1.1rem;
    text-transform: uppercase;
}
.contendorp-form .article-form1 .content1 fieldset,
.contendorp-form .article-form1 .content2 fieldset,
.contendorp-form .article-form1 .content3 fieldset {
    border: none;
}
.contendorp-form .article-form1 .content1,
.contendorp-form .article-form1 .content2,
.contendorp-form .article-form1 .content3 {
    padding: 0.8rem;
}
.contendorp-form .article-form1 .content1 .text1,
.contendorp-form .article-form1 .content1 .text2,
.contendorp-form .article-form1 .content1 .text3,
.contendorp-form .article-form1 .content2 .text4,
.contendorp-form .article-form1 .content3 .text6,
.contendorp-form .article-form1 .content3 .text7 {
    width: 100%;
    display: flex;
    justify-content: space-between;
}
.contendorp-form .article-form1 .content1 .text1 div,
.contendorp-form .article-form1 .content1 .text2 div,
.contendorp-form .article-form1 .content1 .text3 div,
.contendorp-form .article-form1 .content2 .text4 div,
.contendorp-form .article-form1 .content3 .text6 div,
.contendorp-form .article-form1 .content3 .text7 div {
    width: 47%;
}
.contendorp-form .article-form1 .content1 .text1 div input[type="text"],
.contendorp-form .article-form1 .content1 .text2 div input[type="text"],
.contendorp-form .article-form1 .content1 .text3 div input[type="text"],
.contendorp-form .article-form1 .content2 .text4 div input[type="text"],
.contendorp-form .article-form1 .content3 .text6 div input[type="text"],
.contendorp-form .article-form1 .content3 .text7 div input[type="text"],
.contendorp-form .article-form1 .content1 .text1 div select,
.contendorp-form .article-form1 .content2 .text4 div select {
    width: 100%;
    height: 2.6rem;
    outline: none;
    border-radius: 20px;
    background-color: #eee;
    border: 1.2px solid rgb(59, 30, 30);
    margin-bottom: 1rem;
    padding: 0.1rem 0.6rem;
}
.contendorp-form .article-form1 .content1,
.contendorp-form .article-form1 .content2,
.contendorp-form .article-form1 .content3 {
    margin: 1.4rem 0;
}
.contendorp-form .article-form1 .content3 .text8 div {
    width: 100%;
}
.contendorp-form .article-form1 .content3 .text8 div input[type="text"] {
    width: 100%;
    height: 2.6rem;
    outline: none;
    border-radius: 20px;
    background-color: #eee;
    border: 1.2px solid rgb(59, 30, 30);
    margin-bottom: 1rem;
    padding: 0.1rem 0.6rem;
}
.content-btnform a {
    margin-right: 1rem;
}
.content-btnform {
    margin-top: -2rem;
    margin-bottom: 2rem;
    margin-left: 2rem;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contendorp-form .article-form2 fieldset {
    border: none;
}
.contendorp-form .article-form2 fieldset .article-details {
    padding: 0.8rem;
}

.contendorp-form .article-form2 h2 {
    font-size: 1.1rem;
    text-transform: uppercase;
}
.contendorp-form .article-form2 .article-details {
    display: flex;
    justify-content: space-between;
}
.contendorp-form .article-form2 .article-details article p {
    margin: 0;
}

/* blogs */
.container-blogs .banner-title {
    font-size: 2rem;
    text-align: center;
    margin-top: 2rem;
}
.blog-contenedor {
    margin: 2rem 0;
    /* display: flex; */
    /* -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start; */
    /* align-items: flex-start; */
    /* justify-content: center; */
    /* gap: 15px; */
    /* flex-wrap: wrap; */
    overflow-x: auto;
}
.blog-contenedor .blog-content {
    max-width: 20rem;
    width: 20rem;
    min-width: 20rem;
    padding: 0.5rem;
}
.blog-content a {
    margin: 1rem 0;
}
.blog-content {
    padding: 0.5rem;
    /* margin-top: -1rem; */
}

/* otros productos */
.container-products {
    margin: 2rem 0;
}
.container-products h2 {
    font-size: 2rem;
    text-align: center;
}
.contenedor-productos {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.contenedor-productos article {
    width: 27%;
    text-align: center;
    background-color: #eee;
    padding: 0.5rem;
    border-radius: 10px;
    margin: 1rem;
}
.contenedor-productos article h2 {
    font-size: 1.5rem;
}
.contenedor-productos article .banner-btn {
    text-align: center;
    display: block;
    margin: 0.3rem auto;
}
.contenedor-productos article img {
    max-width: 100%;
    min-width: 100%;
    width: 100%;
    height: 18rem;
}

/* nosotros */
.container-us {
    margin: 2rem 0;
}
.container-us .banner-title {
    font-size: 1.4rem;
    text-align: center;
    margin-top: 3rem;
}
.contenedor-nosotros {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 2rem 0;
}
.contenedor-nosotros article {
    width: 47%;
    height: 22rem;
    overflow: auto;
}
.contenedor-nosotros .article-img {
    height: 22rem;
}
.contenedor-nosotros .article-img img {
    min-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.contenedor-nosotrosv {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    background-image: linear-gradient(to top, #07060ac4 0%, #000000bb 100%),
        url(../images/banner-1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
.contenedor-nosotrosv article {
    width: 50%;
    color: white;
    margin: 0.4rem 0;
}

.container-maps p {
    text-align: center;
    margin-bottom: 1rem;
}
.container-maps .banner-title {
    font-size: 2rem;
    text-align: center;
}

/* marcas index  */

.slick-dots li{
    margin: 0 !important;
}

.modal__marcas.visible {
    display: block;
}
.modal__marcas {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100000;
    height: 100%;
    background-color: #0000009d;
}
.modal__marcas .contenedor__m-marcas {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.modal__marcas .contenedor__m-marcas article {
    width: 45%;
    border-radius: 5px;
    padding: 1.5rem;
    background-color: white;
}

.container-marcas2 {
    position: relative;
    /* min-width: 100%; */
    width: 100%;
    padding: 2rem 0rem !important;
    /* background-color: #eae1e1; */
}
.container-marcas2 .container-arrows {
    position: absolute;
    width: 60%;
    bottom: 2rem;
    display: flex;
    left: 50%;
    transform: translateX(-50%);
    justify-content: center;
    align-items: center;
}
.container-marcas2 .container-arrows div::after {
    content: "";
    position: absolute;
    width: 0.2rem;
    height: 0.2rem;
    border-radius: 50%;
    background-color: var(--bittersweet);
    top: 20%;
    left: 20%;
}
.container-marcas2 .container-arrows div {
    position: relative;
    width: 0.6rem;
    height: 0.6rem;
    border: 2px solid var(--bittersweet);
    border-radius: 50%;
    margin: 0.5rem;
    cursor: pointer;
}
.container-marcas2 .container-arrows div.active-flecha {
    background-color: var(--bittersweet);
}
.content-button {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 2rem 0;
}
.content-button .banner-title {
    margin-left: 13%;
    flex: 1;
    text-align: center;
    font-size: 2rem;
    vertical-align: bottom;
}
.pagination-marcas {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    margin-top: -1rem;
}
.pagination-marcas button.active-pagination {
    background-color: #dd232a;
    width: 23px;
}
.pagination-marcas button {
    width: 16px;
    height: 4px;
    background-color: #dd232a8c;
}
.contenedor-mimg::-webkit-scrollbar {
    background-color: transparent;
}
.contenedor-mimg {
    display: flex;
    align-items: center;
    overflow: auto;
    margin: 1rem auto;
    gap: 1.5rem;
    scroll-behavior: smooth;
}
.contenedor-mimg img {
    /* width: 10rem; */
    /* min-width: calc(14.28% - 1.5rem); */
    /* filter: grayscale(1); */
    /* width: calc(14.28% - 1.5rem); */
    object-fit: contain;
    height: 2.5rem;
    cursor: pointer;
}
/* .contenedor-mimg img:hover {
    filter: grayscale(0);
} */

/* suscribirse */
.content-suscribete {
    margin: 5rem auto;
    width: 77%;
    background-color: #df0209c6;
    height: 18rem;
    display: flex;

    justify-content: space-between;
    align-items: center;
    border-radius: 17px;
    padding: 1.2rem 1.8rem;
}
.content-suscribete .article-texts h2 {
    margin-bottom: 1rem;
    font-size: 1.7rem;
}
.content-suscribete .article-texts .input {
    height: 3.5rem;
    overflow: auto;
    position: relative;
}
.content-suscribete .article-texts .input .banner-btn {
    position: absolute;
    top: 18%;
    text-align: center;
    right: 5px;
}
.content-suscribete .article-texts .input input[type="text"] {
    border-radius: 10px;
    height: 100%;
    padding: 0.4rem;
    outline: none;
    border: none;
}
.content-suscribete .article-texts p {
    font-size: 1rem;
    margin-bottom: 1.2rem;
}
.content-suscribete .article-texts {
    color: #fff;
    width: 40%;
    height: 100%;
}
.content-suscribete .article-imgs {
    width: 51%;
    height: 100%;
}
.content-suscribete .article-imgs img {
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
}

/* .content-suscribete .banner-title{
  text-align: center;
  font-size: 1.5rem;
  color: #fff;
  margin-bottom: 1rem 0;
}
.content-suscribete .text-input{
  width: 80%;
  display: flex;
  justify-content: space-between;
}
.content-suscribete .text-input input[type="text"]{
  width: 73%;
  border-radius: 5px;
  padding: .5rem .8rem;
  border: none;
  outline: none;
}
.content-suscribete .text-input button{
  width: 25%;
} */

/* marcas */

.container-marcas {
    margin: 2rem 0;
}
.container-marcas .contenedor-marcas .banner-title {
    font-size: 2rem;
    margin: 2rem 0;
    text-align: center;
}
.container-marcas .contenedor-marcas .content-marcas {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin: 2rem 0;
    gap: 3rem;
}
.container-marcas .contenedor-marcas .content-marcas article hr {
    border: none;
    background-color: gray;
    height: 1px;
    width: 100%;
    /* margin-top: 0.5rem;
    margin-bottom: 1rem; */
}
.slick-slide img{
    width: 100% !important;
    object-fit: contain;
}
.container-marcas .contenedor-marcas .content-marcas article {
    width: 21%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.container-marcas .contenedor-marcas .content-marcas article button{
    width: 80%;
}
.container-marcas .contenedor-marcas .content-marcas article img {
    height: 2rem;
    object-fit: contain;
    width: 9rem;
}

/* categorias */
.container-category {
    width: 100%;
    margin: 2rem 0;
}
.contenedor-categoria .banner-title {
    font-size: 2rem;
    margin-bottom: 1rem;
    text-align: center;
}
.contenedor-categoria {
    margin: 2rem 0;
}
.contenedor-categoria .content-category {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.contenedor-categoria .content-category article {
    width: 16rem;
    margin: 0.6rem;
    padding: 1rem;
    text-align: center;
    background-color: #ffff;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.25);
    border-radius: 10px;
    padding-bottom: 0.8rem;
}
.contenedor-categoria .content-category article img {
    min-width: 100%;
    max-width: 100%;
    width: 100%;
}
.contenedor-categoria .content-category article h2 {
    font-weight: 900;
    font-size: 1.1rem;
    margin: 1rem 0;
}
.contenedor-categoria .content-category article .banner-btn {
    display: block;
    color: #fff !important;
    margin: 0 auto;
}

/* datos del usuraio */
.datos-user {
    /* margin-top: 3rem !important; */
    background-color: #eee;
    margin-top: 2rem !important;
    padding: 2rem;
    border-radius: 20px;
    margin-bottom: 2rem !important;
}
.contenedor__user {
    display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
}
.form-pago form {
    margin-top: 4rem;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
.form-pago form button {
    margin-top: 1rem;
}
.form-pago form div {
    margin: 0.7rem 0;
}
.form-pago form div:nth-child(1) {
    width: 48%;
}
.form-pago form div:nth-child(2) {
    width: 48%;
}
.form-pago form div:nth-child(3) {
    width: 100%;
}
.form-pago form div:nth-child(4) {
    width: 100%;
}
.form-pago form div:nth-child(5) {
    width: 100%;
}
.form-pago form div:nth-child(6) {
    width: 100%;
}
.form-pago form div:nth-child(7) {
    width: 48%;
}
.form-pago form div:nth-child(8) {
    width: 48%;
}
.form-pago form div label{
    display: block;
    color: #1a0b5b;
    margin-bottom: .1rem;
}
.form-pago form div input[type="text"],
.form-pago form div select {
    height: 3rem;
    background-color: white;
    /* border: 1px solid #000; */
    width: 100%;
    padding: 0 1rem;
    outline: none;
    border: none;
    border-radius: 12px;

}
.form-pago {
    width: 68%;
}
.num-form {
    display: flex;
    width: 38rem;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    margin-top: 1rem;
}
.num-form ion-icon {
    color: gray;
    font-size: 1.7rem;
}
.resumen__form {
    margin-top: 3rem;
    width: 100% !important;
    padding: 2rem;
    background: #fcf3f3;
    border-radius: 15px;
}
.resumen__form h2 {
    margin-bottom: 2rem;
}
.resumen__form p {
    font-size: 1.2rem;
    margin: 1rem 2rem;
}
.pages-form {
    display: flex;
    /* width: 40rem; */
    width: 100%;
    margin-top: 3rem;
    /* justify-content: space-between; */
    justify-content: center;
    gap: 2rem;
    align-items: center;
}
.pages-form article ion-icon{
    font-size: 2rem;
}
.pages-form article span {
    width: 2rem;
    height: 2rem;
    margin-bottom: 0.5rem;
    border-radius: 50%;
    background-color: #0000009e;
}
.pages-form article.active-page {
    border: 1px solid #000;
}
.article-map-form b {
    margin: 0.5rem 0;
}
.map-form iframe{
    width: 100%;
    height: 100%;
}
.map-form {
    width: 15rem !important;
    background-color: #fff;
    height: 10rem;
}
.pages-form article {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 12rem;
    background-color: #fcf3f3;
    border-radius: 12px;
    height: 8rem;
}
.pages-form article:hover {
    box-shadow: 0 5px 20px hsla(0, 0%, 0%, 0.5);
    transition: 0.5s ease;
    -o-transition: 0.5s ease;
}
.article-ahorro {
    display: flex;
    justify-content: space-between;
    gap: 3.5rem;
}
.article-ahorro .ahorrar-image {
    width: 30rem;
    border-radius: 15px;
    padding: 0 1.5rem;
    height: 6rem;
    background-color: #fff4c3;
    display: flex;
    align-items: center;
    gap: 1rem;
}
.article-ahorro .ahorrar-image p {
    font-style: italic;
    margin: 0.2rem 0;
}
.article-ahorro .ahorrar-image img {
    width: 3rem;
}
.num-form div {
    display: flex;
    flex-direction: column;
    /* justify-content: center; */
    align-items: center;
    gap: 0.4rem;
    height: 7rem;
    width: calc(25% - 1rem);
}
.num-form div p {
    text-align: center;
}
.num-form div span.active-span {
    background-color: #000;
}
.num-form div span {
    width: 2rem;
    display: grid;
    place-items: center;
    height: 2rem;
    border-radius: 50%;
    background-color: #8c7b7b;
    color: #fff;
}

.resumen-compra {
    width: 27%;
    margin-top: 4rem;
    padding: 1.5rem;
    height: 15rem;
    border-radius: 15px;
    /* background-color: #fcf3f3; */
    background-color: #fff;
}
.resumen-compra h2 {
    font-size: 1.3rem;
    text-transform: uppercase;
}

.resumen-compra div {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 1rem 0;
}

/* contactanos */
.container-contactanos .banner-title {
    font-size: 2rem;
    text-align: center;
    margin: 3rem 0;
}
.form__phone p ion-icon,
.form__phone p i{
    font-size: 1rem;
    display: inline-block;
}
.form__phone div{
    margin: 1rem 0;
}
.contenedor-principalFor {
    display: flex;
    justify-content: space-between;
}
.content-iframe {
    width: 27%;
}
.formulario-contactanos .banner-btn {
    margin: 1rem 0;
}
.formulario-contactanos {
    width: 70%;
}
.content1-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.content1-form div {
    width: 49%;
    margin: 0.7rem 0;
}
.content1-form div input[type="text"]:focus {
    border: 2px solid black;
}
.content1-form div input[type="text"] {
    width: 100%;
    color: black;
    background-color: #eee;
    padding: 0.4rem 0.7rem;
    border: none;
    outline: none;
    border-radius: 12px;
}
.content1-form div input[type="text"]::placeholder {
    color: black;
}
.content2-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.content2-form div {
    width: 49%;
    margin: 0.7rem 0;
}
.content2-form div input[type="text"]:focus {
    border: 2px solid black;
}
.content2-form div input[type="text"] {
    width: 100%;
    color: black;
    background-color: #eee;
    padding: 0.4rem 0.7rem;
    border: none;
    outline: none;
    border-radius: 12px;
}
.content2-form div input[type="text"]::placeholder {
    color: black;
}
.content3-form {
    display: flex;
    justify-content: center;
    align-items: center;
}
.content3-form div {
    width: 100%;
    margin: 0.7rem 0;
}
.content3-form div textarea:focus {
    border: 2px solid black;
}
.content3-form div textarea {
    width: 100%;
    color: black;
    background-color: #eee;
    padding: 0.4rem 0.7rem;
    border: none;
    outline: none;
    border-radius: 12px;
    resize: none;
}
.content3-form div textarea::placeholder {
    color: black;
}

/**
 * MODAL 
 */

.modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: hsla(0, 0%, 0%, 0.5);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10;
    -webkit-animation: popup 1s ease-in-out 5s forwards;
    animation: popup 1s ease-in-out 5s forwards;
}

@-webkit-keyframes popup {
    0% {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    100% {
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }
}

@keyframes popup {
    0% {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }

    100% {
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }
}

.modal.closed {
    display: none;
}

.modal-close-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.newsletter-img {
    display: none;
}

.modal-content {
    position: relative;
    max-width: 350px;
    margin: 20px;
    background: var(--white);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    overflow: hidden;
    z-index: 2;
    -webkit-animation: scaleUp 0.5s ease-in-out 5s forwards;
    animation: scaleUp 0.5s ease-in-out 5s forwards;
}

@-webkit-keyframes scaleUp {
    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes scaleUp {
    0% {
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    }
    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

.modal-close-btn {
    position: absolute;
    top: 15px;
    right: 15px;
    background: var(--salmon-pink);
    color: var(--white);
    font-size: 16px;
    padding: 5px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
}

.modal-close-btn:hover {
    opacity: 0.9;
}

.modal-close-btn ion-icon {
    --ionicon-stroke-width: 70px;
}

.newsletter {
    padding: 50px 30px;
    text-align: center;
}

.newsletter-header {
    margin-bottom: 20px;
}

.newsletter-title {
    color: var(--onyx);
    font-size: var(--fs-2);
    font-weight: var(--weight-600);
    margin-bottom: 10px;
}

.newsletter-desc {
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    line-height: 1.6;
}

.email-field {
    font-size: var(--fs-7);
    padding: 8px 16px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--cultured);
    margin-bottom: 16px;
}

.btn-newsletter {
    background: var(--eerie-black);
    color: var(--white);
    font-size: var(--fs-7);
    font-weight: var(--weight-600);
    text-transform: uppercase;
    padding: 10px 15px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
    margin: auto;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.btn-newsletter:hover {
    background: var(--salmon-pink);
}

/**
 * NOTIFICATION TOAST 
 */

.notification-toast {
    position: fixed;
    bottom: 80px;
    left: 20px;
    right: 20px;
    background: var(--white);
    max-width: 300px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 15px;
    padding: 15px;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    -webkit-box-shadow: 0 5px 20px hsla(0, 0%, 0%, 0.15);
    box-shadow: 0 5px 20px hsla(0, 0%, 0%, 0.15);
    -webkit-transform: translateX(-webkit-calc(-100% - 40px));
    -ms-transform: translateX(calc(-100% - 40px));
    transform: translateX(calc(-100% - 40px));
    -webkit-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
    z-index: 5;
    -webkit-animation: slideInOut 10s ease-in-out infinite;
    animation: slideInOut 10s ease-in-out infinite;
}

@-webkit-keyframes slideInOut {
    0%,
    45%,
    100% {
        -webkit-transform: translateX(-webkit-calc(-100% - 40px));
        transform: translateX(calc(-100% - 40px));
        opacity: 0;
        visibility: hidden;
    }

    50%,
    95% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        visibility: visible;
    }
}

@keyframes slideInOut {
    0%,
    45%,
    100% {
        -webkit-transform: translateX(-webkit-calc(-100% - 40px));
        transform: translateX(calc(-100% - 40px));
        opacity: 0;
        visibility: hidden;
    }

    50%,
    95% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
        visibility: visible;
    }
}

.notification-toast.closed {
    display: none;
}

.toast-close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    color: var(--sonic-silver);
}

.toast-close-btn ion-icon {
    --ionicon-stroke-width: 50px;
}

.toast-banner {
    width: 70px;
    height: 70px;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
}

.toast-banner img {
    width: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
    -o-object-position: center;
    object-position: center;
}

.toast-detail {
    width: -webkit-calc(100% - 85px);
    width: calc(100% - 85px);
    padding-right: 10px;
}

.toast-message {
    font-size: var(--fs-10);
    color: var(--sonic-silver);
    margin-bottom: 8px;
}

.toast-title {
    font-size: var(--fs-7);
    font-weight: var(--weight-500);
    color: var(--onyx);
}

.toast-meta {
    font-size: var(--fs-10);
    color: var(--sonic-silver);
}

/*-----------------------------------*\
  #HEADER
\*-----------------------------------*/

.header-top,
.header-user-actions,
.desktop-navigation-menu {
    display: none;
}

.header-main {
    padding: 20px 0;
    border-bottom: 1px solid var(--cultured);
}

.header-logo {
    margin-bottom: 20px;
}

.header-logo img {
    margin: auto;
}

.header-search-container {
    position: relative;
}

.header-search-container .search-field {
    font-size: var(--fs-7);
    color: var(--onyx);
    padding: 10px 15px;
    padding-right: 50px;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
}

.search-field::-webkit-search-cancel-button {
    display: none;
}

.search-btn {
    background: var(--white);
    position: absolute;
    top: 50%;
    right: 2px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    color: var(--onyx);
    font-size: 18px;
    padding: 8px 15px;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    -webkit-transition: color var(--transition-timing);
    -o-transition: color var(--transition-timing);
    transition: color var(--transition-timing);
}

.search-btn:hover {
    color: var(--salmon-pink);
}

.mobile-bottom-navigation {
    background: var(--white);
    position: fixed;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 100%;
    max-width: 500px;
    margin: auto;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 5px 0;
    -webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.25);
    box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.25);
    z-index: 5;
}

.mobile-bottom-navigation .action-btn {
    position: relative;
    font-size: 26px;
    color: var(--eerie-black);
    padding: 10px;
}

.mobile-bottom-navigation .count {
    background: var(--bittersweet);
    color: var(--white);
    position: absolute;
    top: 0;
    right: 0;
    font-size: 12px;
    font-weight: var(--weight-500);
    line-height: 1;
    padding: 2px 4px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
}

.mobile-navigation-menu {
    background: var(--white);
    position: fixed;
    top: 0;
    left: -100%;
    width: 100%;
    max-width: 320px;
    height: 100vh;
    padding: 20px;
    -webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.1);
    box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.1);
    overflow-y: scroll;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    visibility: hidden;
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
    z-index: 20;
}

.mobile-navigation-menu.active {
    left: 0;
    visibility: visible;
}

.menu-top {
    padding-bottom: 15px;
    margin-bottom: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 2px solid var(--cultured);
}

.menu-top .menu-title {
    color: var(--salmon-pink);
    font-size: var(--fs-4);
    font-weight: var(--weight-600);
}

.menu-close-btn {
    color: var(--eerie-black);
    font-size: 22px;
}

.menu-close-btn ion-icon {
    --ionicon-stroke-width: 50px;
}

.mobile-menu-category-list {
    margin-bottom: 30px;
}

.menu-category .accordion-menu {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.mobile-menu-category-list .menu-category {
    border-bottom: 1px solid var(--cultured);
}

.mobile-menu-category-list .menu-title {
    color: var(--onyx);
    font-size: var(--fs-6);
    font-weight: var(--weight-500);
    padding: 12px 0;
}

.accordion-menu > div {
    font-size: 14px;
}

.accordion-menu ion-icon {
    color: var(--onyx);
    --ionicon-stroke-width: 90px;
}

.accordion-menu.active .add-icon,
.accordion-menu .remove-icon {
    display: none;
}

.accordion-menu .add-icon,
.accordion-menu.active .remove-icon {
    display: block;
}

.menu-category .submenu-category-list {
    margin-left: 10px;
}

.submenu-title {
    padding: 6px 0;
    font-size: var(--fs-6);
    color: var(--sonic-silver);
    font-weight: var(--weight-300);
}

.submenu-title:hover {
    color: var(--davys-gray);
}

.submenu-category-list {
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    -webkit-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.submenu-category-list.active {
    max-height: 148px;
    visibility: visible;
}

.menu-bottom .menu-category-list {
    margin-bottom: 20px;
}

.menu-bottom .menu-category {
    border-bottom: none;
}

.menu-bottom .menu-title {
    font-size: var(--fs-6);
    font-weight: var(--weight-500);
    color: var(--eerie-black);
    padding: 12px 0;
}

.accordion-menu.active .caret-back {
    -webkit-transform: rotate(-0.25turn);
    -ms-transform: rotate(-0.25turn);
    transform: rotate(-0.25turn);
}

.menu-bottom .submenu-category-list {
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    padding: 0 15px;
    margin-left: 0;
    -webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.05);
    box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.05);
}

.menu-bottom .submenu-category:not(:last-child) {
    border-bottom: 1px solid var(--cultured);
}

.menu-social-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.menu-social-container .social-link {
    background: var(--cultured);
    color: var(--eerie-black);
    font-size: 20px;
    padding: 10px;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
}

/*-----------------------------------*\
  #BANNER
\*-----------------------------------*/

.banner {
    margin: 30px 0;
}

.slider-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    overflow: auto hidden;
    -webkit-scroll-snap-type: inline mandatory;
    -ms-scroll-snap-type: inline mandatory;
    scroll-snap-type: inline mandatory;
    overscroll-behavior-inline: contain;
}

.slider-item {
    position: relative;
    min-width: 100%;
    max-height: 450px;
    aspect-ratio: 1 / 1;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    overflow: hidden;
    scroll-snap-align: start;
}

.slider-item .banner-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: right;
    object-position: right;
}

.banner-content {
    background: hsla(0, 0%, 100%, 0.8);
    position: absolute;
    bottom: 25px;
    left: 25px;
    right: 25px;
    padding: 20px 25px;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
}

.banner-subtitle {
    color: var(--salmon-pink);
    font-size: var(--fs-7);
    font-weight: var(--weight-500);
    text-transform: capitalize;
    letter-spacing: 2px;
    margin-bottom: 10px;
}

.banner-title {
    color: var(--eerie-black);
    font-size: var(--fs-1);
    text-transform: uppercase;
    line-height: 1;
    margin-bottom: 10px;
}

.banner-text {
    display: none;
}

.banner-btn-cancel {
    padding: 0.2rem 1.1rem;
    text-align: center;
    border: 2px solid #8c8c8c;
    background-color: #c6c6c6;
    color: #353535 !important;
    border-radius: 5px;
    outline: none;
    cursor: pointer;
    font-size: 1.2rem;
}
.banner-btn-cancel:hover {
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.5);
}

.banner-btn {
    padding: 0.2rem 1.1rem;
    text-align: center;
    border: 2px solid #000;
    background-color: #b33334;
    color: #fff !important;
    border-radius: 5px;
    outline: none;
    cursor: pointer;
    font-size: 1.2rem;
}
.banner-btn:hover {
    background-color: #c94848;
    font-weight: bold;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.5);
}

/*-----------------------------------*\
  #CATEGORY
\*-----------------------------------*/

.category {
    margin-bottom: 30px;
}

.category-item-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    overflow: auto hidden;
    -webkit-scroll-snap-type: inline mandatory;
    -ms-scroll-snap-type: inline mandatory;
    scroll-snap-type: inline mandatory;
    overscroll-behavior-inline: contain;
}

.category-item {
    min-width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding: 15px;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    scroll-snap-align: start;
}

.category-img-box {
    background: var(--cultured);
    border: 1px solid hsl(0, 0%, 80%);
    padding: 10px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
}

.category-content-box {
    width: 100%;
}

.category-content-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
}

.category-item-title {
    color: var(--eerie-black);
    font-size: var(--fs-9);
    font-weight: var(--weight-600);
    text-transform: uppercase;
}

.category-item-amount {
    color: var(--sonic-silver);
    font-size: var(--fs-11);
}

.category-btn {
    color: var(--salmon-pink);
    font-size: var(--fs-9);
    font-weight: var(--weight-500);
    text-transform: capitalize;
}

/*-----------------------------------*\
  #SIDEBAR
\*-----------------------------------*/

.sidebar {
    background: var(--white);
    position: fixed;
    top: 7.6rem;
    left: -100%;
    bottom: 0;
    width: 100%;
    max-width: 320px;
    padding: 30px;
    overflow-y: scroll;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    visibility: hidden;
    -webkit-transition: 0.5s ease;
    -o-transition: 0.5s ease;
    transition: 0.5s ease;
    z-index: 20;
    /* background-color: #fcf3f3; */
}

.sidebar.active {
    left: 0;
    visibility: visible;
}

.sidebar-category {
    background-color: #fcf3f3;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--cultured);
}

.sidebar-top {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 10px;
}

.sidebar-title {
    color: var(--onyx);
    font-size: var(--fs-5);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    font-weight: var(--weight-600);
}

.sidebar-close-btn {
    display: none;
    color: var(--eerie-black);
    font-size: 22px;
    font-weight: var(--weight-600);
}

.sidebar-close-btn ion-icon {
    --ionicon-stroke-width: 50px;
}

.sidebar-accordion-menu {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    /* -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center; */
    flex-direction: row-reverse;
    justify-content: flex-end;
    text-align: left;
    padding: 7px 0;
}

.sidebar .menu-title-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    /* -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center; */
    /* gap: 10px; */
    gap: 0.1rem;
}

.sidebar .menu-title {
    font-size: var(--fs-5);
    color: var(--sonic-silver);
    font-weight: var(--weight-500);
    margin-left: 0.2rem;
}

.sidebar-accordion-menu ion-icon {
    color: var(--sonic-silver);
    font-size: 14px;
    --ionicon-stroke-width: 70px;
}

.sidebar-submenu-category-list {
    border-top: 1px solid var(--cultured);
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    -webkit-transition: 0.5s ease-in-out;
    -o-transition: 0.5s ease-in-out;
    transition: 0.5s ease-in-out;
}

.sidebar-submenu-category-list.active {
    padding: 13px 0 8px;
    max-height: 122px;
    visibility: visible;
}

.sidebar-submenu-title {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    padding: 2px 0;
}

.sidebar-submenu-title:hover {
    color: var(--eerie-black);
}

.sidebar .product-name {
    text-transform: capitalize;
}

.sidebar-accordion-menu.active .add-icon,
.sidebar-accordion-menu .remove-icon {
    display: none;
}

.sidebar-accordion-menu .add-icon,
.sidebar-accordion-menu.active .remove-icon {
    display: block;
}

.sidebar .showcase-heading {
    font-size: var(--fs-5);
    font-weight: var(--weight-600);
    color: var(--onyx);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 15px;
}

.sidebar .showcase {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}

.sidebar .showcase:not(:last-child) {
    margin-bottom: 15px;
}

.sidebar .showcase-img {
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
}

.sidebar .showcase-content {
    width: -webkit-calc(100% - 90px);
    width: calc(100% - 90px);
}

.sidebar .showcase-title {
    color: var(--onyx);
    font-size: var(--fs-7);
    font-weight: var(--weight-400);
    text-transform: capitalize;
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    letter-spacing: 0.5px;
}

.sidebar .showcase-rating {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--sandy-brown);
    font-size: 13px;
    padding: 4px 0;
}

.sidebar .price-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}

.sidebar .price-box del {
    color: var(--sonic-silver);
    font-size: 13px;
}

.sidebar .price-box .price {
    font-size: var(--fs-7);
    font-weight: var(--weight-600);
    color: var(--davys-gray);
}

/*-----------------------------------*\
  #PRODUCT MINIMAL
\*-----------------------------------*/

.product-minimal {
    margin-bottom: 30px;
}

.product-minimal .product-showcase {
    margin-bottom: 10px;
}

.product-minimal .showcase-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-scroll-snap-type: inline mandatory;
    -ms-scroll-snap-type: inline mandatory;
    scroll-snap-type: inline mandatory;
}

.product-minimal .showcase-container {
    min-width: 100%;
    padding: 0 5px;
    scroll-snap-align: start;
}

.product-minimal .showcase {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    border: 1px solid var(--cultured);
    padding: 15px;
    /* -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md); */
}

.product-minimal .showcase:not(:last-child) {
    margin-bottom: 15px;
}

.product-minimal .showcase-content {
    width: -webkit-calc(100% - 85px);
    width: calc(100% - 85px);
}

.product-minimal .showcase-title {
    color: var(--eerie-black);
    font-size: var(--fs-7);
    font-weight: var(--weight-600);
    text-transform: capitalize;
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    margin-bottom: 2px;
}

.product-minimal .showcase-category {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    color: var(--davys-gray);
    font-size: var(--fs-8);
    text-transform: capitalize;
    margin-bottom: 3px;
}

.product-minimal .showcase-category:hover {
    color: var(--salmon-pink);
}

.product-minimal .price-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.product-minimal .price {
    font-size: var(--fs-7);
    font-weight: var(--weight-700);
    color: var(--salmon-pink);
}

.product-minimal .price-box del {
    font-size: var(--fs-9);
    color: var(--sonic-silver);
}

/*-----------------------------------*\
  #PRODUCT FEATURED
\*-----------------------------------*/

.product-featured {
    margin-bottom: 30px;
}

.product-featured .showcase-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-scroll-snap-type: inline mandatory;
    -ms-scroll-snap-type: inline mandatory;
    scroll-snap-type: inline mandatory;
}

.product-featured .showcase-container {
    min-width: 100%;
    padding: 30px;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    scroll-snap-align: start;
}

.product-featured .showcase-img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.product-featured .showcase-content {
    margin-top: 30px;
}

.product-featured .showcase-rating {
    color: var(--sandy-brown);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    margin-bottom: 15px;
}

.product-featured .showcase-title {
    font-size: var(--fs-7);
    color: var(--eerie-black);
    overflow: hidden;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    text-transform: uppercase;
    margin-bottom: 3px;
}

.product-featured .showcase-desc {
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    font-weight: var(--weight-300);
    margin-bottom: 10px;
}

.product-featured .price-box {
    font-size: var(--fs-3);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

.product-featured .price {
    color: var(--salmon-pink);
    font-weight: var(--weight-700);
}

.product-featured del {
    color: var(--sonic-silver);
    font-weight: var(--weight-300);
}

.product-featured .add-cart-btn {
    background: var(--salmon-pink);
    padding: 8px 15px;
    color: var(--white);
    font-weight: var(--fs-9);
    font-weight: var(--weight-700);
    text-transform: uppercase;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    margin-bottom: 15px;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.product-featured .add-cart-btn:hover {
    background: var(--eerie-black);
    color: var(--white);
}

.product-featured .showcase-status {
    margin-bottom: 15px;
}

.product-featured .showcase-status .wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--eerie-black);
    font-size: var(--fs-9);
    font-weight: var(--weight-400);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.product-featured .showcase-status-bar {
    background: var(--cultured);
    position: relative;
    height: 10px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.product-featured .showcase-status-bar::before {
    position: absolute;
    content: "";
    top: 3px;
    left: 3px;
    height: 4px;
    width: 40%;
    background: var(--salmon-pink);
    -webkit-border-radius: 4px;
    border-radius: 4px;
}

.product-featured .countdown-desc {
    color: var(--eerie-black);
    font-size: var(--fs-9);
    font-weight: var(--weight-600);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.product-featured .countdown {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 5px;
}

.product-featured .countdown-content {
    padding: 5px;
    background: var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    text-align: center;
}

.product-featured .display-number {
    color: var(--eerie-black);
    font-size: var(--fs-5);
    font-weight: var(--weight-500);
    min-width: 40px;
}

.product-featured .display-text {
    color: var(--davys-gray);
    font-size: var(--fs-11);
}

/*-----------------------------------*\
  #PRODUCT GRID
\*-----------------------------------*/

.product-main {
    margin-bottom: 30px;
}

.product-grid {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    gap: 25px;
}

.showcase {
    border: 1px solid var(--cultured);
    overflow: hidden;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: white;
    border-radius: var(--border-radius-md);
    height: 13rem;
}
.showcase .button-carrito ion-icon {
    font-size: 1.5rem;
    margin: 0.2rem 0;
}
.showcase .button-carrito {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #e3403e;
    color: #eee;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.3rem;
}

.showcase:hover {
    -webkit-box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.1);
    box-shadow: 0 0 10px hsla(0, 0%, 0%, 0.1);
}

.showcase-banner {
    position: relative;
    height: 11rem;
    width: 85%;
    margin: auto;
    overflow: hidden;
    margin-top: 0;
}

.product-img {
    width: 100%;
    height: 100%;
    /* -o-object-fit: cover;
    object-fit: cover; */
    padding-left: 0.4rem;
    object-fit: contain;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.product-img.default {
    position: relative;
    z-index: 1;
}

.product-img.hover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 0;
}

#categoriaP {
    outline: none;
    width: 100%;
    margin: 0.7rem 0;
    background: #fff;
    border-radius: 0.5rem;
    padding: 0.3rem;
    font-size: 1rem;
    color: var(--black);
    text-transform: none;
}

/* .showcase:hover .product-img.hover {
    opacity: 1;
}

 .showcase:hover .product-img.default {
    opacity: 0;
} */

/* .product-grid .showcase:hover .product-img {
    -webkit-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
} */

.showcase-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    background: var(--ocean-green);
    font-size: var(--fs-8);
    font-weight: var(--weight-500);
    color: var(--white);
    padding: 0 8px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
    z-index: 3;
}

.showcase-badge.angle {
    top: 8px;
    left: -29px;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    text-transform: uppercase;
    font-size: 11px;
    padding: 5px 40px;
}

.showcase-badge.black {
    background: var(--eerie-black);
}

.showcase-badge.pink {
    background: var(--salmon-pink);
}

.showcase-actions {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    -webkit-transform: translateX(50px);
    -ms-transform: translateX(50px);
    transform: translateX(50px);
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
    z-index: 3;
}

.showcase:hover .showcase-actions {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}

.btn-action {
    background: var(--white);
    color: var(--sonic-silver);
    margin-bottom: 5px;
    border: 1px solid var(--cultured);
    padding: 5px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.btn-action:hover {
    background: var(--eerie-black);
    color: var(--white);
    border-color: var(--eerie-black);
}

.showcase-content {
    padding: 15px 20px 0;
    margin-top: -2rem;
}

.showcase-category {
    color: var(--salmon-pink);
    font-size: var(--fs-9);
    font-weight: var(--weight-500);
    text-transform: uppercase;
    margin-bottom: 10px;
}

.showcase-title {
    color: var(--sonic-silver);
    font-size: var(--fs-8);
    font-weight: var(--weight-300);
    text-transform: capitalize;
    letter-spacing: 1px;
    margin-bottom: 10px;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.showcase-title:hover {
    color: var(--eerie-black);
}

.showcase-rating {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    color: var(--sandy-brown);
    margin-bottom: 10px;
}

.price-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    font-size: var(--fs-7);
    color: var(--eerie-black);
    margin-bottom: 10px;
}

.price {
    font-weight: var(--weight-700);
}

del {
    color: var(--sonic-silver);
}

/* login */
.card-body {
    background-color: #eee;
    width: 45%;
    display: block;
    margin: 2rem auto;
    padding: 1rem 0.6rem;
    border-radius: 15px;
}
.card-body form label {
    margin-left: 3%;
}
.card-body form select {
    width: 95%;
    color: black;
    background-color: #fff;
    padding: 0.4rem 0.7rem;
    border: none;
    outline: none;
    border-radius: 12px;
    margin: 0.6rem;
    height: 2.4rem;
}
.card-body form input[type="text"],
.card-body form input[type="date"],
.card-body form input[type="email"],
.card-body form input[type="phone"],
.card-body form input[type="password"],
.card-body form select,
.card-body form input[type="login"] {
    width: 95%;
    color: black;
    background-color: #fff;
    padding: 0.4rem 0.7rem;
    border: none;
    outline: none;
    border-radius: 12px;
    margin: 0.6rem;
}
.card-body form .banner-btn {
    display: block;
    margin: 1rem auto;
}
.card-body form input[type="email"]:focus,
.card-body form input[type="text"]:focus,
.card-body form input[type="password"]:focus,
.card-body form input[type="date"]:focus,
.card-body form input[type="phone"]:focus,
.card-body form input[type="login"]:focus {
    border: 2px solid black;
}
.card-body form .password-login,
.card-body form .registrer-login {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
}
.card-body form .registrer-login {
    margin-top: 0.4rem;
}
.card-body form .password-login a,
.card-body form .registrer-login a {
    margin: 0 0.7rem;
    text-decoration: underline;
    color: var(--bittersweet);
}
.card-body form .password-login a:active,
.card-body form .registrer-login a:active {
    color: inherit;
}

.contenedor-registro {
    /* margin: 2rem 0; */
    width: 100%;
    display: flex;
    justify-content: baseline;
    align-items: center;
}
.contenedor-registro .img {
    object-fit: cover;
    min-width: 50%;
    max-width: 50%;
    width: 50%;
    height: 100%;
}
.card-body2 {
    width: 80%;
    border-radius: 10px;
    height: auto;
    border-radius: 15px;
}
/* .card-body2 form select {
    margin-top: -0.05rem;
} */
/* .card-body2 form input[type="text"],
.card-body2 form input[type="date"],
.card-body2 form input[type="email"],
.card-body2 form input[type="phone"],
.card-body2 form input[type="password"],
.card-body2 form input[type="login"] .card-body2 {
    margin-top: -0.05rem;
} */

/*-----------------------------------*\
  #TESTIMONIAL
\*-----------------------------------*/

.content-slider::-webkit-scrollbar {
    width: 15px;
}

.content-slider::-webkit-scrollbar-track {
    background: var(--white);
    border-left: 1px solid var(--cultured);
}

.content-slider::-webkit-scrollbar-thumb {
    background: hsl(0, 0%, 80%);
    border: 3px solid var(--white);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.content-slider::-webkit-scrollbar-thumb:hover {
    background: hsl(0, 0%, 70%);
}
.section-testimonial {
    min-width: 100%;
    width: 100%;
    padding: 3rem 0 !important;
    background-color: #eae1e1;
}
.testimonial {
    position: relative;
}
.izquierda-t,
.derecha-t {
    position: absolute;
    font-size: 2.5rem;
    top: 50%;
    margin: 1rem 0;
    font-weight: bold;
}
.izquierda-t {
    left: 15%;
}
.derecha-t {
    right: -80%;
}

.content-slider {
    position: relative;
    min-width: 22rem;
    width: 22rem;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-direction: column;
    height: 22rem;
    /* margin-bottom: 4rem; */
    /* margin-top: 4rem; */
    overflow: auto;
    margin-left: 30%;
}

.testimonials-box {
    /* margin-bottom: 50px; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.testimonial-card {
    opacity: 0;
    pointer-events: none;
    padding: 30px 20px;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    text-align: center;
    width: 95%;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
.testimonial-card.box-container-show {
    pointer-events: unset;
    opacity: 1;
    transition: opacity 1.5s ease-in-out;
}
.content-2 {
    position: absolute;
    top: 0;
}
.testimonial-banner {
    margin: auto;
    margin-bottom: 20px;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}

.testimonial-name {
    font-weight: var(--weight-700);
    text-transform: uppercase;
    color: var(--sonic-silver);
    margin-bottom: 5px;
}

.testimonial-title {
    color: var(--onyx);
    font-size: var(--fs-7);
    margin-bottom: 15px;
}

.quotation-img {
    margin: auto;
    margin-bottom: 10px;
}

.testimonial-desc {
    max-width: 70%;
    margin: auto;
    color: var(--sonic-silver);
    font-size: var(--fs-7);
}

/*-----------------------------------*\
  #CTA
\*-----------------------------------*/

.cta-container {
    position: relative;
    aspect-ratio: 5 / 6;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    overflow: hidden;
    margin-bottom: 25px;
    height: auto;
}

.cta-banner {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.cta-content {
    background: hsla(0, 0%, 100%, 0.7);
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    padding: 15px 20px;
    text-align: center;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
}

.cta-content .discount {
    background: var(--eerie-black);
    color: var(--white);
    font-size: var(--fs-11);
    font-weight: var(--weight-600);
    text-transform: uppercase;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    margin: auto;
    padding: 0 5px;
    -webkit-border-radius: var(--border-radius-sm);
    border-radius: var(--border-radius-sm);
    margin-bottom: 5px;
}

.cta-title {
    color: var(--onyx);
    font-size: var(--fs-5);
    text-transform: capitalize;
    margin-bottom: 5px;
}

.cta-text {
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    margin-bottom: 5px;
}

.cta-btn {
    font-size: var(--fs-9);
    color: var(--sonic-silver);
    text-transform: uppercase;
    font-weight: var(--weight-700);
    margin: auto;
}

/*-----------------------------------*\
  #SERVICE
\*-----------------------------------*/

.service {
    min-width: 100%;
    width: 100%;
    background-color: #eae1e1;
    padding: 3rem 0 !important;
}
.service-container {
    min-width: 100%;
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 30px;
    /* padding: 30px 15px; */
    margin-top: 3rem;
    margin-bottom: 3rem;
    border: 1px solid var(--cultured);
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
}

.service-item {
    height: 7rem;
    width: 210px;
    min-width: 230px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}

.service-icon {
    font-size: 35px;
    color: var(--salmon-pink);
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.service-icon ion-icon {
    --ionicon-stroke-width: 25px;
}

.service-item:hover .service-icon {
    color: var(--eerie-black);
}

.service-title {
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    font-weight: var(--weight-600);
    text-transform: capitalize;
    margin-bottom: 5px;
}

.service-desc {
    color: var(--sonic-silver);
    font-size: var(--fs-9);
}

/*-----------------------------------*\
  #BLOG
\*-----------------------------------*/

.blog {
    min-width: 100%;
    width: 100%;
    padding: 2rem 0 !important;
}

.blog-container {
    /* display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex; */
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    /* gap: 15px; */
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-scroll-snap-type: inline mandatory;
    -ms-scroll-snap-type: inline mandatory;
    margin: 1rem 0;
    scroll-snap-type: inline mandatory;
}
.limite_parrafo {
    text-align: justify;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.blog-card {
    min-width: 100%;
    scroll-snap-align: start;
    /* background-color: #eae1e1cb; */
    background-color: #fcf3f3;
    border-radius: 10px;
}
.blog .blog-container .blog-card a img {
    height: 15rem;
    width: 100%;
    object-fit: cover;
}
.blog-card a img {
    height: 15rem;
    width: 100%;
    object-fit: cover;
}
.blog-banner {
    width: 100%;
    -webkit-border-radius: var(--border-radius-md);
    border-radius: var(--border-radius-md);
    margin-bottom: 20px;
}

.blog-category {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    color: var(--salmon-pink);
    font-size: var(--fs-8);
}

.blog-title {
    color: var(--eerie-black);
    font-size: var(--fs-5);
    font-weight: var(--weight-600);
    line-height: 1.4;
    margin-bottom: 5px;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.blog-title:hover {
    color: var(--salmon-pink);
}

.blog-meta {
    color: var(--sonic-silver);
    font-size: var(--fs-7);
}

.blog-meta cite {
    font-style: normal;
    color: var(--davys-gray);
}

/*-----------------------------------*\
  #FOOTER
\*-----------------------------------*/

/* footer {
    background: var(--eerie-black);
    padding: 30px 0;
} */
footer .footer-copy  p{
    display: flex;
    gap: 0rem;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
footer .footer-copy {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 14px;
    gap: 0rem;
    font-size: 0.9rem;
    /* color: white; */
    /* background-color: #e3403e; */
    background-color: #fefefe;
    color: black;
}
/* footer {
    background-color: #fcf3f3;
} */
.footer-kaizen {
    padding: 25px 20px;
    padding-bottom: 3rem;
    display: flex;
    background-color: #e3403e;
    /* justify-content: space-between; */
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
}
.footer-kaizen nav a {
    /* color: #fff; */
    color: gray;
    font-size: 1.6rem;
}
.footer-kaizen nav {
    background-color: white;
    /* background-color: #e3403e; */
    padding: 1rem 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 1rem;
}
.footer-kaizen .center-footer {
    display: flex;
    gap: 3rem;
    justify-content: center;
}
.footer-kaizen .center-footer .article1-footer {
    width: 24rem;
}
.footer-kaizen .center-footer .article1-footer h2 {
    font-size: 2.1rem;
    color: #e3403e;
}
.footer-kaizen .center-footer .article1-footer div {
    display: flex;
    margin: 0.8rem 0;
    width: 24rem;
}
.footer-kaizen .center-footer .article1-footer div button {
    border-radius: 0;
    background-color: e3403e;
    width: 35%;
    color: #fff;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.footer-kaizen .center-footer .article1-footer input[type="text"] {
    width: 65%;
    padding: 0.5rem;
    border: 2px solid gray;
    outline: none;
}
.footer-kaizen .center-footer .article1-footer button {
    width: 30%;
}
.footer-kaizen .center-footer .article1-footer img {
    width: 12rem;
}
.footer-kaizen .center-footer .article1-footer p {
    margin: 0.8rem 0;
    font-size: 1rem;
    /* color: gray; */
    color: white;
}
.footer-kaizen .center-footer .article2-footer {
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
    width: 33rem;
}
.footer-kaizen .center-footer .article2-footer div img{
    width: 12rem;
}
.footer-kaizen .center-footer .article2-footer div {
    width: 15rem;
}
.footer-kaizen .center-footer .article2-footer div b,
.footer-kaizen .center-footer .article2-footer div p,
.footer-kaizen .center-footer .article2-footer div a {
    margin: 0.5rem 0;
    color: #ccc;
    color: white;
}
.footer-kaizen .center-footer .article2-footer div a:hover {
    text-decoration: underline;
}

.footer-category {
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--onyx);
}

.footer-category-title {
    color: var(--salmon-pink);
    font-size: var(--fs-6);
    font-weight: var(--weight-600);
    text-transform: uppercase;
    margin-bottom: 15px;
}

.footer-category-box {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: 20px;
    -moz-column-gap: 20px;
    column-gap: 20px;
    row-gap: 3px;
    margin-bottom: 15px;
}

.category-box-title {
    color: var(--spanish-gray);
    font-size: var(--fs-8);
    font-weight: var(--weight-600);
    text-transform: uppercase;
}

.footer-category-link {
    position: relative;
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    text-transform: capitalize;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.footer-category-link:hover {
    color: var(--spanish-gray);
}

.footer-category-link:not(:last-child)::after {
    position: absolute;
    content: "";
    top: 3px;
    right: -10px;
    background: var(--sonic-silver);
    width: 1px;
    height: 15px;
}

/**
 * footer nav 
 */

.footer-nav {
    border-bottom: 1px solid var(--onyx);
    padding-bottom: 30px;
    margin-bottom: 30px;
}

.footer-nav-list:not(:last-child) {
    margin-bottom: 20px;
}

.footer-nav .nav-title {
    position: relative;
    color: var(--white);
    font-size: var(--fs-7);
    text-transform: uppercase;
    margin-bottom: 15px;
    padding-bottom: 5px;
}

.footer-nav .nav-title::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background: var(--salmon-pink);
    width: 60px;
    height: 1px;
}

.footer-nav-item {
    padding: 3px 0;
}

.footer-nav-link,
.footer-nav-item .content {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    color: var(--sonic-silver);
    font-size: var(--fs-7);
    text-transform: capitalize;
    -webkit-transition: var(--transition-timing);
    -o-transition: var(--transition-timing);
    transition: var(--transition-timing);
}

.footer-nav-link:hover {
    color: var(--salmon-pink);
}

.footer-nav-item.flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    gap: 10px;
}

.footer-nav-item .content {
    font-style: normal;
    margin-bottom: 5px;
}

.footer-nav-item .icon-box {
    color: var(--sonic-silver);
    font-size: 25px;
}

.footer-nav-item .icon-box ion-icon {
    --ionicon-stroke-width: 30px;
}

.footer-nav .social-link {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.social-link .footer-nav-link {
    font-size: 25px;
}

.footer-bottom {
    margin-bottom: 50px;
    text-align: center;
}

.payment-img {
    max-width: 335px;
    width: 100%;
    margin: auto;
    margin-bottom: 15px;
}

.copyright {
    color: var(--sonic-silver);
    font-size: var(--fs-8);
    font-weight: var(--weight-500);
    text-transform: capitalize;
    letter-spacing: 1.2px;
}

.copyright a {
    display: inline;
    color: inherit;
}

/*-----------------------------------*\
  #RESPONSIVE
\*-----------------------------------*/

/**
 * responsive larger than 480px screen
 */

@media (min-width: 480px) {
    /**
   * #CUSTOM PROPERTY
   */

    :root {
        /**
     * typography 
     */

        --fs-1: 1.875rem;
    }

    /**
   * #HEADER
   */

    .header-top {
        display: block;
        padding: 10px 0;
        border-bottom: 1px solid var(--cultured);
    }

    .header-social-container,
    .header-top-actions {
        display: none;
    }

    .header-alert-news {
        color: var(--sonic-silver);
        font-size: var(--fs-9);
        text-transform: uppercase;
    }

    .header-alert-news b {
        font-weight: var(--weight-500);
    }

    .header-main {
        padding: 25px 0;
    }

    .mobile-bottom-navigation {
        -webkit-border-top-left-radius: var(--border-radius-md);
        border-top-left-radius: var(--border-radius-md);
        -webkit-border-top-right-radius: var(--border-radius-md);
        border-top-right-radius: var(--border-radius-md);
    }

    /**
   * #BANNER
   */

    .slider-item {
        aspect-ratio: 5 / 3;
    }

    .banner-content {
        top: 50%;
        right: auto;
        bottom: auto;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
        max-width: 320px;
    }

    .banner-subtitle {
        --fs-7: 1rem;
    }

    .banner-text {
        display: block;
        color: var(--sonic-silver);
        font-size: var(--fs-7);
        font-weight: var(--weight-500);
        margin-bottom: 10px;
    }

    .banner-text b {
        font-size: var(--fs-2);
    }

    .banner-btn {
        padding: 7px 20px;
    }

    /**
   * #PRODUCT 
   */

    .product-grid {
        -ms-grid-columns: 1fr 30px 1fr;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
    }

    /**
   * #CTA
   */

    .cta-content {
        padding: 40px;
    }

    .cta-content .discount {
        --fs-11: 0.875rem;
        padding: 5px 10px;
    }

    .cta-title {
        --fs-5: 1.5rem;
    }

    .cta-text {
        --fs-7: 1rem;
    }

    .cta-btn {
        --fs-9: 1rem;
    }

    /**
   * #FOOTER
   */

    .copyright {
        --fs-8: 0.875rem;
    }
}

/**
 * responsive larger than 570px screen
 */

@media (min-width: 570px) {
    /**
   * #HEADER
   */

    .header-top .container,
    .header-main .container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .header-logo {
        margin-bottom: 0;
    }

    .header-top-actions {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 10px;
    }

    .header-top-actions select {
        border: none;
        display: block;
        min-width: 80px;
        padding: 5px 0;
        font: inherit;
        color: var(--sonic-silver);
        font-size: var(--fs-8);
        text-transform: uppercase;
        cursor: pointer;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    .header-top-actions select:hover {
        color: var(--eerie-black);
    }

    .header-search-container {
        min-width: 300px;
    }

    /**
   * #BANNER
   */

    .slider-item {
        aspect-ratio: 4 / 2;
    }

    .banner-content {
        background: none;
    }

    /**
   * #CATEGORY
   */

    .category-item-container {
        gap: 30px;
    }

    .category-item {
        min-width: -webkit-calc(50% - 15px);
        min-width: calc(50% - 15px);
    }

    /**
   * #PRODUCT
   */

    .product-minimal .showcase-container {
        min-width: 50%;
    }

    .product-featured .showcase-img {
        max-width: 450px;
        margin: auto;
    }

    .product-featured .countdown {
        gap: 20px;
    }

    /**
   * #CTA
   */

    .cta-container {
        aspect-ratio: 6 / 5;
    }

    /**
   * #BLOG
   */

    .blog-container {
        /* gap: 30px; */
    }

    .blog-card {
        min-width: -webkit-calc(50% - 15px);
        min-width: calc(50% - 15px);
    }
}



@media (max-width: 768px) {
    .ul-modal .li-modal i{
        display: none;
    }
    .ul-modal .li-modal .ul-modal-2{
        display: none;
    }
    .container-nosotros .section-nosotros .article-nosotros{
        flex-direction: column-reverse;
    }
    .section-tiendas article{
        width: 14rem;
    }
    .container-nosotros .section-nosotros .article-nosotros article{
        width: calc(100% - 2rem);
    }
    .slick-slide img{
        width: 90%;
        object-fit: contain;
    }
    .container-marcas2{
        overflow: hidden;
    }
    .container-marcas{
        margin: 2.5rem auto !important;
    }
    /* .slick-initialized .slick-slide{
        min-width: 9%;
        width: 9%;
    } */
    .sidebar{
        background-color: #fcf3f3;
    }
    .contenedor-maquinas:nth-child(1) nav{
        width: 100%;
    }
    .contenedor__maquinas{
        flex-wrap: wrap;
        gap: 0;
    }
    .contenedor__maquinas article{
        width: 100%;
    }
    .contenedor-carrito .content-resume{
        flex-wrap: wrap;
        gap: 2rem;
    }
    .contenedor-carrito .content-resume article{
        width: 100% !important;
    }
    .footer-kaizen nav:nth-child(1){
        margin-right: 1rem;
    }
.trending-home .contenedor-trending .text-trending2{
    margin-left: 0 !important;
}
    .trending-home .contenedor-trending .text-trending {
        margin-left: 0 !important;
    }
    .maquinas-detalles {
        max-width: 100%;
    }
    .maquinas-detalles .detallesm-contenedor article .container-img {
        width: 100%;
    }
    .contenedor__detalles article {
        width: 11rem;
    }
    .contenedor-blogd .blogs__recientes {
        margin-top: 3rem;
        width: 100%;
    }
    .contenedor-blogd {
        flex-direction: column;
    }
    .contenedor-blogd .article-textd img {
        width: 100%;
        height: auto;
    }
    .compra__exitosa article {
        width: 90%;
    }
    .compra__exitosa article p {
        width: 100%;
    }
    /* .contenedor-detalles {
        margin-top: 7rem;
    } */
    .cotizar__form .contenedor__cotizar article:nth-child(2) {
        width: 100%;
    }
    .cotizar__form .contenedor__cotizar article:nth-child(2) img {
        height: auto;
    }
    .contenedor-checkout article div:nth-child(2) p,
    .contenedor-checkout article div:nth-child(2) h2{
        margin: .5rem 0;
    }
    .contenedor-checkout article .delete-cart {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 1rem;
        vertical-align: middle;
        font-size: 1.5rem;
        background-color: transparent;
        cursor: pointer;
        display: flex;
        gap: 0.2rem;
        align-items: flex-start;
        justify-content: center;
    }
    .contenedor-checkout {
        width: 100% ;
    }
    .contenedor-checkout article div:nth-child(2) {
        margin-left: 0 !important;
    }
    .contenedor-checkout article div:nth-child(1) {
        width: 15rem;
        display: block;
        margin: auto;
    }
    .contenedor-checkout article div:nth-child(2) {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .contenedor-checkout article div:nth-child(3) {
        width: 100%;
    }

    .contenedor-checkout article div:nth-child(4) {
               width: 46%;
    }
    .contenedor-checkout article {
        width: 50%;
        gap: 1rem;
        padding-bottom: 4rem;
        flex-wrap: wrap;
    }
    .contenedor-detalles .content-reviews iframe {
        height: 17rem;
    }
    .content-relations .contenedor-relacionados .showcase {
        min-width:calc(50% - 1rem);
    }
    .contenedor-detalles .content-details .contenedor-imagen .img__principal {
        height: 20rem;
    }
    .entrega__contenedor{
        flex-direction: column;
    }
    .pages-form {
        width: 100%;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: 3rem;
        gap: 2rem;
    }
    .pages-form article {
        padding: 0.5rem;
        width: 9rem;
        text-align: center;
    }
    .form-pago form div {
        width: 100% !important;
    }
    .form-pago form{
        margin-top: 1rem;
    }
    .form-pago {
        width: 100% !important;
    }
    .resumen-compra {
        width: 100%;
        height: auto;
    }
    .article-ahorro {
        flex-wrap: wrap;
        justify-content: center;
        flex-direction: column-reverse;
    }
    .article-ahorro .ahorrar-image {
        width: 100%;
        height: 7rem;
    }
    .contenedor__user{
        flex-direction: column-reverse;
    }
    .num-form {
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
    }
    .num-form div {
        width: 30%;
    }
    .contenedor-carrito .content-car article i {
        position: absolute !important;
        bottom: 1rem;
        right: 1rem;
    }
    .contenedor-carrito .content-car article div p {
        font-size: 1.4rem;
    }
    .contenedor-carrito .content-car article {
        padding: 1rem 0;
        position: relative;
    }
    .promociones .contenedor-promociones article {
        margin-top: 0;
    }
    .contenedor-mimg {
        width: 95%;
    }
    .contenedor-mimg img {
        min-width: 28%;
        width: 28%;
    }
    .trending-home .contenedor-trending .text-trending {
        width: 23rem;
    }
    .section-testimonios .contenedor-testimonios article {
        min-width: 50%;
        width: 50%;
    }
    .section-testimonios .contenedor-testimonios {
        width: 100%;
        gap: 0;
    }
    .promociones .contenedor-promociones {
        padding: 0 1.5rem;
    }
    .promociones .contenedor-promociones img {
        width: 50%;
    }
    .promociones .contenedor-promociones article {
        width: 100%;
    }
    .top-productos i {
        z-index: 100;
    }
    .section-equipo .contenedor-team{
        gap: 1rem;
        height: 24rem;
    }
    .section-equipo .contenedor-team article img{
        width: 60%;
    }
    .section-equipo .contenedor-team article{
        min-width: calc(50% - 1rem);
        width: calc(50% - 1rem);
        height: 19rem;
    }
    .section-equipo #left-asesor{
        left: -20px;
    }
    .section-equipo #right-asesor{
        right: -20px;
    }
    .clasemodal{
        width: 80% !important;
    }

    .section-service .contenedor-service {
        width: 100%;
        height: auto;
        margin: 3rem auto;
    }
    .section-service .contenedor-service img {
        position: static !important;
        height: 14rem;
        object-fit: cover;
    }

    .banner-section .img_banner {
        height: 15rem;
    }
    .banner-section {
        margin-top: 5rem;
    }

    .header-2 {
        display: none;
    }
    .header-principal h2 {
        margin: 0;
    }
    .header-principal {
        top: 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .header-principal .iconos-header {
        display: flex;
        gap: 0.7rem;
        width: auto;
        margin: 0;
    }
    .header-principal nav .enlaces-header {
        width: 100%;
        border-top: 1px solid gray;
        /* padding-left: 2rem;
        padding-top: 4rem; */
        justify-content: start;
        align-items: flex-start;
        display: flex;
        height: 18rem;
        flex-direction: column;
        color: #000;
        padding-top: 1rem;
        padding-left: 0.8rem;
    }
    .header-principal #menu-header {
        display: block;
    }
    .header-principal nav ion-icon {
        position: absolute;
        right: 10px;
        display: block;
        color: #000;
        top: 10px;
    }
    .header-principal nav .enlaces-header a {
        color: #000;
    }
    .header-principal nav {
        position: absolute;
        z-index: 500;
        top: 4.5rem;
        display: none;
        flex-direction: column-reverse;
        left: 0;
        width: 80%;
        box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.350);
        justify-content: flex-end;
        align-items: flex-start;
        background-color: #fff;
        height: auto;
    }
    .header-principal nav .si-header input[type="text"] {
        width: 100%;
        padding: 0.9rem 0.3rem;
    }
    .header-principal nav .si-header select {
        display: none;
    }
    .header-principal nav .si-header i {
        font-size: 1.3rem;
        padding-top: 0.3rem;
    }
    .header-principal nav .si-header {
        width: 75%;
        margin-top: 15px;
        margin-left: 0.8rem;
    }
    .top-productos #left-destacado{
        left: -25px;
    }
    .top-productos #right-destacado{
        right: -25px;
    }
    .article-ofert {
        min-width: 47%;
        width: 47%;
    }
    .ofertas #right-oferta{
        right: -25px;
    }
    .ofertas #left-oferta{
        left: -25px;
    }
    .products-featured {
        min-width: 47%;
        width: 47%;
    }
    .footer-kaizen .center-footer .article2-footer {
        width: 100%;
    }
    .footer-kaizen .center-footer .article1-footer div {
        width: 100%;
    }
    .footer-kaizen .center-footer .article1-footer {
        width: 100%;
        margin: 0 1rem;
    }
    .footer-kaizen .center-footer {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .footer-kaizen {
        /* padding: 1rem 0; */
        padding: 2rem;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header {
        padding: 0;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article img {
        display: none;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article a {
        margin: 0;
        color: #000;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article {
        width: 100%;
        height: auto;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header {
        flex-direction: column;
        gap: 1rem;
        padding-left: 1.8rem;
        background-color: #fff;
    }
    .item.slick-slide {
        width: 250px !important;
        height: 250px !important;
    }
    .help-banner {
        height: auto;
        padding: 0.8rem 0.5rem;
    }
   
    .slick-track{
        gap: 13px !important;
    }
    .filtros__categorias {
        display: block;
    }
    .contenedor-detalles .content-reviews iframe {
        width: 100%;
    }
    .contenendor-destacados .content-scrollf article {
        min-width: 100%;
        width: 100%;
        margin: 0;
    }
    .content-scrollf {
        width: 100%;
    }
    .contenendor-destacados {
        width: 100%;
    }
    .content-textf .article-text {
        width: 100%;
    }
    .content-textf {
        width: 100%;
        padding: 0 !important;
    }
    .content-textf .article-text .banner-title {
        width: 100%;
        font-size: 1.6rem;
    }

    .contenedor-principal-destacados {
        width: 100%;
        display: flex;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        height: auto;
    }
    .container-features .left-f {
        position: absolute;
        left: -15px;
        font-size: 3rem;
        color: var(--bittersweet);
        cursor: pointer;
    }
    .container-features .right-f {
        position: absolute;
        cursor: pointer;
        right: -30px;
        font-size: 3rem;
        color: var(--bittersweet);
    }
    .contenedor-equipo article {
        min-width: calc(100% - 1rem);
        margin: 0.5rem;

        width: calc(100% - 1rem);
        text-align: center;
    }
    .contenedor-productos article {
        width: 100%;
    }
    .contenedor-principalFor {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .content-iframe {
        width: 100%;
    }
    .formulario-contactanos {
        width: 100%;
    }
    .formulario-contactanos .content1-form {
        flex-direction: column;
    }
    .formulario-contactanos .content1-form div {
        width: 100%;
    }
    .formulario-contactanos .content2-form {
        flex-direction: column;
    }
    .formulario-contactanos .content2-form div {
        width: 100%;
    }
    .contenedor-nosotros {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .contenedor-nosotros article {
        width: 100%;
        height: auto;
    }
    .contenedor-nosotrosv article {
        width: 100%;
        padding: 1rem;
    }
    .container-marcas .contenedor-marcas .content-marcas article {
        width: 100%;
        margin: 1rem 0;
    }
    .contenedor-categoria .content-category article {
        width: 100%;
    }
    .content-suscribete {
        width: 100%;
        padding: 0.2rem;
    }
    .text-input {
        padding: 0.7rem;
        min-width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .text-input input[type="text"] {
        min-width: 100%;
        margin: 0.8rem 0;
    }
    .header-2 {
        height: 5rem;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .header-2 .header-cambio div {
        display: none;
    }
    .header-2 .header-info{
        margin-top: 0;
    }
    .header-2 .header-cambio {
        justify-content: center;
        align-items: center;
        margin-top: 0;
    }
    .contenedor-equipo article {
        height: 24rem;
    }
    .contenedor-equipo2 article img {
        width: 15rem;
        height: 15rem;
    }
    .contenedor-equipo2 article {
        min-width: calc(100% - 1.4rem);
        width: calc(100% - 0.1.4rem);
        margin: 0.6rem 0.7rem;
        height: 24rem;
    }
    .content-button {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        margin: 2rem 0;
    }
    .content-button .banner-title {
        margin-left: 0;
        flex: 1;
        text-align: center;
        font-size: 2rem;
    }
    .content-suscribete {
        height: auto;
        padding: 0.7rem 2rem;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }
    .content-suscribete .article-texts .input .banner-btn {
        top: 30%;
    }
    .content-suscribete .article-texts,
    .article-imgs {
        margin: 0.8rem 0;
        width: 100%;
        min-width: 100%;
    }
    .testimonials-box {
        height: auto;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .cta-container {
        position: relative;
        aspect-ratio: 5 / 6;
        -webkit-border-radius: var(--border-radius-md);
        border-radius: var(--border-radius-md);
        overflow: hidden;
        margin-bottom: 25px;
        height: 30rem;
    }
    .content-slider {
        height: 25rem;
    }

    .izquierda-t {
        left: 0;
    }
    .derecha-t {
        right: 0%;
    }

    .card-body,
    .card-body2 {
        width: 100%;
    }
    .contenedor-registro {
        width: 100%;
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        height: auto;
    }
    .contenedor-registro .card-body2,
    .contenedor-registro .img {
        min-width: 100%;
        max-width: 100%;
        height: auto;
        width: 100%;
    }
    .content-slider {
        margin-left: 0;
    }
    .contenedor-detalles .content-details {
        flex-direction: column-reverse;
        justify-content: center;
        align-items: center;
        margin-bottom: 3rem;
        gap: 2rem;
    }
    .contenedor-detalles .content-details .contenedor-detalle,
    .contenedor-detalles .content-details .contenedor-imagen {
        width: 100%;
    }
    .right-relations {
        right: -15px;
    }
    .left-relations {
        left: -15px;
    }
    .content-relations .contenedor-relacionados article {
        min-width: 100%;
        width: 100%;
    }
    .content-relations2 .contenedor-relacionados2 .showcase {
        min-width: 100%;
        width: 100%;
    }
    .contenedor-carrito .content-car article {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 1rem;
    }
    .contenedor-carrito .content-car article div:nth-child(5) {
        bottom: -1rem;
        right: 0;
    }
    .contenedor-carrito .content-car article div img {
        display: block;
        margin: 0 auto;
        width: 8rem;
    }
    .contenedor-carrito .content-car article div:nth-child(2){
        min-width: 100%;
        width: 100%;
    }
    .contenedor-carrito .content-car article div {
        margin-bottom: 1rem;
        width: 100%;
    }
    .contenedor-carrito .content-resume article {
        width: 100%;
    }
    .contendorp-form .article-form1,
    .contendorp-form .article-form2 {
        width: 100%;
    }
    .contendorp-form {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .contendorp-form .article-form1 .content1 .text1 div,
    .contendorp-form .article-form1 .content1 .text2 div,
    .contendorp-form .article-form1 .content1 .text3 div,
    .contendorp-form .article-form1 .content2 .text4 div,
    .contendorp-form .article-form1 .content3 .text6 div,
    .contendorp-form .article-form1 .content3 .text7 div {
        width: 100%;
    }
    .contendorp-form .article-form1 .content1 .text1,
    .contendorp-form .article-form1 .content1 .text2,
    .contendorp-form .article-form1 .content1 .text3,
    .contendorp-form .article-form1 .content2 .text4,
    .contendorp-form .article-form1 .content3 .text6,
    .contendorp-form .article-form1 .content3 .text7 {
        width: 100%;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .contenedor-blogd {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .contenedor-blogd .article-recientes {
        width: 100%;
    }
    .contenedor-blogd .article-textd {
        width: 100%;
    }

    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm8
        .span-m8 {
        top: 0;
    }
    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm3
        .modal-maquina3,
    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm4
        .modal-maquina4,
    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm5
        .modal-maquina5,
    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm6
        .modal-maquina6,
    .maquinas-detalles
        .detallesm-contenedor
        article
        .container-img
        .container-modalm7
        .modal-maquina7 {
        margin-right: 0rem;
        position: absolute;
    }
    .container-maquinas
        .contenedor-maquinas
        .article-maquinas
        .content-m
        article
        button {
        margin: 1rem 0;
    }
    .container-maquinas
        .contenedor-maquinas
        .article-maquinas
        .content-m
        article
        img {
        width: 100%;
    }
    .container-maquinas
        .contenedor-maquinas
        .article-maquinas
        .content-m
        article {
        min-width: 100%;
    }
    .container-maquinas .contenedor-maquinas .article-maquinas .content-m {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
}
@media (max-width: 600px) {
    .container-nosotros .section-nosotros .article-nosotros .img-nosotros iframe, .container-nosotros .section-nosotros .article-nosotros .img-nosotros img{
        min-width: calc(100% - 1rem);
        width: calc(100% - 1rem);
        margin: 0 !important;
    }
    .banner__movil {
        display: block !important;
    }
    .banner__escritorio {
        display: none !important;
    }
    .contenedor-checkout article{
    width: 100%;
}
    .content-relations .contenedor-relacionados .showcase{
        width: 100%;
    }
    .contenedor-detalles .content-details .contenedor-imagen .img__principal{
        height: 14rem;
    }
    .section-equipo #left-asesor{
        left: -15px;
    }
    .section-equipo #right-asesor{
        right: -15px;
    }
    .maquinas-detalles .detallesm-contenedor article .container-img .container-modalm1 .modal-maquina{
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
    .carousel-producto{
        width: 90%;
    }
    .showcase-banner{
        width: 60%;
        margin-left: 0;
        margin-right: 0;
    }
    .clasemodal{
        width: 95% !important;
    }
    .container-marcas2{
        width: 90%;
        margin: auto;
    }
    .section-form {
        padding-top: 3rem;
    }
    .section-form .contenedor-sform form div:nth-child(1),
    .section-form .contenedor-sform form div:nth-child(2) {
        width: 100%;
    }
    .section-form .contenedor-sform {
        width: 95%;
    }
    .container-nosotros .section-nosotros .article-nosotros article {
        width: 90%;
    }

    .container-nosotros .section-nosotros .article-nosotros {
        flex-wrap: wrap;
        flex-direction: column-reverse;
        align-items: center;
        margin-top: 0;
    }
    .section-equipo {
        overflow: hidden;
    }
    .section-equipo .contenedor-team {
        margin-top: 2rem;
        height: 20rem;
        width: 75%;
        overflow: hidden;
        gap: 0rem;
    }
    .section-equipo .contenedor-team article button {
        bottom: 1rem;
    }
    .section-equipo .contenedor-team article img {
        width: 55%;
        margin-top: -2rem;
    }
    .section-equipo .contenedor-team article {
        min-width: calc(100%);
        width: calc(100%);
        height: 19rem;
    }
    .title-div {
        width: 100%;
        display: flex;
        position: relative;
        justify-content: center;
        align-items: center;
        gap: 1rem;
    }
    .title-div button {
        position: absolute;
        left: 50%;
        top: 96%;
        transform: translate(-50%, -50%);
    }
    .blog-card {
        min-width: 100%;
        width: 100%;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header {
        padding: 0;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article img {
        display: none;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article a {
        margin: 0;
        color: #000;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header article {
        width: 100%;
        height: auto;
    }
    .ul-modal .li-modal .ul-modal-2 .article-header {
        flex-direction: column;
        gap: 1rem;
        padding-left: 1.8rem;
        background-color: #fff;
    }
    .item.slick-slide {
        width: 250px !important;
        height: 250px !important;
    }
    .help-banner {
        height: auto;
        padding: 0.8rem 0.5rem;
    }
    .blog-container {
        padding: 0 1rem;
        flex-wrap: wrap;
    }
    .footer-kaizen .center-footer .article2-footer {
        width: 100%;
    }
    .footer-kaizen .center-footer .article1-footer div {
        width: 100%;
    }
    .footer-kaizen .center-footer .article1-footer {
        width: 100%;
        margin: 0 1rem;
    }
    .footer-kaizen .center-footer {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .footer-kaizen {
        /* padding: 1rem 0; */
        padding: 1rem;
    }
    .section-testimonios .contenedor-testimonios article {
        min-width: 100%;
        width: 100%;
    }
    .section-testimonios .contenedor-testimonios {
        width: 100%;
        gap: 0;
    }
    .promociones .contenedor-promociones {
        padding: 0 1.5rem;
    }
    .promociones .contenedor-promociones img {
        width: 100%;
    }
    .promociones .contenedor-promociones article {
        width: 100%;
    }
    .top-productos i {
        z-index: 100;
    }
    .top-productos #left-destacado{
        left: -15px;
    }
    .top-productos #right-destacado{
        right: -15px;
    }
    .products-featured {
        min-width: calc(100% - 1rem);
        width: calc(100% - 1rem);
    }
    .top-productos {
        overflow: hidden;
    }
    .top-productos .contenedor-top{
        width: 80%;
    }
    .ofertas {
        overflow: hidden;
    }
    .ofertas .contenedor-ofertas{
        width: 80%;
        margin: 2rem auto;
    }
    .ofertas #right-oferta{
        right: -15px;
    }
    .ofertas #left-oferta{
        left: -15px;
    }
    .article-ofert {
        min-width: calc(100% - 1rem);
        width: calc(100% - 1rem);
    }
    .section-service .contenedor-service {
        width: 100%;
        height: auto;
        margin: 3rem auto;
    }
    .section-service .contenedor-service img {
        position: static !important;
        height: 14rem;
        object-fit: cover;
    }

    .banner-section .img_banner {
        height: 15rem;
    }

    .header-2 {
        display: none;
    }
    .header-principal h2 {
        margin: 0;
    }
    .header-principal {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    .header-principal .iconos-header {
        display: flex;
        gap: 0.7rem;
        width: auto;
        margin: 0;
    }
    .header-principal nav .enlaces-header {
        width: 100%;
        border-top: 1px solid gray;
        /* padding-left: 2rem;
        padding-top: 4rem; */
        justify-content: start;
        align-items: flex-start;
        display: flex;
        height: 18rem;
        flex-direction: column;
        color: #000;
        padding-top: 1rem;
        padding-left: 0.8rem;
    }
    .header-principal #menu-header {
        display: block;
    }
    .header-principal nav ion-icon {
        position: absolute;
        right: 10px;
        display: block;
        color: #000;
        top: 10px;
    }
    .header-principal nav .enlaces-header a {
        color: #000;
    }
    .header-principal nav {
        position: absolute;
        z-index: 500;
        top: 4.5rem;
        display: none;
        flex-direction: column-reverse;
        left: 0;
        width: 80%;
        justify-content: flex-end;
        align-items: flex-start;
        background-color: #fff;
        height: 55vh;
    }
    .header-principal nav .si-header input[type="text"] {
        width: 100%;
        padding: 0.8 0.3rem;
    }
    .header-principal nav .si-header select {
        display: none;
    }
    .header-principal nav .si-header i {
        font-size: 1.3rem;
        padding-top: 0.3rem;
    }
    .header-principal nav .si-header {
        width: 75%;
        margin-top: 15px;
        margin-left: 0.8rem;
    }
}
@media (min-width: 769px) {
    /**
   * #CUSTOM PROPERTY
   */

    :root {
        /**
     * typography 
     */

        --fs-1: 2.375rem;
    }

    /**
   * #BASE 
   */

    html {
        font-size: 17px;
    }

    /**
   * #REUSED STYLE 
   */

    .container {
        max-width: 750px;
        margin: auto;
    }

    /**
   * #MODAL 
   */

    .modal-content {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        max-width: 750px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
    }

    .newsletter-img {
        display: block;
    }

    .newsletter {
        text-align: left;
    }

    /**
   * #HEADER 
   */

    .header-main .container {
        gap: 80px;
    }

    .header-search-container {
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

    /**
   * #BANNER 
   */

    .slider-item {
        aspect-ratio: auto;
        height: 350px;
    }

    .banner-content {
        max-width: 380px;
    }

    .banner-subtitle {
        --fs-7: 1.25rem;
    }

    .banner-text {
        --fs-7: 1.125rem;
    }

    .banner-text b {
        --fs-2: 1.875rem;
    }

    .banner-btn {
        --fs-11: 0.75rem;
    }

    /**
   * #CATEGORY 
   */

    .category-img-box {
        padding: 20px;
    }

    /**
   * #PRODUCT 
   */

    .product-minimal {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 20px;
    }

    .product-minimal .product-showcase {
        min-width: -webkit-calc(50% - 10px);
        min-width: calc(50% - 10px);
        width: -webkit-calc(50% - 10px);
        width: calc(50% - 10px);
    }

    .product-minimal .showcase-container {
        min-width: 100%;
    }

    .product-featured .showcase {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 20px;
    }

    .product-featured .showcase-img {
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content;
    }

    .product-featured .showcase-content {
        margin-top: 0;
        min-width: -webkit-calc(100% - 345px);
        min-width: calc(100% - 345px);
    }

    /**
   * #FOOTER 
   */

    .footer-nav .container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        row-gap: 50px;
        -webkit-column-gap: 20px;
        -moz-column-gap: 20px;
        column-gap: 20px;
    }

    .footer-nav-list {
        min-width: -webkit-calc(33.33% - 15px);
        min-width: calc(33.33% - 15px);
        width: -webkit-calc(33.33% - 15px);
        width: calc(33.33% - 15px);
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

    .footer-nav-list:not(:last-child) {
        margin-bottom: 0;
    }
}

/**
 * responsive larger than 1024px screen
 */

@media (min-width: 1024px) {
    /**
   * #CUSTOM PROPERTY
   */

    :root {
        /**
     * typography 
     */

        --fs-1: 2.625rem;
        --fs-2: 1.125rem;
    }

    /**
   * #REUSED STYLE 
   */

    .container {
        max-width: 980px;
    }

    /**
   * #NOTIFICATION TOAST 
   */

    .notification-toast {
        bottom: 30px;
    }

    /**
   * #HEADER 
   */

    .header-social-container {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 5px;
    }

    .header-social-container .social-link {
        padding: 5px;
        background: hsl(0, 0%, 95%);
        -webkit-border-radius: var(--border-radius-sm);
        border-radius: var(--border-radius-sm);
        color: var(--sonic-silver);
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    .header-social-container .social-link:hover {
        background: var(--salmon-pink);
        color: var(--white);
    }

    .header-user-actions {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 15px;
    }

    .header-user-actions .action-btn {
        position: relative;
        font-size: 35px;
        color: var(--onyx);
        padding: 5px;
    }

    .header-user-actions .count {
        position: absolute;
        top: -2px;
        right: -3px;
        background: var(--bittersweet);
        color: var(--white);
        font-size: 12px;
        font-weight: var(--weight-500);
        line-height: 1;
        padding: 2px 4px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
    }

    .desktop-navigation-menu {
        display: block;
    }

    .desktop-menu-category-list {
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 15px;
    }

    .desktop-menu-category-list .menu-category:not(:nth-child(2)) {
        position: relative;
    }

    .desktop-menu-category-list .menu-category > .menu-title {
        position: relative;
        color: white;
        font-size: var(--fs-7);
        font-weight: var(--weight-600);
        text-transform: uppercase;
        padding: 15px 0;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    /* .desktop-menu-category-list .menu-category > .menu-title:hover {
        color: var(--salmon-pink);
    } */

    .desktop-menu-category-list .menu-category > .menu-title::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 2px;
        background: var(--salmon-pink);
        -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: left;
        -ms-transform-origin: left;
        transform-origin: left;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    .desktop-menu-category-list .menu-category > .menu-title:hover::after {
        -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
        transform: scaleX(1);
    }

    .dropdown-panel {
        position: absolute;
        top: 100%;
        left: 0;
        background: var(--white);
        width: 100%;
        display: -ms-grid;
        display: grid;
        -ms-grid-columns: 1fr 30px 1fr 30px 1fr 30px 1fr;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        padding: 30px;
        border: 1px solid var(--cultured);
        -webkit-box-shadow: 0 3px 5px hsla(0, 0%, 0%, 0.1);
        box-shadow: 0 3px 5px hsla(0, 0%, 0%, 0.1);
        -webkit-border-radius: var(--border-radius-md);
        border-radius: var(--border-radius-md);
        -webkit-transform: translateY(50px);
        -ms-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
        z-index: 5;
    }

    .desktop-menu-category-list .menu-category:hover > .dropdown-panel {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }

    .dropdown-panel-list .menu-title a {
        color: var(--onyx);
        font-size: var(--fs-7);
        font-weight: var(--weight-600);
        padding-bottom: 10px;
        border-bottom: 1px solid var(--cultured);
        margin-bottom: 10px;
    }

    .panel-list-item a {
        color: var(--sonic-silver);
        font-size: var(--fs-7);
        text-transform: capitalize;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    .panel-list-item a:hover {
        color: var(--salmon-pink);
    }

    .panel-list-item:not(:last-child) a {
        padding: 4px 0;
    }

    .panel-list-item:last-child {
        margin-top: 20px;
    }

    .panel-list-item img {
        width: 100%;
        height: auto;
        -webkit-border-radius: var(--border-radius-sm);
        border-radius: var(--border-radius-sm);
    }

    .dropdown-list {
        position: absolute;
        top: 100%;
        left: 0;
        width: 200px;
        background: var(--white);
        padding: 20px 0;
        -webkit-border-radius: var(--border-radius-md);
        border-radius: var(--border-radius-md);
        border: 1px solid var(--cultured);
        -webkit-box-shadow: 0 3px 5px hsla(0, 0%, 0%, 0.1);
        box-shadow: 0 3px 5px hsla(0, 0%, 0%, 0.1);
        -webkit-transform: translateY(50px);
        -ms-transform: translateY(50px);
        transform: translateY(50px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
        z-index: 5;
    }

    .desktop-menu-category-list .menu-category:hover > .dropdown-list {
        -webkit-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
        opacity: 1;
        visibility: visible;
        pointer-events: all;
    }

    .dropdown-list .dropdown-item a {
        color: var(--sonic-silver);
        font-size: var(--fs-7);
        text-transform: capitalize;
        padding: 4px 20px;
        -webkit-transition: var(--transition-timing);
        -o-transition: var(--transition-timing);
        transition: var(--transition-timing);
    }

    .dropdown-list .dropdown-item a:hover {
        color: var(--salmon-pink);
    }

    .mobile-bottom-navigation {
        display: none;
    }

    /**
   * #BANNER 
   */

    .banner {
        margin-top: 0;
    }

    .slider-item {
        height: 380px;
    }

    .banner-content {
        left: 75px;
        max-width: 400px;
    }

    .banner-subtitle {
        --fs-7: 1.625rem;
    }

    .banner-text {
        --fs-7: 1.375rem;
    }

    .banner-btn {
        --fs-11: 0.875rem;
    }

    /**
   * #CATEGORY 
   */

    .category-item {
        min-width: -webkit-calc(33.33% - 20px);
        min-width: calc(33.33% - 20px);
    }

    .category-img-box {
        padding: 10px;
    }

    /**
   * #PRODUCT 
   */

    .product-container .container {
        position: relative;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
        -webkit-align-items: flex-start;
        -ms-flex-align: start;
        align-items: flex-start;
        gap: 30px;
        margin-bottom: 30px;
    }

    .sidebar {
        --fs-5: 0.941rem;

        position: -webkit-sticky;

        position: sticky;
        top: 30px;
        left: 0;
        padding: 0;
        min-width: -webkit-calc(25% - 15px);
        min-width: calc(25% - 15px);
        margin-bottom: 30px;
        visibility: visible;
        overflow-y: auto;
        -ms-scroll-chaining: chained;
        overscroll-behavior: auto;
        z-index: 0;
    }

    .sidebar-category {
        padding: 20px;
        margin-bottom: 30px;
        border: 1px solid var(--cultured);
        -webkit-border-radius: var(--border-radius-md);
        border-radius: var(--border-radius-md);
    }

    .sidebar-close-btn {
        display: none;
    }

    .product-box {
        min-width: -webkit-calc(75% - 15px);
        min-width: calc(75% - 15px);
    }

    .product-minimal {
        margin-bottom: 20px;
    }

    .product-minimal .product-showcase {
        min-width: -webkit-calc(33.33% - 14px);
        min-width: calc(33.33% - 14px);
        width: -webkit-calc(33.33% - 14px);
        width: calc(33.33% - 14px);
        -webkit-box-flex: 1;
        -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
    }

    .product-minimal .showcase-wrapper {
        gap: 10px;
    }

    .product-minimal .showcase-container {
        padding: 2px;
    }

    .product-featured .countdown-content {
        padding: 5px 10px;
    }

    .product-grid {
        /* -ms-grid-columns: (1fr) [3]; */
        grid-template-columns: repeat(3, 1fr);
    }

    /**
   * #TESTIMONIALS, CTA & SERVICE 
   */

    .testimonials-box {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        gap: 30px;
    }

    .testimonial-card {
        margin-bottom: 0;
    }

    .testimonial,
    .cta-container {
        min-width: -webkit-calc(50% - 15px);
        min-width: calc(50% - 15px);
        width: -webkit-calc(50% - 15px);
        width: calc(50% - 15px);
        margin-bottom: 0;
    }

    .service {
        width: 100%;
    }

    .service-container {
        gap: 0;
    }

    .service-item {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        min-width: 20%;
    }

    /**
   * #BLOG
   */

    .blog-card {
        min-width: -webkit-calc(33.33% - 20px);
        min-width: calc(33.33% - 20px);
    }

    .blog-title {
        --fs-5: 1rem;
    }

    /**
   * #FOOTER
   */

    .footer-nav-list {
        min-width: -webkit-calc(20% - 16px);
        min-width: calc(20% - 16px);
        width: -webkit-calc(20% - 16px);
        width: calc(20% - 16px);
    }

    .footer-nav-list:last-child {
        display: none;
    }

    .footer-bottom {
        margin-bottom: 0;
    }
}

/**
 * responsive larger than 1200px screen
 */

@media (min-width: 1200px) {
    /**
   * #REUSED STYLE 
   */

    .container {
        max-width: 1200px;
    }

    /**
   * #HEADER
   */

    .desktop-menu-category-list {
        gap: 15px;
    }

    /**
   * #BANNER
   */

    .slider-item:last-child .banner-img {
        -o-object-position: top;
        object-position: top;
    }

    /**
   * #CATEGORY
   */

    .category-item {
        min-width: -webkit-calc(25% - 22.5px);
        min-width: calc(25% - 22.5px);
    }

    .category-item-title {
        --fs-9: 0.824rem;
    }

    /**
   * #PRODUCT
   */

    .product-featured .showcase > div {
        min-width: -webkit-calc(50% - 10px);
        min-width: calc(50% - 10px);
    }

    .product-featured .display-number {
        --fs-5: 1.125rem;
    }

    .product-grid {
        /* -ms-grid-columns: (1fr) [4]; */
        /* grid-template-columns: repeat(4, 1fr); */
        grid-template-columns: repeat(3, 1fr);
    }

    /**
   * #TESTIMONIALS, CTA, SERVICE
   */

    .testimonial {
        min-width: -webkit-calc(25% - 20px);
        min-width: calc(25% - 20px);
        width: -webkit-calc(25% - 20px);
        width: calc(25% - 20px);
    }

    .cta-container {
        min-width: -webkit-calc(50% - 20px);
        min-width: calc(50% - 20px);
        width: -webkit-calc(50% - 20px);
        width: calc(50% - 20px);
        aspect-ratio: unset;
    }

    .service-container {
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: center;
        gap: 16px;
        /* padding: 30px; */
    }

    .service-item {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: left;
    }

    /**
   * #BLOG
   */

    /* .blog {
        margin-bottom: 50px;
    } */

    .blog-card {
        min-width: -webkit-calc(25% - 22.5px);
        min-width: calc(25% - 22.5px);
    }

    /**
   * #FOOTER
   */

    /* footer {
        padding-top: 50px;
    } */

    .footer-category {
        margin-bottom: 50px;
        padding-bottom: 35px;
    }

    .footer-nav {
        padding-bottom: 50px;
    }
}

/**
 * responsive larger than 1400px screen
 */

@media (min-width: 1400px) {
    /**
   * #BASE 
   */

    html {
        font-size: 18px;
    }

    /**
   * #REUSED STYLE 
   */

    .container {
        max-width: 1350px;
    }

    /**
   * #BANNER
   */

    .slider-item {
        height: 450px;
    }

    .banner-content {
        left: 110px;
        max-width: 460px;
    }
}

.contenedor-select h2 {
    font-size: 2.3rem;
}
.contenedor-select select option {
    margin: 0 0;
}
.contenedor-checkbox h2,
h3 {
    font-size: 2.3rem;
}
.select-checkbox {
    padding: 0 0.9rem;
    border-radius: 2px;
    position: relative;
}
.select-checkbox span {
    position: absolute;
    top: 0;
    right: 5px;
}
.select-checkbox span i {
    font-size: 2.7rem;
}

.checkbox-contenedor {
    margin-left: 1rem;
    display: none;
}
.checkbox-contenedor .contenedor-all-c {
    overflow: auto;
    max-height: 30rem;
    height: auto;
}
.checkbox-contenedor.visible-c {
    display: block;
}
.filter {
    display: none;
}
.checkbox-contenedor .search {
    width: 100%;
    border-radius: 4px;
    border: 1px solid gray;
    outline: none;
    padding: 0.6rem 1.3rem;
    margin-bottom: 3rem;
}

.wrapper_preloader {
    position: fixed;
    width: 100vw;
    height: 100vh;
    background-color: #00000094;
    /* background-color: white; */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000000000000;
}

@keyframes ldio-fg0b793wpmr {
    0% {
        opacity: 1;
        backface-visibility: hidden;
        transform: translateZ(0) scale(1.5, 1.5);
    }
    100% {
        opacity: 0;
        backface-visibility: hidden;
        transform: translateZ(0) scale(1, 1);
    }
}
.ldio-fg0b793wpmr div > div {
    position: absolute;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #e63b40;
    animation: ldio-fg0b793wpmr 1s linear infinite;
}
.ldio-fg0b793wpmr div:nth-child(1) > div {
    left: 148px;
    top: 88px;
    animation-delay: -0.875s;
}
.ldio-fg0b793wpmr > div:nth-child(1) {
    transform: rotate(0deg);
    transform-origin: 160px 100px;
}
.ldio-fg0b793wpmr div:nth-child(2) > div {
    left: 130px;
    top: 130px;
    animation-delay: -0.75s;
}
.ldio-fg0b793wpmr > div:nth-child(2) {
    transform: rotate(45deg);
    transform-origin: 142px 142px;
}
.ldio-fg0b793wpmr div:nth-child(3) > div {
    left: 88px;
    top: 148px;
    animation-delay: -0.625s;
}
.ldio-fg0b793wpmr > div:nth-child(3) {
    transform: rotate(90deg);
    transform-origin: 100px 160px;
}
.ldio-fg0b793wpmr div:nth-child(4) > div {
    left: 46px;
    top: 130px;
    animation-delay: -0.5s;
}
.ldio-fg0b793wpmr > div:nth-child(4) {
    transform: rotate(135deg);
    transform-origin: 58px 142px;
}
.ldio-fg0b793wpmr div:nth-child(5) > div {
    left: 28px;
    top: 88px;
    animation-delay: -0.375s;
}
.ldio-fg0b793wpmr > div:nth-child(5) {
    transform: rotate(180deg);
    transform-origin: 40px 100px;
}
.ldio-fg0b793wpmr div:nth-child(6) > div {
    left: 46px;
    top: 46px;
    animation-delay: -0.25s;
}
.ldio-fg0b793wpmr > div:nth-child(6) {
    transform: rotate(225deg);
    transform-origin: 58px 58px;
}
.ldio-fg0b793wpmr div:nth-child(7) > div {
    left: 88px;
    top: 28px;
    animation-delay: -0.125s;
}
.ldio-fg0b793wpmr > div:nth-child(7) {
    transform: rotate(270deg);
    transform-origin: 100px 40px;
}
.ldio-fg0b793wpmr div:nth-child(8) > div {
    left: 130px;
    top: 46px;
    animation-delay: 0s;
}
.ldio-fg0b793wpmr > div:nth-child(8) {
    transform: rotate(315deg);
    transform-origin: 142px 58px;
}
.loadingio-spinner-spin-00v6rh98250yb {
    width: 200px;
    height: 200px;
    display: inline-block;
    overflow: hidden;
    background: none;
}
.ldio-fg0b793wpmr {
    width: 100%;
    height: 100%;
    position: relative;
    transform: translateZ(0) scale(1);
    backface-visibility: hidden;
    transform-origin: 0 0; /* see note above */
}
.ldio-fg0b793wpmr div {
    box-sizing: content-box;
}
/* generated by https://loading.io/ */

.hidden_pre {
    overflow: hidden;
}

.wrap {
    position: relative;
    z-index: 100;
    width: 100%;
    height: 100%;
    padding: 0 60px;
    background-color: #fff !important;
    /* background: url(https://images.unsplash.com/photo-1485069203392-8e1aeb1ebf02?auto=format&fit=crop&w=1054&q=80&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D) center no-repeat; */
    /* -webkit-background-size: cover;
    background-size: cover; */
    overflow: hidden;
}

/* .wrap:after {
    content:'';
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,.5);
  }
   */
.slider {
    position: relative;
    z-index: 200;
    padding: 0 0px;
    margin: 0 auto;
    /* max-width: 1200px; */
    width: 100%;
}

.slick-arrow {
    position: absolute;
    top: 50%;
    width: 40px;
    height: 50px;
    line-height: 50px;
    margin-top: -25px;
    border: none;
    background: transparent;
    color: #fff;
    /* font-family: monospace; */
    font-family: "abel";
    font-size: 5rem;
    z-index: 300;
    outline: none;
}

.slick-prev i {
    font-size: 2.5rem;
}
.slick-prev {
    left: -50px;
    text-align: left;
}

.slick-next i {
    font-size: 2.5rem;
}
.slick-next {
    /* right: -50px; */
    right: 0px;
    text-align: right;
}

.item.slick-slide {
    width: 400px;
    height: 400px;
    transition: transform 0.4s;
    position: relative;
    margin-left: 115px;
    margin-right: 115px;
}

.slick-slide:after {
    content: "";
    position: absolute;
    z-index: 2;
    /*  top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,.5); */
    transition: transform 0.4s;
}

.item.slick-slide {
    transform: scale(0.7) translate(640px);
}

.item.slick-slide.slick-center + .slick-slide {
    transform: scale(0.8) translate(-250px);
    z-index: 10;
}

.item.slick-slide.slick-center + .slick-slide + .item.slick-slide {
    transform: scale(0.7) translate(-640px);
    z-index: 5;
}

.item.slick-slide.slick-active {
    transform: scale(0.8) translate(250px);
}

.item.slick-slide.slick-center {
    /* margin: 0 -10%; */
    transform: scale(1);
    z-index: 30;
}

.slick-center:after {
    opacity: 0;
}

.clasemodal {
    position: relative;
    border-radius: 0.5rem;
    text-align: center;
    padding: 3rem 2rem;
    background-color: #f8f7ef;
    width: 36%;
    font-size: 1rem;
    z-index: 5000000000;
}
.conten_modal {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.show-filtros {
    /* float: left; */
    /* width: 88%; */
    display: flex;
    flex-wrap: wrap;
    width: 50rem;
    height: auto;
}
.show-filtros a {
    margin: 0.3rem;
    box-shadow: 1px 1px 19px 0px rgba(0, 0, 0, 0.3);
    border-radius: 5px;
}

.show-filtros a.btn-limpa-filtro {
    height: 30px;
    font-size: 16px;
    display: flex;
    align-items: center;
    padding: 3px 15px;
    background-color: #000;
    color: white !important;
}

.container-marcas {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: auto;
    margin: 1rem auto;
    gap: 1.5rem;
    scroll-behavior: smooth;
    overflow: hidden;
    gap:5px;
    /* justify-content: space-between; */
    }
    .Image-container {
    /* border: 1px solid red; borde rojo*/
    box-sizing: border-box;
    flex: auto;
    position: relative;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    }
    .Image{
    /* max-height: 50px; */
    width: 100%;
    /* border-radius: 5px; */
    /* gap: 12px; */
    }


    .slick-list.draggable{
        height: 150px !important;
    }

    .slick-slide img {
        display: block !important;
        height: 1.6rem !important;
        overflow: hidden !important;
    }

    .slick-carousel.slick-initialized.slick-slider.slick-dotted{
        height: 4rem;
    }

    .slick-initialized .slick-slide {
        display: block;
        height: 70px;
        margin-bottom: 10px;
        /* border-bottom: solid 5px lightgray; */
    }

    .slick-slide:hover{
        border-bottom: solid #e3403e 5px;
        cursor:pointer;
        transition: all 0.2s ease-in;
    }

    .slick-track{
        display: flex !important;
        gap: 10px ;
    }

