@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Londrina+Solid:wght@100;300;400;900&display=swap');


*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif;
    scroll-behavior: smooth;
}

/* Menu nav */
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 50px;
    height: 100px;
}

/* Estilo del logo */
.logo-img {
    max-width: 100%;
    height: 85px;
}

/* Estilo del menú hamburguesa */
.menu-toggle {
    display: none; /* Ocultarlo en pantallas grandes */
    flex-direction: column;
    cursor: pointer;
}

.menu-toggle .bar {
    width: 25px;
    height: 3px;
    background-color: #B58D76;
    margin: 4px 0;
    transition: 0.3s;
}

/* Opciones del menú de navegación */
.nav-links {
    display: flex;
    gap: 35px;
}

.nav-links li {
    list-style: none;
}

.menu-link {
    text-decoration: none;
    color: #B58D76;
    font-size: 20px;
    transition: color 0.3s ease;
}

.menu-link:hover {
    color: #EC9989;
}

.contacto-btn {
    background: #EC9989;
    padding: 6px 20px; 
    border-radius: 15px;
    color: white;
    font-weight: 600;
    text-decoration: none;
}
.contacto-btn:hover {
    background: #dfae91;
}

/* Estilo responsive */
@media (max-width: 768px) {
    .menu-toggle {
        display: flex; /* Mostrar el menú hamburguesa en pantallas pequeñas */
    }

    .nav-links {
        display: none; /* Ocultar el menú en pantallas pequeñas inicialmente */
        position: absolute;
        top: 100px;
        left: 0;
        width: 100%;
        background-color: #f8f8f8;
        flex-direction: column;
        align-items: center;
        z-index: 1;
    }

    .nav-links.active {
        display: flex; /* Mostrar el menú al activar el menú hamburguesa */
    }

    .nav-links li {
        margin: 15px 0;
    }
}



/*Banner*/

.banner {
    position: relative;
    background-image: url("img/Banner.png");
    background-size: cover; 
    background-position: center; 
    background-repeat: no-repeat;
    padding: 40px;
    width: 100%; 
    height: 400px; 
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.background-shapes::before,
.background-shapes::after {
    content: '';
    position: absolute;
    width: 250px;
    height: 250px;
    background-color: #a0d1a7;
    border-radius: 50%;
    top: 10%;
    left: -10%;
    z-index: -1;
}

.background-shapes::after {
    background-color: #f7cac9;
    top: auto;
    bottom: 10%;
    left: auto;
    right: -10%;
}

.content {
    display: flex;
    align-items: center;
    position: relative; 
    gap: 30px;
    flex-wrap: wrap; /* Permite que el contenido se ajuste en líneas cuando no hay espacio */
    justify-content: center;
    text-align: center; /* Centra el texto en pantallas pequeñas */
}

.circle-image {
    width: 260px;
    height: 260px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 20px;
    border: 5px solid #ffffff;
}

.text-container h1 {
    font-family: "Londrina Solid", sans-serif;
    font-size: 42px;
    margin: 0;
    display: flex;
    flex-direction: column;
}

/* Colores de letras */
.text-orange {
    color: #FFCA8C; 
}
.text-colorful {
    color: #ADCBB3; 
}

.letter1 { color: #ADCBB3; }
.letter2 { color: #FFDAD9; }
.letter3 { color: #B2DFDC; }
.letter4 { color: #EC9989; }
.letter5 { color: #FFCA8C; }
.letter6 { color: #ADCBB3; }
.letter7 { color: #FFDAD9; }
.letter8 { color: #B2DFDC; }
.letter9 { color: #EC9989; }

/* Media queries para pantallas pequeñas */
@media (max-width: 768px) {
    .banner {
        height: auto; /* Ajusta la altura automáticamente en pantallas pequeñas */
        padding: 20px;
    }

    .circle-image {
        width: 200px;
        height: 200px;
        margin-bottom: 20px; /* Añadir espacio entre la imagen y el texto */
        margin-right: 0; /* Elimina el margen derecho en pantallas pequeñas */
    }

    .text-container h1 {
        font-size: 32px; /* Reducir el tamaño de fuente en pantallas más pequeñas */
    }

    .background-shapes::before,
    .background-shapes::after {
        width: 150px;
        height: 150px;
    }
}

@media (max-width: 480px) {
    .circle-image {
        width: 150px;
        height: 150px;
    }

    .text-container h1 {
        font-size: 28px; /* Ajustar aún más el tamaño del texto */
    }

    .background-shapes::before,
    .background-shapes::after {
        display: none; /* Esconde las formas en pantallas muy pequeñas */
    }
}



/* Seccion sobre nosotros */

.sobre-nosotros {
    text-align: center;
    padding: 40px 20px; /* Reducción del margen para que sea más adaptativo */
    max-width: 100%;
    margin: 0 auto; /* Centrar la sección en la página */
}

.sobre-nosotros p {
    margin: auto;
    width: 70%; /* Cambiado a 70% para una mejor adaptación en pantallas más pequeñas */
    color: #B58D76;
    font-size: 20px;
}

.sobre-nosotros h2 {
    color: #B58D76;
    font-size: 28px; /* Ajuste de tamaño para mejorar la visibilidad */
}

.descargar-catalogo {
    color: #f8f8f8;
    background-color: #B58D76;
    height: 50px;
    width: 20%; /* Ajustado a 60% para que se vea mejor en móviles */
    max-width: 31
    0px; /* Establecer un ancho máximo para pantallas grandes */
    border-radius: 10px;
    border: none;
    font-weight: 600;
    font-size: 18px;
    text-decoration: none;
    transition: background-color 0.3s ease;
    margin: 15px auto; /* Centrar el botón horizontalmente */
    display: block; /* Hacer que el botón sea un bloque para que se centre */
}

.descargar-catalogo:hover {
    background-color: #dfae91;
}

.sobre-nosotros h2, .sobre-nosotros p {
    margin-bottom: 20px;
}

/* Responsividad para dispositivos móviles */
@media(max-width: 1575px){
    .descargar-catalogo{
        width: 80%; /* Botón más amplio en pantallas pequeñas */
        max-width: 90%; /* Establecer un ancho máximo en móviles */
        font-size: 1.1em; /* Reducir el tamaño del texto para pantallas pequeñas */ 
    }
}
@media (max-width: 768px) {
    .sobre-nosotros p {
        width: 90%; /* Ampliar el ancho para pantallas pequeñas */
        font-size: 18px; /* Reducir ligeramente el tamaño del texto */
    }

    .descargar-catalogo {
        width: 80%; /* Botón más amplio en pantallas pequeñas */
        max-width: 90%; /* Establecer un ancho máximo en móviles */
        font-size: 16px; /* Reducir el tamaño del texto para pantallas pequeñas */
    }

    .sobre-nosotros h2 {
        font-size: 24px; /* Ajustar el tamaño del título para pantallas pequeñas */
    }
}


/* Seccion horario y ubicacion */

.horario-ubicacion {
    max-width: 100%;
    background-color: #B2DFDC;
    display: flex;
    justify-content: center;
    padding: 20px;
    height: 450px;
}

.contenedor-horario-ubi {
    background-color: #f8f8f8;
    width: 80%;
    margin: auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; /* Permitir que los elementos se envuelvan en pantallas pequeñas */
    align-items: center;
    padding: 20px;
    height: 350px; /* Aumenta la altura del contenedor hijo */
}

.horario, .ubicacion {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 50%;
    height: 100%; /* Asegura que las secciones ocupen toda la altura del contenedor hijo */
}

.mapa-ubi {
    max-width: 100%;
    height: auto;
    margin-top: 20px;
}

.redes-horario {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.item {
    font-size: 25px;
    margin: 0 10px;
}

.item a {
    text-decoration: none;
    color: #B58D76;
}

.item a:hover {
    color: #915634;
    transition: ease 0.3s;
}

.horario h2, .horario p, .item {
    color: #B58D76;
    margin: 5px;
}

.horario h2 {
    font-size: 30px;
}

.horario p {
    font-size: 19px;
    text-align: center;
}

/* Responsividad para pantallas pequeñas */
@media (max-width: 768px) {
    .contenedor-horario-ubi {
        flex-direction: column; /* Cambiar de filas a columnas */
        width: 100%; /* Asegurar que ocupe todo el ancho de la pantalla */
        height: auto; /* Permitir que la altura sea automática en pantallas pequeñas */
    }

    .horario, .ubicacion {
        width: 100%; /* Hacer que cada sección ocupe el 100% del ancho en pantallas pequeñas */
        height: auto; /* Permitir que la altura sea automática en pantallas pequeñas */
    }

    .horario h2 {
        font-size: 24px; /* Reducir el tamaño del título en pantallas pequeñas */
    }

    .horario p {
        font-size: 16px; /* Reducir el tamaño del texto en pantallas pequeñas */
    }

    .item {
        font-size: 20px; /* Ajustar el tamaño de los iconos de redes sociales */
    }

    .mapa-ubi {
        width: 90%; /* Ajustar el mapa para pantallas pequeñas */
        height: auto;
    }
}

/* Responsividad para pantallas muy pequeñas */
@media (max-width: 480px) {
    .horario h2 {
        font-size: 20px; /* Reducir aún más el tamaño del título en pantallas muy pequeñas */
    }

    .horario p {
        font-size: 14px; /* Reducir el tamaño del texto para pantallas muy pequeñas */
    }

    .item {
        font-size: 18px; /* Reducir el tamaño de los iconos en pantallas muy pequeñas */
    }
}



/* Seccion de sets */

/* Estilo general para la sección */
.section-sets {
    background-color: #fafafa;
    padding-bottom: 50px;
}

/* Ajustes del banner */
.banner-sets {
    background-color: #FFCA8C;
    padding: 20px;
    width: 100%;
}

.banner-sets h2 {
    font-weight: 400;
    font-family: "Londrina Solid", system-ui;
    font-size: 30px; /* Reducido un poco para dispositivos pequeños */
    text-align: center;
    color: #ffff;
}

/* Contenedor de las tarjetas */
.sets-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 75px; /* Reducido el espacio para que no haya mucho hueco en pantallas pequeñas */
    margin-top: 30px;
}

/* Estilo para las tarjetas */
.card {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: hidden;
    margin-bottom: 40px;
    width: 100%;
    max-width: 300px; /* Ajustado para dispositivos más pequeños */
}

/* Ajustes de imagenes dentro de las tarjetas */
.card-img1, .card-img2, .card-img3 {
    width: 100%; /* Ajusta el tamaño al ancho disponible */
    height: auto; /* Mantén la proporción de la imagen */
    max-width: 270px; /* Máximo tamaño en pantallas más grandes */
    height: 160px; /* Fijo para mantener consistencia en todas las tarjetas */
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 8px;
    margin-bottom: 15px;
}

/* Ajustes de títulos de las tarjetas */
.card h2 {
    font-weight: 700;
    font-size: 22px; /* Ajustado para tamaños más pequeños */
    text-align: center;
    color: #B58D76;
    padding: 8px;
}

/* Ajustes del texto */
.card p {
    font-weight: 500;
    font-size: 1.10em; /* Ajustado para pantallas más pequeñas */
    text-align: justify;
    color: #B58D76;
    padding: 0 10px;
}

/* Estilo del botón */
.btn-sets {
    padding: 10px 15px;
    width: 180px;
    background-color: #EC9989;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: 600;
    text-align: center;
    transition: background-color 0.3s ease;
}
.btn-sets:hover{
    background-color: #B58D76;
}

/* Media Queries para hacer el diseño responsive */

/* Ajustes para pantallas pequeñas (tablets y móviles) */
@media (max-width: 768px) {
    .banner-sets h2 {
        font-size: 28px;
    }

    .sets-cards {
        gap: 20px; /* Reduce la separación entre las tarjetas */
    }

    .card {
        width: 100%;
        max-width: 280px;
    }

    .card h2 {
        font-size: 20px;
    }

    .card p {
        font-size: 1.10em;
    }
}

/* Ajustes para pantallas muy pequeñas (móviles) */
@media (max-width: 480px) {
    .banner-sets h2 {
        font-size: 24px;
    }

    .card {
        max-width: 100%;
    }

    .card h2 {
        font-size: 18px;
    }

    .card p {
        font-size: 1em;
    }

    .btn-sets {
        width: 160px;
        padding: 8px;
    }
}


/* Seccion de informacion de sets */

.container {
    display: flex;
    justify-content: center; /* Centra horizontalmente las cajas */
    align-items: stretch; /* Estira las cajas para que tengan la misma altura */
    height: auto; /* Cambiado a auto para permitir que la altura se ajuste automáticamente */
    background-color: #FFCA8C; /* Color de fondo de ejemplo */
    gap: 50px;
    padding: 20px; /* Agregar un poco de padding */
}

.box, .box2 {
    background-color: #ffffff;
    padding: 20px;
    width: 40%; /* Aumenta el ancho de las cajas */
    color: #B58D76;
    height: auto; /* Cambiado a auto para permitir que la altura se ajuste automáticamente */
    text-align: justify; /* Asegura que el texto esté justificado */
}

.box p {
    margin-bottom: 20px; /* Agrega un margen inferior para el espacio entre párrafos */
}
.box p, .box2 p {
    font-size: 1.2em;
}
.card-costo {
    display: flex;
    margin: 18px;
    gap: 30px;
}

.container h2 {
    text-align: center;
}

.card-line {
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 2px solid #c9a77d; /* Línea separadora */
}

/* Media Queries para pantallas pequeñas */
@media (max-width: 768px) {
    .container {
        flex-direction: column; /* Cambia a columna en pantallas pequeñas */
        align-items: center; /* Centra las cajas horizontalmente */
    }

    .box, .box2 {
        width: 85%; /* Aumenta el ancho en pantallas pequeñas */
        height: auto; /* Permite que la altura se ajuste automáticamente */
        margin-bottom: 20px; /* Espacio entre las cajas */
    }
}


/*Sección zonas de juegos*/

/* Estilo del banner */
.banner-zonas {
    background-color: #FFDAD9;
    padding: 20px;
    width: 100%;
    font-weight: 600                                   ;
}

.banner-zonas h2 {
    font-family: "Londrina Solid", system-ui;
    font-weight: 400;
    font-size: 30px; /* Ajustado para dispositivos pequeños */
    text-align: center;
    color: #ffff;
}

/* Estilo de la sección general */
.section-zonas {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-bottom: 50px;
}

/* Contenedor de las tarjetas */
.cards-zonas {
    display: flex;
    flex-wrap: wrap;
    gap: 30px; /* Espacio entre tarjetas */
    justify-content: center;
    align-items: center;
    margin-top: 50px;
}

/* Estilo para cada tarjeta */
.card1, .card2, .card3, .card4 {
    position: relative;
    height: 250px;
    width: 100%;
    max-width: 300px; /* Limita el tamaño máximo */
    border-radius: 15px;
    overflow: hidden;
}

.card1 img, .card2 img, .card3 img, .card4 img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s ease;
    z-index: 1;
}

.card1 img.hover, .card2 img.hover, .card3 img.hover, .card4 img.hover {
    opacity: 0;
    z-index: 2;
}

/* Efecto hover para las tarjetas */
.card1:hover img.hover, .card2:hover img.hover, .card3:hover img.hover, .card4:hover img.hover {
    opacity: 1;
}

.card1:hover img.normal, .card2:hover img.normal, .card3:hover img.normal, .card4:hover img.normal {
    opacity: 0;
}

/* Estilo de los botones */
.btn-zonas {
    padding: 10px 15px;
    width: 100%;
    max-width: 300px; /* Ajuste para que no sea más grande en móviles */
    background-color: #EC9989;
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-weight: 600;
    text-align: center;
    margin: 30px auto 0 auto; /* Centra el botón y reduce el margen superior */
    transition: background-color 0.3s ease;
    display: grid;
    grid-row: auto;
}

.btn-zonas:hover {
    background-color: #B58D76;
}

/* Media queries para dispositivos pequeños (tablets y móviles) */
@media (max-width: 768px) {
    .banner-zonas h2 {
        font-size: 28px; /* Ajuste de tamaño de fuente */
    }

    .cards-zonas {
        gap: 20px; /* Reduce el espacio entre las tarjetas */
    }

    .card1, .card2, .card3, .card4 {
        max-width: 280px; /* Ajusta el tamaño máximo de las tarjetas */
    }

    .btn-zonas {
        max-width: 280px;
        padding: 8px;
    }
}

@media (max-width: 480px) {
    .banner-zonas h2 {
        font-size: 24px; /* Ajuste de tamaño de fuente para móviles */
    }

    .card1, .card2, .card3, .card4 {
        max-width: 100%; /* Ocupa todo el ancho disponible */
    }

    .btn-zonas {
        width: 100%; /* Botón ocupa todo el ancho en pantallas muy pequeñas */
        padding: 10px;
    }
}



/*Sección zonas*/

.section-eventos {
    height: 630px; /* Aumento en la altura de la sección */
}

.banner-eventos {
    background-color: #ADCBB3;
    height: 80px;
    max-height: max-content;
    width: 100%;
}

.banner-eventos h2 {
    font-family: "Londrina Solid", system-ui;
    font-weight: 400;
    font-style: normal;
    font-size: 35px;
    text-align: center;
    color: #ffff;
    padding: 20px;
}

.eventos-info {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin-top: 60px;
}

.eventos-info p {
    color: #B58D76;
    font-size: 1.3em;
    width: 800px; /* Mantener el ancho para pantallas grandes */
}

.eventos {
    color: #B58D76;
    font-size: 20px;
    font-weight: 800;
}

.eventos-img img {
    width: 400px;
    height: auto;
    border-radius: 200px;
}

/* Media Queries para responsividad */
@media (max-width: 1240px){
    .eventos-img{
        display: none;
    }
    .secccion-eventos{
        height: 30vh;
    }
}
@media (max-width: 768px) {
    .eventos-info {
        flex-direction: column; /* Cambia la dirección a columna en pantallas pequeñas */
        align-items: center; /* Alinea los elementos al centro */
        justify-content: center; /* Centra verticalmente en columna */
        text-align: center; /* Alinea el texto al centro */
    }

    .eventos-info p {
        width: 100%; /* Ancho del texto en pantallas pequeñas */
        text-align: center; /* Centra el texto */
        margin: 0; /* Elimina márgenes para mejorar el centrado */
    }

    .eventos-img {
        display: flex; /* Asegura que el contenedor de la imagen sea un flexbox */
        justify-content: center; /* Centra la imagen en su contenedor */
        margin-top: 20px; /* Añade espacio entre el texto y la imagen */
    }

    .eventos-img img {
        width: 80%; /* Aumenta el tamaño de la imagen en pantallas pequeñas */
        border-radius: 100px; /* Ajuste del radio del borde */
    }

    .section-eventos {
        height: auto; /* Ajusta la altura para pantallas pequeñas */
    }
}




/* Sección de paquetes */
.seccion-paquetes {
    background-color: #F5F8F6;
    width: 100%;
    padding: 50px 20px; /* Añadido padding para dar espacio en pantallas pequeñas */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Contenedor de los paquetes */
.sets-paquetes {
    display: flex;
    flex-wrap: wrap; /* Para que se ajusten en filas en pantallas pequeñas */
    gap: 30px; /* Reducido el gap para pantallas pequeñas */
    justify-content: center;
}

/* Tarjetas de paquetes */
.paquetes {
    height: auto;
    width: 100%;
    max-width: 300px; /* Tamaño máximo de las tarjetas */
    background-color: #f8f8f8;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    color: #ADCBB3;
}

.paquetes-centro {
    background-color: #ADCBB3;
    color: #f8f8f8;
}

.paquetes h2 {
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 3px solid #ADCBB3; /* Línea separadora */
}

.paquetes-centro h2 {
    border-bottom: 3px solid #f8f8f8;
}

.paquetes h3 {
    font-size: 30px;
    font-weight: 500;
}

.paquetes p {
    text-align: center;
    margin: 15px;
    font-size: 1.2em;
    font-weight: 500;
}

.btn-paquetes {
    background-color: #ADCBB3;
    width: 75%;
    border-style: none;
    height: 35px;
    border-radius: 10px;
    color: #f8f8f8;
    font-weight: 600;
    transition: background-color 0.3s ease;
}

.btn-paquetes:hover {
    background-color: #7a9780;
}

.btn-paquetes-centro {
    background-color: #f8f8f8;
    color: #ADCBB3;
}

.btn-paquetes-centro:hover {
    color: #f8f8f8;
}

/* Media Queries para hacer el diseño responsive */

/* Ajustes para pantallas pequeñas (tablets y móviles) */
@media (max-width: 768px) {
    .paquetes h3 {
        font-size: 25px;
    }

    .paquetes p {
        font-size: 14px;
    }

    .sets-paquetes {
        gap: 20px; /* Reduce el espacio entre las tarjetas */
    }
}

/* Ajustes para pantallas muy pequeñas (móviles) */
@media (max-width: 480px) {
    .paquetes h3 {
        font-size: 20px;
    }

    .paquetes p {
        font-size: 12px;
    }

    .btn-paquetes {
        width: 100%; /* Botones ocupan todo el ancho */
    }
}

/* Footer */
footer {
    height: auto; /* Cambiar altura a auto para ajustarse al contenido */
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px; /* Agregar padding para mejor apariencia */
}

.footer-container {
    display: flex;
    flex-direction: column; /* Cambiar a columna en pantallas pequeñas */
    align-items: center; /* Centrar elementos */
    gap: 20px; /* Ajustar el espacio entre elementos */
}

.footer-container p {
    color: #B58D76;
    font-size: 20px;
    text-align: center; /* Centrar texto */
}

.footer-container .redes-horario {
    display: flex;
    justify-content: center;
    gap: 15px; /* Ajustar espacio entre iconos */
}

/* Ajustes para las redes en pantallas pequeñas */
.footer-container .redes-horario .item {
    font-size: 28px; /* Reducir tamaño de icono */
    width: 35px; /* Ajustar ancho de icono */
    background-color: #ffffff;
    color: #B58D76;
}

/* Media query para pantallas entre 768px y 1040px */
@media (min-width: 768px) and (max-width: 1040px) {
    .footer-container {
        flex-direction: column; /* Mantener en columna */
        align-items: center; /* Centrar elementos */
    }
    .footer-container .redes-horario {
        flex-wrap: wrap; /* Permitir que los iconos se ajusten si hay poco espacio */
        justify-content: center; /* Centrar los iconos */
        gap: 10px; /* Espacio entre iconos */
    }
    
    .footer-container .redes-horario .item {
        font-size: 28px; /* Tamaño de icono adecuado para pantallas pequeñas */
        width: 35px; /* Ancho de icono */
    }
}

/* Media query para pantallas más grandes */
@media (min-width: 1041px) {
    .footer-container {
        flex-direction: row; /* Cambiar a fila en pantallas más grandes */
        gap: 270px; /* Espacio grande entre elementos */
    }

    .footer-container .redes-horario .item {
        font-size: 33px; /* Tamaño original del icono */
        width: 40px; /* Ancho original del icono */
    }
}

.whatsapp-button {
    position: fixed;
    bottom: 15px;
    right: 15px;
    background-color: #4cc370;
    color: #fff;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    text-align: center;
    font-size: 24px;
    line-height: 60px;
    box-shadow: 2px 2px 3px #999;
    text-decoration: none;
}

.whatsapp-button:hover {
    background-color: #3d9e5a;
}