.col-acciones {
    width: 100px; /* Ajusta el ancho según tus necesidades */
}
.full-width {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0; /* Opcional */
}
.btn-custom {
    width: 110px; /* Establece el ancho que desees */
    text-align: center;
    display: inline-block;
    margin-bottom: 5px; /* Espacio entre botones */
}
.btn-custom2 {
    width: 30px; /* Establece el ancho que desees */
    text-align: center;
    display: inline-block;
    margin-bottom: 5px; /* Espacio entre botones */
}
.btn-custom3 {
    width: 200px; /* Establece el ancho que desees */
    text-align: center;
    display: inline-block;
    margin-bottom: 5px; /* Espacio entre botones */
}
.image-full-height {
    height: 98vh; /* Ocupa el 100% de la altura de la ventana */
    width: auto; /* Mantiene la proporción de la imagen */
    object-fit: cover; /* Ajusta la imagen sin distorsionarla */
}

.boton-image-full-height {
    height: 20vh; /* Ocupa el 100% de la altura de la ventana */
    width: auto; /* Mantiene la proporción de la imagen */
    object-fit: cover; /* Ajusta la imagen sin distorsionarla */
}

.menu-lateral {
    background-color: rgba(255, 255, 255, 0.5); /* Fondo blanco con 50% de opacidad */
    border-radius: 0.5rem;
    padding: 1rem;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.menu-lateral h2 {
    font-size: 1.25rem;
    margin-bottom: 1rem;
    color: white; /* Título blanco */
}

.menu-lateral ul {
    list-style:none;
    padding: 0;
}

.menu-lateral ul li a {
    color: #007BFF; /* Color de los enlaces */
    text-decoration: none;
    font-size: 2rem;
}

.menu-lateral ul li a:hover {
    text-decoration: underline;
}

/* Estilos para el menú en pantallas pequeñas */
#mobile-menu {
    display: none;
    background-color: rgba(255, 255, 255, 0.8); /* Fondo transparente con opacidad */
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    padding: 1rem;
}

/* Mostrar el menú cuando esté activo */
#mobile-menu.active {
    display: block;
}

.responsive-image {
    width: 100%; /* Asegura que la imagen ocupe todo el ancho del contenedor */
    height: auto; /* Mantiene la proporción de la imagen */
    max-height: 100vh; /* Limita la altura máxima al 100% de la altura de la pantalla */
    object-fit: contain; /* Ajusta la imagen para que sea completamente visible */
}

@media (max-width: 768px) {
    .responsive-image {
        max-width: 90%; /* Reduce el ancho en pantallas pequeñas */
        margin: 0 auto; /* Centra la imagen */
    }
}