/* Minification failed. Returning unminified contents.
(2,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(4,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(5,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(6,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(7,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(8,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(9,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(10,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(11,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(12,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(24,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(25,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(26,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(27,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(28,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(33,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(34,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(35,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(36,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(37,9): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(42,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-texto'
(49,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(50,21): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(55,18): run-time error CSS1039: Token not allowed after unary operator: '-main-height-body'
(56,17): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(61,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-tituloXL'
(67,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-tituloXL'
(72,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-titulo'
(77,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-subtitulo'
(81,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-subtitulo'
(86,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(102,18): run-time error CSS1039: Token not allowed after unary operator: '-main-height-body'
(103,17): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(125,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(144,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(145,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(159,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(163,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(164,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(166,23): run-time error CSS1046: Expect comma, found '0'
(166,27): run-time error CSS1046: Expect comma, found '/'
(175,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(177,23): run-time error CSS1046: Expect comma, found '0'
(177,27): run-time error CSS1046: Expect comma, found '/'
(181,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(186,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(188,23): run-time error CSS1046: Expect comma, found '0'
(188,27): run-time error CSS1046: Expect comma, found '/'
(193,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(194,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(205,23): run-time error CSS1046: Expect comma, found '0'
(205,27): run-time error CSS1046: Expect comma, found '/'
(224,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(233,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondo'
(323,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(324,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(347,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(351,24): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(546,17): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(581,21): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(583,27): run-time error CSS1046: Expect comma, found '0'
(583,31): run-time error CSS1046: Expect comma, found '/'
(587,29): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-texto'
(591,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-tituloXL'
(607,21): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(629,33): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-subtitulo'
(705,17): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(715,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-titulo'
(720,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-tituloXL'
(759,32): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(843,21): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(849,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-titulo'
(864,25): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(866,31): run-time error CSS1046: Expect comma, found '0'
(866,35): run-time error CSS1046: Expect comma, found '/'
(879,25): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(881,31): run-time error CSS1046: Expect comma, found '0'
(881,35): run-time error CSS1046: Expect comma, found '/'
(898,27): run-time error CSS1046: Expect comma, found '0'
(898,31): run-time error CSS1046: Expect comma, found '/'
(955,25): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(993,29): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-titulo'
(1015,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioTexto'
(1017,23): run-time error CSS1046: Expect comma, found '0'
(1017,27): run-time error CSS1046: Expect comma, found '/'
(1051,21): run-time error CSS1039: Token not allowed after unary operator: '-main-width-body'
(1064,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(1070,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(1076,25): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(1083,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1084,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1085,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1086,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1087,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1091,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondoNav'
(1093,18): run-time error CSS1039: Token not allowed after unary operator: '-main-height-nav'
(1094,19): run-time error CSS1039: Token not allowed after unary operator: '-main-paddingBtm-nav'
(1099,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondo'
(1131,17): run-time error CSS1039: Token not allowed after unary operator: '-main-width-nav'
(1132,18): run-time error CSS1039: Token not allowed after unary operator: '-main-height-nav'
(1150,27): run-time error CSS1039: Token not allowed after unary operator: '-main-height-nav'
(1180,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTextoNav'
(1186,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTextoNav'
(1195,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(1347,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondo'
(1385,23): run-time error CSS1046: Expect comma, found '0'
(1385,27): run-time error CSS1046: Expect comma, found '/'
(1463,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondo'
(1464,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(1532,17): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalTexto'
(1728,23): run-time error CSS1046: Expect comma, found '0'
(1728,27): run-time error CSS1046: Expect comma, found '/'
(1995,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(2017,23): run-time error CSS1046: Expect comma, found '0'
(2017,27): run-time error CSS1046: Expect comma, found '/'
(2058,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(2095,23): run-time error CSS1046: Expect comma, found '0'
(2095,27): run-time error CSS1046: Expect comma, found '/'
(2177,23): run-time error CSS1046: Expect comma, found '0'
(2177,27): run-time error CSS1046: Expect comma, found '/'
(2204,23): run-time error CSS1046: Expect comma, found '0'
(2204,27): run-time error CSS1046: Expect comma, found '/'
(2349,23): run-time error CSS1046: Expect comma, found '0'
(2349,27): run-time error CSS1046: Expect comma, found '/'
(2383,27): run-time error CSS1046: Expect comma, found '0'
(2383,31): run-time error CSS1046: Expect comma, found '/'
(2388,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-texto'
(2402,23): run-time error CSS1046: Expect comma, found '0'
(2402,27): run-time error CSS1046: Expect comma, found '/'
(2404,21): run-time error CSS1039: Token not allowed after unary operator: '-main-font-size-textoSM'
(2660,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
(2661,17): run-time error CSS1039: Token not allowed after unary operator: '-ColorSecundarioTexto'
(2673,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorPrincipalFondo'
(2684,18): run-time error CSS1039: Token not allowed after unary operator: '-main-height-body'
(2700,28): run-time error CSS1039: Token not allowed after unary operator: '-main-ColorSecundarioFondo'
 */
:root {
    --main-height-body: calc(100vh - var(--main-height-nav) - var(--main-paddingBtm-nav));
    --main-width-body: calc(100vw);
    --main-ColorPrincipalFondo: #FFFAEF;
    --main-ColorPrincipalTexto: #CE8253;
    --main-ColorSecundarioFondo: #CE8253;
    --main-ColorSecundarioTexto: #FFFAEF;
    --main-font-size-tituloXL: 90px;
    --main-font-size-titulo: 55px;
    --main-font-size-subtitulo: 35px;
    --main-font-size-texto: 20px;
    --main-font-size-textoSM: 15px;
}

/*@media only screen and (max-width: 940px) and (min-height: 485px) {
    :root {
        --main-font-size-titulo: 40px;
        --main-font-size-subtitulo: 30px;
        --main-font-size-texto: 20px;
    }
}*/
@media (min-width: 992px) {
    :root {
        --main-font-size-tituloXL: 80px;
        --main-font-size-titulo: 45px;
        --main-font-size-subtitulo: 30px;
        --main-font-size-texto: 20px;
        --main-font-size-textoSM: 15px;
    }
}
@media (max-width: 991px) {
    :root {
        --main-font-size-tituloXL: 25px;
        --main-font-size-titulo: 20px;
        --main-font-size-subtitulo: 15px;
        --main-font-size-texto: 12px;
        --main-font-size-textoSM: 9px;
    }
}

html {
    font-size: var(--main-font-size-texto) !important;
}

body {
    font-family: 'Poppins' !important;
    background: linear-gradient(90deg, rgba(206,130,83,.3) 0%, rgba(255,250,239,1) 50%, rgba(206,130,83,.3) 100%);
    /*background-color: var(--main-ColorPrincipalFondo);*/
    color: var(--main-ColorPrincipalTexto) !important;
    max-width: var(--main-width-body) !important;
    font-weight: 400 !important;
}

.ContenidoPagina {
    height: var(--main-height-body);
    width: var(--main-width-body);
    overflow-y: auto;
}

.tamanoTituloXL {
    font-size: var(--main-font-size-tituloXL) !important;
    font-weight: 700 !important;
    color: #EB813F;
}

.tamanoTituloXLsincolor {
    font-size: var(--main-font-size-tituloXL) !important;
    font-weight: 700 !important;
}

.tamanoTitulo {
    font-size: var(--main-font-size-titulo) !important;
    font-weight: 500 !important;
}

.tamanoSubtitulo {
    font-size: var(--main-font-size-subtitulo) !important;
}

.tamanoSubtituloNaranja {
    font-size: var(--main-font-size-subtitulo) !important;
    color: #EB813F;
}

.tamanoTextoSM {
    font-size: var(--main-font-size-textoSM) !important;
}

.TextoNaranja {
    color: #EB813F;
}

.TextoNegro {
    color: black;
}
.TXT_BtnTitulo_Compra{
    font-size:25px;
}


.ContenedorFullEspacio {
    height: var(--main-height-body);
    width: var(--main-width-body);
    overflow: auto;
}

.CentraContenido_Flex {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.CentraContenido_Block {
    text-align: center;
    align-self: center;
}

.toast {
    z-index: 9999999999;
    box-shadow: 5px 5px 15px #ce8253 !important;
}

.toast-body, .toast-header {
    color: var(--main-ColorPrincipalTexto) !important;
    font-size: 18px;
    font-weight: 500;
}

.LogoDiv {
    background-image: url('img/logo/logo.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.LogoImg {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btn_Sesion {
    background-color: var(--main-ColorSecundarioFondo);
    color: var(--main-ColorSecundarioTexto);
    width: 80px !important;
}

    .btn_Sesion span {
        display: none;
    }

    .btn_Sesion img, .btn_Sesion img {
        width: 30px;
        height: 30px;
    }

.buttonSt {
    border: solid 1px var(--main-ColorSecundarioFondo);
    border-radius: 10px !important;
    height: 45px;
    width: 150px;
    background-color: var(--main-ColorSecundarioFondo);
    color: var(--main-ColorSecundarioTexto);
    transition: background-color 0.3s ease;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.buttonConoceme {
    border: solid 1px #FFC08F;
    border-radius: 10px !important;
    height: 80px;
    width: 250px;
    background-color: #FFC08F;
    color: var(--main-ColorSecundarioTexto);
    transition: background-color 0.3s ease;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.buttonNaranja {
    border: solid 1px var(--main-ColorSecundarioFondo);
    border-radius: 10px !important;
    height: 45px;
    width: 150px;
    background-color: #EB813F;
    color: var(--main-ColorSecundarioTexto);
    transition: background-color 0.3s ease;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.buttonSt:hover, .buttonInv:hover, .buttonConoceme:hover, .buttonNaranja:hover {
    background-color: rgba(206, 130, 83, .3);
    border: solid 2px var(--main-ColorSecundarioFondo);
    color: var(--main-ColorPrincipalTexto);
}

.buttonInv {
    border-radius: 10px !important;
    height: 45px;
    width: 150px;
    transition: background-color 0.3s ease;
    border: solid 2px #EB813F;
    background-color: white;
    color: #EB813F;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.buttonMenu2L {
    height: 90px !important;
    width: 300px !important;
}

.buttonSM {
    height: 30px !important;
    width: 70px !important;
}

.buttonPago {
    height: 35px !important;
    width: 130px !important;
}

.modal {
    color: var(--main-ColorPrincipalTexto);
}

.modal .LogoDiv {
    width: 100%;
    height: 50px;
}

.modal .modal-content {
    background-color: var(--main-ColorPrincipalFondo);
}

.ModalBienvenida img {
    background-position: top;
    background-size: cover;
    width: 90%;
    height: 100%;
    border-radius: 25px;
}

.IconoLogoCh {
    width: 100px !important;
    border-radius: 15px;
}

.btn_iconoGd {
    width: 50px !important;
    height: 50px !important;
    border-radius: 15px;
    border-color: transparent;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btn_icono {
    width: 25px !important;
    height: 25px !important;
    border-radius: 15px;
    border-color: transparent;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.btn_iconoCH {
    width: 20px !important;
    height: 20px !important;
    border-radius: 15px;
    border-color: transparent;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
.btn_Agregar {
    background-image: url('img/iconos/paloma.png');
}


.btn_actualizar {
    background-image: url('img/iconos/actualizar.png');
}

.btnEditar {
    background-image: url('img/iconos/EDITAR.png');
}

.btnEliminar {
    background-image: url('img/iconos/ELIMINAR.png');
}

.btn_facebook {
    background-image: url('img/redes/facebook.png');
}

.btn_instagram {
    background-image: url('img/redes/instagram.png');
}

.btn_whatsapp {
    background-image: url('img/redes/whatsapp.png');
}

.btn_tiktok {
    background-image: url('img/redes/tiktok.png');
}

.btn_youtube {
    background-image: url('img/redes/youtube.png');
}

.btn_spotify {
    background-image: url('img/redes/spotify.png');
}

th {
    background-color: var(--main-ColorSecundarioFondo) !important;
    color: var(--main-ColorSecundarioTexto);
}

    th:first-child {
        border-start-start-radius: 15px;
        border-style: none;
    }

    th:last-child {
        border-start-end-radius: 15px;
        border-style: none;
    }

tr {
    background-color: white !important;
    /*color: var(--main-ColorPrincipalTexto);*/
}

    tr:first-child {
        border-style: none;
    }

table {
    font-size: var(--main-font-size-textoSM);
}

tbody, td, tfoot, th, thead, tr {
    border-color: var(--main-ColorSecundarioFondo) !important;
    border-style: solid;
    border-width: 0;
}

@media (min-width: 992px) {

    .btn_icono {
        width: 50px !important;
        height: 50px !important;
    }

    .btn_Sesion {
        height: 40px !important;
        width: 220px !important;
        margin-right: 10px;
    }

        .btn_Sesion img {
                height: 25px !important;
                width: 25px !important; 
                margin-right: 10px;
            }

        .btn_Sesion span {
            display: block;
        }

    .buttonSt, .buttonInv, .buttonNaranja {
        height: 80px;
        width: 220px;
    }

    .buttonMenu2L {
        height: 160px !important;
        width: 550px !important;
    }

    .buttonSM {
        height: 35px !important;
        width: 120px !important;
    }

    .buttonPago {
        height: 35px !important;
        width: 250px !important;
    }

    .buttonConoceme {
        height: 80px;
        width: 300px;
    }

}




    /*
.btn_paloma {
    background-image: url('img/iconos/paloma.png');
}


.btn_MiCuenta {
    background-image: url('img/usuario.png');
}


.btn_Administracion {
    background-image: url('img/administracion.png');
}

.btn_Permisos {
    background-image: url('img/permiso.png');
}

.btn_Eliminar {
    background-image: url('img/ELIMINAR.png');
}

.btn_Quitar {
    background-image: url('img/Quitar.png');
}

.btn_EliminarTodo {
    background-image: url('img/EliminarTodo.png');
}

.btn_Editar {
    background-image: url('img/EDITAR.png');
}

.btn_Inventario {
    background-image: url('img/Inventario.png');
}

.btn_pos {
    background-image: url('img/pos.png');
}

.btn_imprimir {
    background-image: url('img/imprimir.png');
}


.btn_codigoBarras {
    background-image: url('img/CodigoBarras.png');
}

.btn_carrito {
    background-image: url('img/carrito.png');
}

.btn_redesSociales {
    background-image: url('img/RedesSociales.png');
}

.btn_redesSociales2 {
    background-image: url('img/RedesSociales2.png');
}

.btn_anadirCarrito {
    background-image: url('img/anadirCarrito.png');
}

.btn_buscar {
    background-image: url('img/lupa.png');
}

.btn_visualizar {
    background-image: url('img/buscar.png');
}

.btn_ver {
    background-image: url('img/ver.png');
}

.btn_seleccionar {
    background-image: url('img/SELECCIONAR.png');
}

.btn_maps {
    background-image: url('img/maps.png');
}

.btn_regresar {
    background-image: url('img/regresar.png');
}

.btn_grafico {
    background-image: url('img/Grafico.png');
}


.LogoGdStyle {
    width: 300px !important;
    height: 100%;
}


.ColorSecundario {
    background-color: var(--main-ColorSecundarioFondo);
    color: var(--main-ColorSecundarioTexto);
}

.ColorPrimario {
    background-color: var(--main-ColorPrincipalFondo) !important;
    color: var(--main-ColorPrincipalTexto) !important;
}

@media only screen and (min-width: 601px) and (max-width: 1024px) {

    .button {
        height: 80px;
        width: 150px;
    }

    .buttonDoble {
        height: 150px !important;
        width: 300px !important;
    }

}*/
/* ############################## */
/* ########### INDEX 1 ########## */
/* ############################## */
.Div_IndexNV1 {
    display: grid;
    grid-template-columns: 0.6fr 0.4fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_IndexNV1Texto Div_IndexNV1Video";
    width: var(--main-width-body);
    align-self: center;
}

.Div_IndexNV1Video {
    grid-area: Div_IndexNV1Video;
    text-align: center;
    align-content: center;
    overflow: hidden;
}

/*    .Div_IndexNV1Video video {*/
    .Div_IndexNV1Video img{
    max-width: 90%;
    max-height: 90%;
    object-fit: fill;
    border-radius: 10%;
    }

.Div_IndexNV1Texto {
    grid-area: Div_IndexNV1Texto;
    align-self: center;
    overflow: hidden;
}

    .Div_IndexNV1Texto label, .Div_IndexNV1Texto button {
        margin-left: 5%;
    }

    .Div_IndexNV1Texto button {
        background-color: #FFC08F !important;
        border: solid 1px #FFC08F;
        border-radius: 5px !important;
        height: 60px;
        width: 150px;
        color: var(--main-ColorSecundarioTexto);
        transition: background-color 0.3s ease;
        box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    }

        .Div_IndexNV1Texto button span {
            font-size: var(--main-font-size-texto);
        }

.tamanoTituloXLIndexNV {
    font-size: var(--main-font-size-tituloXL) !important;
    font-weight: 700 !important;
    color: #EB813F;
}

.Div_Index1Titulo2 {
    grid-area: Div_Index1Titulo2;
}

@media (max-width: 992px) {
    .Div_IndexNV1 {
        grid-template-columns: 1fr;
        grid-template-rows: 0.3fr 0.7fr;
        grid-template-areas:
            "Div_IndexNV1Texto"
            "Div_IndexNV1Video";
        width: var(--main-width-body);
        align-self: center;
    }

    .Div_IndexNV1Texto {
        margin-top: 30px; 
        grid-area: Div_IndexNV1Texto;
        align-self: center;
        overflow: hidden;
        text-align: center;
    }

        .Div_IndexNV1Texto label, .Div_IndexNV1Texto button {
            margin-left: 0px;
        }

        .Div_IndexNV1Texto button {
            height: 60px;
            width: 140px;
        }

            .Div_IndexNV1Texto button span {
                font-size: var(--main-font-size-subtitulo);
            }
}

/* ############################## */
/* ########### INDEX 2 ########## */
/* ############################## */

.stats-container {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 20px;
    position: relative;
    padding: 10px 0;
}

    .stats-container::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        height: 2px;
        background-color: #f4a261;
        z-index: 0; 
    }

.stat-box {
    position: relative;
    background-color: #f7c59f;
    color: white;
    padding: 5px;
    border-radius: 12px;
    border: 2px solid #f4a261;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    width: 200px;
}

.stat-number {
    font-size: 1.5rem;
    font-weight: bold;
    margin: 0;
}

.stat-label {
    font-size: 0.9rem;
    margin: 5px 0 0 0;
}

.stars {
    font-size: 1.8rem;
    color: #ffc107;
    margin-bottom: 20px;
}

@media (max-width: 992px) {

    .stat-box {
        width: 110px;
    }

}

    /* ############################## */
    /* ########### INDEX 3 ########## */
    /* ############################## */
.Div_IndexNV3 {
    display: grid;
    grid-template-columns: 0.65fr 0.35fr;
    grid-template-rows: 0.45fr 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_IndexNV3_titulo Div_IndexNV3_titulo"
        "Div_IndexNV3_Planes Div_IndexNV3_Video";
    width: var(--main-width-body);
   
}

    .Div_IndexNV3_titulo {
        grid-area: Div_IndexNV3_titulo;
        overflow: hidden;
    }

    .Div_IndexNV3_titulo1 {
        font-size: var(--main-font-size-titulo) !important;
        margin: 0px;
    }

    .Div_IndexNV3_titulo2 {
        font-size: var(--main-font-size-tituloXL) !important;
        font-weight: 700 !important;
        margin: 0px;
    }

    .Div_IndexNV3_Video {
        grid-area: Div_IndexNV3_Video;
        text-align: center;
        align-content: center;
        overflow: hidden;
    }

        .Div_IndexNV3_Video video {
            max-width: 90%;
            max-height: 90%;
            object-fit: fill;
            border-radius: 10%;
        }

    .Div_IndexNV3_Planes {
        grid-area: Div_IndexNV3_Planes;
        overflow: hidden;
    }

    .plan-card {
        border: 2px solid #f4a261;
        border-radius: 12px;
        position: relative;
        background-color: #fff;
        box-shadow: 0 4px 10px rgba(0,0,0,0.05);
        padding: 10px 10px 10px 10px;
        margin: 30px 10px 0px 10px;
    }

    .plan-header {
        position: absolute;
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
        background-color: var(--main-ColorPrincipalTexto);
        color: white;
        padding: 8px 20px;
        border-radius: 20px;
        font-weight: bold;
        font-size: 1rem;
        width: 250px;
        text-align: center;
    }

    .plan-features {
        list-style: none;
        padding-left: 0;
        margin-top: 30px;
        margin-bottom: 20px;
    }

    .plan-price {
        display: grid;
        grid-template-columns: 0.37fr 0.63fr;
        grid-template-rows: 1fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "per-day buy-button";
        font-size: 1.4rem;
        color: #e76f51;
        margin-bottom: 10px;
    }

    .per-day {
        grid-area: per-day;
        font-size: 0.9rem;
        font-weight: normal;
        color: #888;
    }

    .buy-button {
        grid-area: buy-button;
        background-color: #f4a261;
        color: white;
        border: none;
        padding: 10px 20px;
        border-radius: 5px;
        font-size: 0.95rem;
        cursor: pointer;
        transition: background-color 0.3s ease;
        position: absolute;
        right: 10px;
    }

    @media (max-width: 992px) {

        .Div_IndexNV3 {
            grid-template-columns: 1fr;
            grid-template-rows: 0.15fr 0.7fr min-content;
            grid-template-areas:
                "Div_IndexNV3_titulo"
                "Div_IndexNV3_Video"
                "Div_IndexNV3_Planes";
        }

        .plan-header {
            width: 150px;
        }

        .Div_IndexNV3_Planes {
            margin-bottom: -50px;
        }
    }

    /* ############################## */
    /* ########### INDEX 4 ########## */
    /* ############################## */
    .Div_IndexNV4 {
        display: grid;
        grid-template-columns: 0.4fr 0.1fr 0.2fr 0.3fr;
        grid-template-rows: 0.1fr 1fr 0.1fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "Div_IndexNV4_Titulo Div_IndexNV4_Titulo Div_IndexNV4_Titulo Div_IndexNV4_VerTodos"
            "Div_IndexNV4_Imagen Div_IndexNV4_Testimonios Div_IndexNV4_Testimonios Div_IndexNV4_Testimonios"
            "Div_IndexNV4_EmpiezaYA Div_IndexNV4_EmpiezaYA Div_IndexNV4_EmpiezaYA Div_IndexNV4_EmpiezaYA";
        width: var(--main-width-body);
        align-self: center;
    }

    .Div_IndexNV4_Titulo {
        grid-area: Div_IndexNV4_Titulo;
        font-size: var(--main-font-size-titulo) !important;
        margin: 0px;
        font-weight: 700;
    }

    .Div_IndexNV4_VerTodos {
        grid-area: Div_IndexNV4_VerTodos;
    }

        .Div_IndexNV4_VerTodos button {
            background-color: #FFC08F !important;
            border: solid 1px #FFC08F;
            border-radius: 5px !important;
            height: 60px;
            width: 150px;
            color: var(--main-ColorSecundarioTexto);
            transition: background-color 0.3s ease;
            box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
        }

    .Div_IndexNV4_EmpiezaYA {
        grid-area: Div_IndexNV4_EmpiezaYA;
    }

        .Div_IndexNV4_EmpiezaYA button {
            background-color: #FFC08F !important;
            border: solid 1px #FFC08F;
            border-radius: 5px !important;
            height: 60px;
            width: 150px;
            color: var(--main-ColorSecundarioTexto);
            transition: background-color 0.3s ease;
            box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
            margin: 20px;
        }

    .Div_IndexNV4_Imagen {
        grid-area: Div_IndexNV4_Imagen;
    }

    .Div_IndexNV4_contImagen {
        border-radius: 30px !important;
        height: 500px;
        width: 90%;
        transition: background-color 0.3s ease;
        border: solid 2px white;
        background-color: white;
        color: #EB813F;
        padding: 0px;
        box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    }

    .div_buttonIndexNV4_Imagen {
        background-repeat: no-repeat;
        background-position: top;
        background-size: cover;
        border-radius: 30px;
        width: 95%;
        height: 95%;
        place-self: center;
        background-image: url('img/testimonios/1.png');
        border-radius: 30px !important;
    }

    .Div_IndexNV4_Testimonios {
        grid-area: Div_IndexNV4_Testimonios;
    }

    .testimonial-card {
        background: #fff7f0;
        border: 1px solid #f1c9a6;
        border-start-start-radius: 12px;
        border-start-end-radius: 12px;
        padding: 10px 10px 0px 10px;
        box-shadow: 0 4px 8px rgba(0,0,0,0.05);
        width: 90%;
    }

    .testimonial-author {
        text-align: center;
        font-style: italic;
        font-weight: bold;
        color: white;
        background-color: #FFC08F;
        border-end-start-radius: 12px;
        border-end-end-radius: 12px;
        padding: 20px;
        margin-bottom: 10px;
        width: 90%;
    }


    @media (max-width: 992px) {

        .Div_IndexNV4 {
            display: grid;
            grid-template-columns: 1fr 1fr 1fr;
            grid-template-rows: 0.1fr 0.1fr 0.4fr 1fr 0.1fr;
            gap: 10px 0px;
            grid-auto-flow: row;
            grid-template-areas:
                "Div_IndexNV4_Titulo Div_IndexNV4_Titulo Div_IndexNV4_Titulo"
                "Div_IndexNV4_VerTodos Div_IndexNV4_VerTodos Div_IndexNV4_VerTodos"
                "Div_IndexNV4_Imagen Div_IndexNV4_Imagen Div_IndexNV4_Imagen"
                "Div_IndexNV4_Testimonios Div_IndexNV4_Testimonios Div_IndexNV4_Testimonios"
                "Div_IndexNV4_EmpiezaYA Div_IndexNV4_EmpiezaYA Div_IndexNV4_EmpiezaYA";
            width: var(--main-width-body);
        }

        .Div_IndexNV4_Titulo {
            text-align: center;
            align-content: center;
        }

        .Div_IndexNV4_VerTodos {
            justify-content: center;
            align-content: center;
            justify-items: center;
        }

        .Div_IndexNV4_VerTodos button, .Div_IndexNV4_EmpiezaYA button {
            height: 40px;
            width: 110px;
        }

        .Div_IndexNV4_contImagen {
            height: 250px;
            width: 90%;
        }
    }

    /* ############################## */
    /* ########### INDEX 5 ########## */
    /* ############################## */
.Div_IndexNV5 {
    background-repeat: no-repeat;
    background-position: left;
    background-size: cover;
    width: 100%;
    height: 700px;
    background-image: url('img/index/IndexFitMod1.png');
}

        .Div_IndexNV5 p {
            font-size: var(--main-font-size-titulo) !important;
            font-weight: 700 !important;
            color: #FFC08F;
            margin: 0px;
        }

.Div_IndexNV5_Texto {
    padding-top: 40px;
    padding-left: 40px;
}


    .Div_IndexNV5_Texto p {
        text-shadow: 2px 2px 4px rgba(0,0,0, 1);
    }

.Div_IndexNV5 button {
    background-color: #FFC08F !important;
    border: solid 1px #FFC08F;
    border-radius: 5px !important;
    height: 60px;
    width: 150px;
    color: var(--main-ColorSecundarioTexto);
    transition: background-color 0.3s ease;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    margin-top: 40px;
}

    @media (max-width: 992px) {

        .Div_IndexNV5 {
            height: 250px;
            background-position: left;
        }

            .Div_IndexNV5 button {
                height: 40px;
                width: 110px;
                margin-top: 40px;
            }

        .Div_IndexNV5_Texto {
            padding-top: 30px;
            padding-left: 10px;
        }
    }

    /* ############################## */
    /* ########### INDEX 6 ########## */
    /* ############################## */
    .Div_IndexNV6 {
        display: grid;
        grid-template-columns: 0.33fr 0.33fr 0.33fr;
        grid-template-rows: 1fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "div_telefono Div_Info1 Div_Info2";
        width: var(--main-width-body);
        background-color: rgba(235, 129, 63, 0.44);
    }

        .Div_IndexNV6 label {
            color: white;
            margin-top: 20px;
            margin-bottom: 20px;
        }

    .div_telefono {
        grid-area: div_telefono;
        text-align: center;
        font-size: var(--main-font-size-textoSM);
    }

    .Div_Info1 {
        grid-area: Div_Info1;
        text-align: center;
        font-size: var(--main-font-size-textoSM);
    }

    .Div_Info2 {
        grid-area: Div_Info2;
        text-align: center;
        font-size: var(--main-font-size-textoSM);
    }

/* ##################################### */
/* ################ NAV ################ */
/* ##################################### */
:root {
    --main-height-nav: 80px;
    --main-paddingBtm-nav: 0px;
    --main-width-nav: var(--main-width-body);
    --main-ColorPrincipalFondoNav: var(--main-ColorPrincipalFondo);
    --main-ColorPrincipalTextoNav: var(--main-ColorPrincipalTexto);
}

.EstiloNav {
    background-color: var(--main-ColorPrincipalFondoNav) !important;
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
    height: var(--main-height-nav);
    padding: var(--main-paddingBtm-nav) !important;
    /*margin-bottom: 10px !important;*/
}

.offcanvas {
    background-color: var(--main-ColorPrincipalFondo) !important;
}

.offcanvas-header {
    padding: 0px !important;
    padding-top: 15px !important;
    display: grid !important;
    grid-template-columns: 0.1fr 0.9fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_CerrarOffcanvas Div_NavLogoInt";
    width: 100% !important;
}

.offcanvas-body {
    width: 90%;
}

.container-fluid {
    padding: 0px !important;
}

.Div_NavHeader {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_NavBtnOffCanvas Div_NavLogo Div_NavBtnSesion";
    width: var(--main-width-nav) !important;
    height: var(--main-height-nav) !important;
}

.Div_NavBtnOffCanvas {
    grid-area: Div_NavBtnOffCanvas;
    align-self: center;
    justify-self: left;
    padding-left: 10px;
}

.Div_NavLogo {
    grid-area: Div_NavLogo;
    text-align: center;
    align-content: center;
    place-self: center;
}

.Div_NavLogo img {
    max-height: calc(var(--main-height-nav) - 10px) !important;
    padding: 5px;
}

.Div_NavBtnSesion {
    grid-area: Div_NavBtnSesion;
    align-self: center;
    justify-self: right;
    padding-right: 10px;
}

.Div_CerrarOffcanvas {
        width: 100%;
        height: 100%;
        justify-self: left;
        padding-left: 15px;
    }

.Div_NavLogoInt {
}

    .Div_NavLogoInt img {
        max-width: 80% !important;
    }

.ElementoMenuNav {
    background-color: transparent !important;
    width: 100%;
    height: 30px;
    text-align: left;
    color: var(--main-ColorPrincipalTextoNav) !important;
    font-weight: 500;
    border: none;
}

.FormMenuNav hr {
    border: solid 1px var(--main-ColorPrincipalTextoNav);
}

.CopyRight {
    position: absolute; /* Use absolute positioning */
    bottom: 0; /* Position at bottom */
    left: 0; /* Position from left edge */
    display: flex; /* Allow horizontal button arrangement */
    justify-content: center; /* Center buttons horizontally */
    color: var(--main-ColorPrincipalTexto) !important;
    width: 100%;
    z-index: 999999;
    font-size: 10px;
}

@media (min-width: 992px) {
    .ElementoMenuNav {
        height: 40px;
    }
}
.imgLogo {
    width: 90%;
}

.ModalMsgEspera .modal-content{
    /*height: 250px !important;*/

}

.LogoEspera {
    width: 300px;
}

@media (max-width: 992px) {

    .LogoEspera {
        width: 300px;
    }
}

/* ########################################## */
/* ############### Testimonios ############## */
/* ########################################## */
.ModalTestimoniosFoto .modal-dialog {
    width: 100% !important;
    height: 100% !important;
}

.contenedorTestimonios {
    place-items: center;
}

.carouselTestimoniosIMG img {
    background-position: top;
    background-size: cover;
    width: 90%;
    height: 100%;

    border-radius: 25px;
}

.carouselTestimoniosIMG .carousel-item {
    height: 600px;
    text-align: center;
}

.carouselTestimoniosIMG .carousel {
    width: 90%;
    height: 100%;
    overflow: hidden;
}

.carousel-control-prev-icon, .carousel-control-next-icon {
    filter: drop-shadow(0.1px 1px 10px black);
}

@media (max-width: 992px) {
    .carouselTestimoniosIMG .carousel-item {
        height: 400px;
        text-align: center;
    }
}


/* ########################################## */
/* # CONTENIDO BOTON IMG CON 2 LINEAS TEXTO # */
/* ########################################## */
.Div_BtnConImg {
    display: grid;
    grid-template-columns: 0.3fr 0.7fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_imgBtn Div_textoBtn";
}

.Div_imgBtn {
    grid-area: Div_imgBtn;
    align-content: center
}

.Div_textoBtn {
    grid-area: Div_textoBtn;
}


/* ############################## */
/* ##### ContenedorConTitulo #### */
/* ############################## */
.ContenedorConTitulo {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.2fr 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivTitulo"
        "DivContenido";
    height: 100%;
}

.DivTitulo {
    grid-area: DivTitulo;
    /*overflow: hidden;*/
}

.DivContenido {
    grid-area: DivContenido;
    height: fit-content;
    overflow: auto;
}


/* ############################## */
/* #### DivCuadradoRedondeado ### */
/* ############################## */
.DivCuadradoRedondeado {
    overflow: hidden;
    padding: 20px;
    margin: 7px;
    float: left;
    border: none;
    border-width: 1px;
    border-radius: 2rem !important;
    border-color: transparent;
}


/* ############################## */
/* ########## MI CUENTA ######### */
/* ############################## */
.Div_MiCuenta button {
    margin: 10px;
}

    .Div_MiCuenta .Div_textoBtn {
        text-align: left !important;
    }

.ModalMisCompras .modal-content {
    background-color: var(--main-ColorPrincipalFondo) !important;
}



/* ############################## */
/* ######## ADMINISTRACION ###### */
/* ############################## */
.DivAdministracionIndex_Cont {
    height: fit-content !important;
}

.DivAdministracionIndex_Cont button{
    margin:5px;
}

.Div_AdminUsuariosTbl, .Div_AdminProdServTbl {
    margin-left: 2vw;
    margin-right: 2vw;
}

/* ############################## */
/* ########### ESTORE ########### */
/* ############################## */
.ContenedorElemento_EStore {
    display: grid;
    grid-template-columns: 0.4fr 0.6fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_ImgElemento_EStore Div_ContDescripcionElemento_EStore";
    width: 650px;
    height: 320px;
    background-color: white;
    border-radius: 30px;
    margin: 10px;
    cursor: pointer;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.Div_ImgElemento_EStore {
    grid-area: Div_ImgElemento_EStore;
}

.ImgElemento_EStore {
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    width: 90%;
    height: 90%;
    border-radius: 25px;
}

.Div_ContDescripcionElemento_EStore {
    grid-area: Div_ContDescripcionElemento_EStore;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.15fr 0.18fr 0.65fr 0.1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_NombreElemento_EStore"
        "Div_DuracionElemento_EStore"
        "Div_DescripcionElemento_EStore"
        "Div_CostoElemento_EStore";
    overflow: hidden;
}

.Div_NombreElemento_EStore {
    grid-area: Div_NombreElemento_EStore;
    font-weight: 600;
    overflow: hidden;
    margin-top: 5px;
}

.Div_DuracionElemento_EStore {
    grid-area: Div_DuracionElemento_EStore;
    color: black;
    font-weight: 600;
    overflow: hidden;
}

.Div_DescripcionElemento_EStore {
    grid-area: Div_DescripcionElemento_EStore;
    overflow: auto;
}

    .Div_DescripcionElemento_EStore label {
        color: black !important;
    }

.Div_CostoElemento_EStore {
    grid-area: Div_CostoElemento_EStore;
    color: #EB813F;
    font-weight: 600;
    text-align: right;
    margin-right: 20px;
    margin-bottom: 5px;
}

.txt_CostoAntElemento_EStore{
    /*color: black;*/
    font-weight: 400;
}

.btn_PalomaEStore {
    width: 35px;
    height: 35px;
}

.pagination {
    place-content: center;
}

.page-link {
    background-color: var(--main-ColorPrincipalFondo) !important;
    border: 1px solid var(--main-ColorSecundarioFondo) !important;
    color: black !important;
}

@media (max-width: 992px) {
    .ContenedorElemento_EStore {
        width: 90%;
        height: 225px;
    }

    .btn_PalomaEStore {
        width: 25px;
        height: 25px;
    }

    .Div_NombreElemento_EStore {
        margin-top: 0px;
    }
}


/* ############################## */
/* ##### ESTORE Vista Previa #### */
/* ############################## */
.ModalVistaPreviaProducto .modal-dialog, .ModalVistaPreviaProducto .modal-content {
    width: 100% !important;
    height: 100% !important;
    max-width: 95% !important;
    max-height: 95% !important;
    margin: 0px !important;
    padding: 0px !important;
    place-content: center;
    /*background-color: red;*/
}

.ModalVistaPreviaProducto {
    place-items: center;
}


.ContenedorElementoVP_EStore {
    display: grid;
    grid-template-columns: 0.3fr 0.7fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_ImgElementoVP_EStore Div_ContDescripcionElementoVP_EStore";
    background-color: white;
    width: 100%;
    height: 100%;
}

.Div_ImgElementoVP_EStore {
    grid-area: Div_ImgElementoVP_EStore;
    align-content: center;
}

.ImgElementoVP_EStore {
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    width: 90%;
    height: 100%;
    border-radius: 20px;
    transform-style: preserve-3d;
    border: 0px solid;
    transition: all .3s ease;
    color: var(--main-ColorPrincipalTexto);
}

.Div_ContDescripcionElementoVP_EStore {
    grid-area: Div_ContDescripcionElementoVP_EStore;
    display: grid;
    grid-template-columns: 0.5fr 0.5fr;
    grid-template-rows: 0.07fr 0.15fr 0.53fr 0.25fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_NombreElementoVP_EStore Div_NombreElementoVP_EStore"
        "Div_DuracionElementoVP_EStore Div_DuracionElementoVP_EStore"
        "Div_DescripcionElementoVP_EStore Div_DescripcionElementoVP_EStore"
        "Div_CuponElementoVP_EStore Div_CostoElementoVP_EStore";
    padding: 10px !important;
}

.Div_NombreElementoVP_EStore {
    grid-area: Div_NombreElementoVP_EStore;
    font-weight: 600;
    overflow: hidden;
    padding-left: 10px;
}

.Div_DuracionElementoVP_EStore {
    grid-area: Div_DuracionElementoVP_EStore;
    color: black;
    font-weight: 600;
    align-self: center;
    overflow: hidden;
    height: 100%;
    padding-left: 10px; 
}

    .Div_DuracionElementoVP_EStore label {
        margin-bottom: 15px;
    }

.Div_DescripcionElementoVP_EStore {
    grid-area: Div_DescripcionElementoVP_EStore;
    overflow: auto;
    padding-left: 10px;
}

    .Div_DescripcionElementoVP_EStore label {
        color: black !important;
    }

.list-Palomas {
    display: flex;
    align-items: flex-start;
    margin-bottom: 0px;
}

.list-Palomas img{
    margin-right: 10px;
}

.Div_CostoElementoVP_EStore {
    grid-area: Div_CostoElementoVP_EStore;
    color: #EB813F;
    font-weight: 600;
    text-align: right;
    padding-right: 20px;
    overflow: auto;
    justify-content: right !important;
}

.Div_CuponElementoVP_EStore {
    grid-area: Div_CuponElementoVP_EStore;
    color: #EB813F;
    font-weight: 600;
    justify-content: left !important;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    padding-top: 15px;
    padding-left: 10px;
    overflow: hidden;
}

.Div_CuponElementoVP_EStore input{
    width: 200px;
    height: 35px;
    margin-right: 15px;
}

.txt_CostoAntElementoVP_EStore {
    /*color: black;*/
    font-weight: 400;
    overflow: hidden;
}

.txt_costo, .txt_descuento {
    color: black;
    font-weight: 400;
}

.txt_total {
    font-weight: 600;
    color: #EB813F;

}

.btn_PalomaEStoreVP {
    width: 35px;
    height: 35px;
}

@media (max-width: 992px) {
    .btn_PalomaEStoreVP {
        width: 25px;
        height: 25px;
    }

    .ContenedorElementoVP_EStore {
        grid-template-columns: 1fr;
        grid-template-rows: 0.5fr 1fr;
        grid-template-areas:
            "Div_ImgElementoVP_EStore"
            "Div_ContDescripcionElementoVP_EStore";
    }

    .ImgElementoVP_EStore {
        width: 90%;
        height: 100%;
    }

    .Div_ContDescripcionElementoVP_EStore {
        grid-template-columns: 0.45fr 0.55fr;
        grid-template-rows: 0.1fr 0.15fr 0.35fr 0.5fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "Div_NombreElementoVP_EStore Div_NombreElementoVP_EStore"
            "Div_DuracionElementoVP_EStore Div_DuracionElementoVP_EStore"
            "Div_DescripcionElementoVP_EStore Div_DescripcionElementoVP_EStore"
            "Div_CuponElementoVP_EStore Div_CostoElementoVP_EStore";
    }

    .Div_CuponElementoVP_EStore input {
        width: 110px;
        margin-bottom: 10px;
    }

    .list-Palomas {
        margin-bottom: 5px;
    }

    .ModalVistaPreviaProducto .modal-dialog, .ModalVistaPreviaProducto .modal-content {
        max-width: 95% !important;
        max-height: 95% !important;
    }
}

@media (max-height: 612px) {
    .ContenedorElementoVP_EStore {
        grid-template-columns: 0.3fr 0.7fr;
        grid-template-rows: 1fr;
        grid-template-areas:
            "Div_ImgElementoVP_EStore Div_ContDescripcionElementoVP_EStore";
    }

    .Div_ContDescripcionElementoVP_EStore {
        grid-template-rows: 0.15fr 0.2fr 0.35fr 0.3fr;
    }

    .ModalVistaPreviaProducto .modal-dialog, .ModalVistaPreviaProducto .modal-content {
        max-width: 95% !important;
        max-height: 100% !important;
    }
}


/* ############################## */
/* ########## RETO ######### */
/* ############################## */
.Div_Reto1 button {
    margin: 10px;
}


/* ############################## */
/* ########## Servicios ######### */
/* ############################## */

.buttonServicios {
    border-radius: 30px !important;
    height: 460px;
    width: 350px;
    transition: background-color 0.3s ease;
    border: solid 2px white;
    background-color: white;
    color: #EB813F;
    padding: 0px;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.div_buttonServicios {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.8fr 0.2fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "div_buttonServicios_img"
        "div_buttonServicios_txt";
    width: 100%;
    height: 100%;
}

/*
.buttonServicios2 {
    border-radius: 30px !important;
    height: 338px;
    width: 280px;
    transition: background-color 0.3s ease;
    border: solid 2px white;
    background-color: white;
    color: #EB813F;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}
*/

/*
.div_buttonServicios2 {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.7fr 0.3fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_imgBtn"
        "Div_textoBtn";
    width: 100%;
    height: 100%;
}
*/

.div_buttonServicios_img {
    grid-area: div_buttonServicios_img;
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    border-radius: 30px;
    width: 90%;
    height: 90%;
    place-self: center;
}

.div_buttonServicios_txt {
    grid-area: div_buttonServicios_txt;
    color: black !important;
}

.div_buttonServicios_imgEntrenamiento {
    background-image: url('img/reto/Entrenamientos_reto.jpg');
}

.div_buttonServicios_imgAlimentacion {
    background-image: url('img/reto/PlanAlimentacion_reto.jpg');
}

.div_buttonServicios_imgMeditacion {
    background-image: url('img/reto/Meditaciones_reto.JPG');
}

.div_buttonServicios_imgMiMeta {
    background-image: url('img/reto/MiMeta_Reto.jpg');
}

.div_buttonServicios_imgGrupoWhatsApp {
    background-image: url('img/reto/grupoWhatsapp.jpeg');
}

.div_buttonServicios_imgGym {
    background-image: url('img/pe/Gym.jpg');
}

.div_buttonServicios_imgCasa {
    background-image: url('img/pe/Casa.jpg');
}

.div_buttonServicios_imgIndoorCycling {
    background-image: url('img/pe/Cycling.jpg');
}

.div_buttonServicios_imgLunesGym {
    background-image: url('img/pe/LunesGym.jpg');
}

.div_buttonServicios_imgMartesGym {
    background-image: url('img/pe/MartesGym.jpg');
}

.div_buttonServicios_imgMiercolesGym {
    background-image: url('img/pe/MiercolesGym.jpg');
}

.div_buttonServicios_imgJuevesGym {
    background-image: url('img/pe/JuevesGym.jpg');
}

.div_buttonServicios_imgViernesGym {
    background-image: url('img/pe/ViernesGym.jpg');
}

.div_buttonServicios_imgSabadoGym {
    background-image: url('img/pe/SabadoGym.jpg');
}

.div_buttonServicios_imgLunesCasa {
    background-image: url('img/pe/LunesCasa.jpg');
}

.div_buttonServicios_imgMartesCasa {
    background-image: url('img/pe/MartesCasa.jpg');
}

.div_buttonServicios_imgMiercolesCasa {
    background-image: url('img/pe/MiercolesCasa.jpg');
}

.div_buttonServicios_imgJuevesCasa {
    background-image: url('img/pe/JuevesCasa.jpg');
}

.div_buttonServicios_imgViernesCasa {
    background-image: url('img/pe/ViernesCasa.jpg');
}

.div_buttonServicios_imgSabadoCasa {
    background-image: url('img/pe/SabadoCasa.jpg');
}

.div_buttonServicios_imgEquivalencias {
    background-image: url('img/pa/Equivalencias.jpg');
}

.div_buttonServicios_imgRecomendaciones {
    background-image: url('img/pa/Recomendaciones.jpg');
}

.div_buttonServicios_imgVerMenus {
    background-image: url('img/pa/VerMenus.jpg');
}

.div_buttonServicios_imgVidEquivalencias {
    background-image: url('img/pa/VideoEquivalencias.jpg');
}

.div_buttonServicios_imgInternacional {
    background-image: url('img/pa/Internacional.jpg');
}

.div_buttonServicios_imgMexicano {
    background-image: url('img/pa/mexicano.jpg');
}

.div_buttonServicios_imgVeggie {
    background-image: url('img/pa/veggie.jpeg');
}

.div_buttonServicios_imgSibo {
    background-image: url('img/pa/sibo.jpg');
}

.div_buttonServicios_imgVidLiz {
    background-image: url('img/pa/liz.jpg');
}

.div_buttonServicios_imgFotosTest {
    background-image: url('img/testimonios/FotosTest.png');
}

.div_buttonServicios_imgVideoTest {
    background-image: url('img/testimonios/video.png');
}

.div_buttonServicios_imgBlogTest {
    background-image: url('img/testimonios/Blog.png');
}

.div_buttonServicios_imgDesayuno_Pa {
    background-image: url('img/pa/desayuno.png');
}

.div_buttonServicios_imgComida_Pa {
    background-image: url('img/pa/comida.png');
}

.div_buttonServicios_imgSnack_Pa {
    background-image: url('img/pa/Snack.png');
}

.div_buttonServicios_imgCena_Pa {
    background-image: url('img/pa/cena.png');
}

.div_buttonServicios_imgkcal {
    background-image: url('img/pa/kcalPdf.jpg');
}

.div_buttonServicios_imgGuia {
    background-image: url('img/pa/guiaAyuno.jpg');
}

.div_buttonServicios_imgPostres {
    background-image: url('img/pa/postres.png');
}


@media (max-width: 992px) {

    .buttonServicios {
        border-radius: 15px !important;
        height: 90px;
        width: 300px;
    }

    .div_buttonServicios {
        display: grid;
        grid-template-columns: 0.3fr 0.7fr;
        grid-template-rows: 1fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "div_buttonServicios_img div_buttonServicios_txt";
        width: 100%;
        height: 100%;
    }

    .div_buttonServicios_img {
        border-radius: 15px;
    }

    .div_buttonServicios_txt {
        text-align: left;
        align-content: center;
        padding-left: 15px; 
    }
}


/* ############################## */
/* ##### Entrenamiento #### */
/* ############################## */
.DivContenedorSerieCalentamiento_PE {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.3fr 0.7fr;
    gap: 00px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivNumeroSerieCalentamiento_PE"
        "ContenedorCalentamiento_PE";
    /*place-items: center;*/
    width: 80%;
}

.DivNumeroSerieCalentamiento_PE {
    grid-area: DivNumeroSerieCalentamiento_PE;
    background-color: var(--main-ColorSecundarioFondo);
    color: white;
    width: fit-content;
    padding: 5px 30px 5px 30px;
    border-radius: 30px;
    margin-bottom: 20px;
    margin-left: -30px;
}

.ContenedorCalentamiento_PE {
    grid-area: ContenedorCalentamiento_PE;
    display: grid;
    grid-template-columns: 0.4fr 0.6fr;
    grid-template-rows: 0.3fr 0.7fr;
    gap: 10px 10px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivVideoCalentamiento_PE DivTituloCalentamiento_PE "
        "DivVideoCalentamiento_PE DivInstruccionesCalentamiento_PE";
    background-color: white;
    border-radius: 30px;
    height: 300px;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.DivTituloCalentamiento_PE {
    grid-area: DivTituloCalentamiento_PE;
    font-weight: 600;
    align-content: center;
}

.DivVideoCalentamiento_PE {
    grid-area: DivVideoCalentamiento_PE;
    width: 100%;
    height: 100%;
    align-content: center;
    text-align: center;
}

    .DivVideoCalentamiento_PE iframe {
        width: 90%;
        height: 90%;
        border-radius: 30px;
    }

.DivInstruccionesCalentamiento_PE {
    grid-area: DivInstruccionesCalentamiento_PE;
    text-align: left;
}


.DivContenedorSeries_PE {
    width: 80%;
    place-items: center;
    margin-top: 20px;
}

.DivContenedorSerie_PE {
    width: 100%;
}

.DivNumeroSerie_PE {
    grid-area: DivNumeroSerie_PE;
    background-color: var(--main-ColorSecundarioFondo);
    color: white;
    width: fit-content;
    padding: 5px 30px 5px 30px;
    border-radius: 30px;
    margin-top: 50px;
    margin-left: -30px;
}

.DivEjercicio_PE {
    color: #EB813F;
    font-weight: 500;
    width: fit-content;
    padding: 5px 30px 5px 30px;
    justify-self: right;
    border-start-start-radius: 30px !important;
    border-start-end-radius: 30px !important;
    background-color: white;
    color: #EB813F;
}

.Contenedor_PE {
    margin-bottom: 20px;
    grid-area: Contenedor_PE;
    display: grid;
    grid-template-columns: 0.4fr 0.6fr;
    grid-template-rows: 0.4fr 0.6fr;
    gap: 10px 10px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivVideo_PE DivTitulo_PE"
        "DivVideo_PE DivInstrucciones_PE";
    background-color: white;
    border-start-start-radius: 30px !important;
    border-end-end-radius: 30px !important;
    border-end-start-radius: 30px !important;
    height: 300px;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.DivTitulo_PE {
    grid-area: DivTitulo_PE;
    font-weight: 600;
    align-content: center;
}

.DivVideo_PE {
    grid-area: DivVideo_PE;
    width: 100%;
    height: 100%;
    align-content: center;
    text-align: center;
}

    .DivVideo_PE iframe {
        width: 90%;
        height: 90%;
        border-radius: 30px;
    }

.DivInstrucciones_PE {
    grid-area: DivInstrucciones_PE;
    text-align: left;
}

@media (max-width: 992px) {
    .ContenedorCalentamiento_PE {
        grid-template-columns: 1fr;
        grid-template-rows: 0.7fr 0.1fr 0.2fr;
        grid-template-areas:
            "DivVideoCalentamiento_PE"
            "DivTituloCalentamiento_PE"
            "DivInstruccionesCalentamiento_PE";
        height: 600px;
    }

    .DivEjercicio_PE {
        background-color: white;
        color: #EB813F;
        font-weight: 500;
        width: fit-content;
        padding: 5px 30px 5px 30px;
        justify-self: center;
    }

    .Contenedor_PE {
        grid-template-columns: 1fr;
        grid-template-rows: 0.7fr 0.1fr 0.2fr;
        grid-template-areas:
            "DivVideo_PE"
            "DivTitulo_PE"
            "DivInstrucciones_PE";
        height: 600px;
        margin-bottom: 20px;
        border-start-end-radius: 30px !important;
    }

    .DivTitulo_PE, .DivInstrucciones_PE, .DivInstruccionesCalentamiento_PE, .DivTituloCalentamiento_PE {
        margin-left: 20px;
    }
}

.ContenedorPE_Casa .DivContenido {
    height: auto !important;
    overflow: auto !important;
}

.Contenedor_PE_Casa {
    height: 100%;
}

.DivInstrucciones_PE_Casa {
    background-color: white;
    border-radius: 30px !important;
    width: 80%;
    justify-self: center;
    padding: 20px;
    height: fit-content;
    overflow: hidden;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}

.DivVideo_PE_Casa {
    width: 100%;
    height: 100%;
    align-content: center;
    text-align: center;
    overflow: hidden;
}

    .DivVideo_PE_Casa iframe {
        width: 80%;
        height: 90%;
        border-radius: 30px;
    }

.ContenedorPE_IC .DivContenido {
    height: auto !important;
    overflow: auto !important;
}

.tituloSemana_IC {
    background-color: white;
    width: fit-content;
    padding: 5px 30px 5px 30px;
    border-radius: 30px;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}


/* ############################## */
/* ######### Alimentacion ####### */
/* ############################## */
.button_PA {
    place-self: center;
    display: flex;
}




/* ############################## */
/* #### plan de alimentacion #### */
/* ############################## */
/*.DivPlanAlimentacion {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.2fr 0.2fr 0.6fr;
    gap: 20px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivTituloPa"
        "DivKcal_PA"
        "ContenedorTipoComida_PA";
}

.DivTituloPa {
    grid-area: DivTituloPa;
}

.DivKcal_PA {
    grid-area: DivKcal_PA;
}

    .DivKcal_PA label {
        grid-area: DivNumeroSerie_PE;
        background-color: white;
        padding: 5px 30px 5px 30px;
        border-radius: 15px;
        box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
        width: 450px;
        text-align: center;
    }


.ContenedorTipoComida_PA {
    grid-area: ContenedorTipoComida_PA;
    height: 100% !important;
    width: 100% !important;
}

.DivDesayuno_PA,
.DivComida_PA,
.DivSnack_PA,
.DivCena_PA {
    display: grid;
    grid-template-columns: 0.1fr 0.9fr;
    grid-template-rows: 0.15fr 0.85fr;
    gap: 10px 10px;
    grid-auto-flow: row;
    width: 350px;
    height: fit-content;
}

.DivDesayuno_PA {
    grid-template-areas:
        "DivMarcoDesayuno_PA DivTituloDesayuno_PA"
        "DivMarcoDesayuno_PA DivPlatillosDesayuno_PA";
}

.DivMarcoDesayuno_PA {
    grid-area: DivMarcoDesayuno_PA;
}

.DivTituloDesayuno_PA {
    grid-area: DivTituloDesayuno_PA;
}

.DivPlatillosDesayuno_PA {
    grid-area: DivPlatillosDesayuno_PA;
}

.DivComida_PA {
    grid-template-areas:
        "DivMarcoComida_PA DivTituloComida_PA"
        "DivMarcoComida_PA DivPlatillosComida_PA";
}

.DivMarcoComida_PA {
    grid-area: DivMarcoComida_PA;
}

.DivTituloComida_PA {
    grid-area: DivTituloComida_PA;
}

.DivPlatillosComida_PA {
    grid-area: DivPlatillosComida_PA;
}

.DivSnack_PA {
    grid-template-areas:
        "DivMarcoSnack_PA DivTituloSnack_PA"
        "DivMarcoSnack_PA DivPlatillosSnack_PA";
}

.DivMarcoSnack_PA {
    grid-area: DivMarcoSnack_PA;
}

.DivTituloSnack_PA {
    grid-area: DivTituloSnack_PA;
}

.DivPlatillosSnack_PA {
    grid-area: DivPlatillosSnack_PA;
}

.DivCena_PA {
    grid-template-areas:
        "DivMarcoCena_PA DivTituloCena_PA"
        "DivMarcoCena_PA DivPlatillosCena_PA";
}

.DivMarcoCena_PA {
    grid-area: DivMarcoCena_PA;
}

.DivTituloCena_PA {
    grid-area: DivTituloCena_PA;
}

.DivPlatillosCena_PA {
    grid-area: DivPlatillosCena_PA;
}
*/
.DivKcal_PA label {
    grid-area: DivNumeroSerie_PE;
    background-color: white;
    padding: 5px 30px 5px 30px;
    border-radius: 15px;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    width: 50%;
    text-align: center;
}

.DivPlatillo_PA {
    grid-area: DivPlatillo_PA;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 0.2fr 0.6fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivTituloPlatilo_PA"
        "DivRecetaPlatillo_PA";
    width: 100%;
    margin-bottom: 20px;
}

.DivTituloPlatilo_PA {
    grid-area: DivTituloPlatilo_PA;
    justify-items: center;
}

    .DivTituloPlatilo_PA label {
        width: 70%;
        height: 55px;
        background-color: #EB813F;
        border-start-start-radius: 10px;
        border-start-end-radius: 10px;
        color: black;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    }

.TituloPlatilo_PA {
    text-align: center;
    font-size: var(--main-font-size-texto) !important;
    font-weight: 600;
    color: black;
}

.DivRecetaPlatillo_PA {
    grid-area: DivRecetaPlatillo_PA;
    border-radius: 10px;
    text-align: left !important;
    height: 100%;
    width: 100%;
    padding: 20px;
    
    background-color: white;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
    color: black;
    font-size: var(--main-font-size-textoSM) !important;
    font-weight: 500;

        
    display: grid;
    grid-template-columns: 0.05fr 0.95fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "DivMarco_PA DivRecetaPlatillo_PA";
}

.DivMarco_PA {
    grid-area: DivMarco_PA;
    background-color: #EB813F;
    border-radius: 5px;
    width: 20px;
    height: 100%;
    margin: 10px;
    justify-self: center;
    align-self: center;
}

/*.DivBotonPreparacion_PA {
    width: 100%;
    height: 90px;
    background-color: rgb(215, 215, 215, 0.5);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;*/
    /*color: #D46488;*/
    /*display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 10px;
    background-color: white;
    box-shadow: rgb(1 0 0 / 0.50) 0px 6px 10px 0px;
}
        
.DivMarco_PA,
.DivMarcoDesayuno_PA,
.DivMarcoComida_PA,
.DivMarcoSnack_PA,
.DivMarcoCena_PA {
    background-color: #EB813F;
    border-radius: 5px;
    width: 20px;
    height: 100%;
    margin: 10px;
    justify-self: center;
    align-self: center;
}

.DivTituloTipoComida_PA,
.DivTituloDesayuno_PA,
.DivTituloComida_PA,
.DivTituloSnack_PA,
.DivTituloCena_PA {
    width: 150px;
    height: 50px;
    background-color: #EB813F;
    border-radius: 10px;
    color: white;
    text-align: center;
    font-size: var(--main-font-size-texto) !important;
    font-weight: 600;
}

@media (max-width: 992px) {
    .DivDesayuno_PA,
    .DivComida_PA,
    .DivSnack_PA,
    .DivCena_PA {
        display: block;
        justify-items: center;
        margin: 10px;
    }*/

    /*.DivPlatillosDesayuno_PA,
    .DivPlatillosComida_PA,
    .DivPlatillosSnack_PA,
    .DivPlatillosCena_PA, 
    .DivMarco_PA,
    .DivMarcoDesayuno_PA,
    .DivMarcoComida_PA,
    .DivMarcoSnack_PA,
    .DivMarcoCena_PA {
        display: none;
    }*/
/*}*/




/* ############################## */
/* ########### MI META ########## */
/* ############################## */
/*.MenuDivBtn_MiMeta {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 25vw;
    height: 25vw;
    margin: 50px;
    border-radius: 20px;
    transform-style: preserve-3d;
    border: 1px solid #ffffff;
    box-shadow: 14px 14px 4px rgba(0, 0, 0, 0.25);
    transition: all .3s ease;
}

    .MenuDivBtn_MiMeta:hover {
        box-shadow: 0px 0px 20px 10px rgba(0, 0, 0, 0.5)
    }

.ImagenProdServ_MiMeta {
    height: 100%;
    width: 100%;
    border-radius: 20px;
    background-color: rgba(61, 61, 61, 0.4);
}

.Txt_ProdServNombre_MiMeta {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px;
    width: 100%;
    height: 80%;
    margin: auto;
    display: flex;*/ /* establece el elemento div como un contenedor flexible */
    /*justify-content: center;*/ /* centra el contenido horizontalmente */
    /*align-items: center;
}

.Txt_ProdServNombrePrecio_MiMeta {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
    width: 100%;
    height: 20%;
    margin: auto;
    display: flex;*/ /* establece el elemento div como un contenedor flexible */
    /*justify-content: center;*/ /* centra el contenido horizontalmente */
    /*align-items: center;
}

.TextoNombreProdServ_MiMeta {*/
    /*font-weight: 600;*/
/*}*/

/* ############################## */
/* ########### Conoceme ######### */
/* ############################## */

.Div_Conoceme1 {
    display: grid;
    grid-template-columns: 0.7fr 0.3fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_ConocemeBotones1 Div_ConocemeImagen1";
}

.Div_ConocemeBotones1 {
    grid-area: Div_ConocemeBotones1;
}

    .Div_ConocemeBotones1 button {
        margin: 10px !important;
    }

.Div_ConocemeImagen1 {
    grid-area: Div_ConocemeImagen1;
}

    .Div_ConocemeImagen1 img {
        filter: drop-shadow(0 0 100px rgba(206,130,83,.5));
        max-width: 90%;
        max-height: 90%;
        object-fit: fill;
        border-radius: 30px;
    }

.Div_Conoceme2 {
    display: grid;
    grid-template-columns: 0.3fr 0.7fr;
    grid-template-rows: 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        "Div_ConocemeImagen2 Div_ConocemeBotones2";
}

.Div_ConocemeBotones2 {
    grid-area: Div_ConocemeBotones2;
}

    .Div_ConocemeBotones2 button {
        margin: 10px !important;
    }

.Div_ConocemeImagen2 {
    grid-area: Div_ConocemeImagen2;
    text-align: center;
    align-content: center;
}

    .Div_ConocemeImagen2 img {
        filter: drop-shadow(0 0 100px rgba(206,130,83,.5));
        max-width: 90%;
        max-height: 90%;
        object-fit: fill;
        border-radius: 30px;
    }


@media (max-width: 992px) {
    .Div_Conoceme1 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 0.3fr 0.7fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "Div_ConocemeImagen1"
            "Div_ConocemeBotones1";
    }

    .Div_ConocemeImagen1 img, .Div_ConocemeImagen2 img {
        max-width: 50%;
    }

    .Div_Conoceme2 {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 0.3fr 0.7fr;
        gap: 0px 0px;
        grid-auto-flow: row;
        grid-template-areas:
            "Div_ConocemeImagen2"
            "Div_ConocemeBotones2";
    }
}

/* ############################## */
/* ########### LOGIN ########## */
/* ############################## */
.DivContenedorLogin {
    background-image: url('img/FondoLoginRegister.png');
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
    background-color: var(--main-ColorSecundarioFondo);
    color: var(--ColorSecundarioTexto) !important;
}

.DivCuadradoCentrado {
    overflow: hidden;
    padding: 20px;
    margin: 7px;
    float: left;
    border: none;
    border-width: 1px;
    border-radius: 2rem !important;
    border-color: transparent;
    background-color: var(--main-ColorPrincipalFondo);
}

.DivLoginRegistrar {
    display: grid;
    grid-template-columns: 0.2fr 1fr 0.2fr;
    grid-template-rows: .2fr 1fr;
    gap: 0px 0px;
    grid-auto-flow: row;
    grid-template-areas:
        ". DivTituloMenuBotones .";
    height: var(--main-height-body);
}

.DivTituloMenuBotones {
    grid-area: DivTituloMenuBotones;
}

.DivMenuBotones_B {
    grid-area: DivMenuBotones_B;
}

.modalLoginImg {
    background-image: url('img/FondoLoginRegister.png');
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
    background-color: var(--main-ColorSecundarioFondo);
}