body {
    background-color: white;
    font-family: "Montserrat", serif !important;
    font-optical-sizing: auto;
    /*font-weight: <weight>;*/
    font-style: normal;
}

.bg-body-tertiary {
    --bs-bg-opacity: 1;
    background-color: #fff !important;
}

span.sombra-verde {
    color: #95bc1f;
    font-weight: bold;
}
span.sombra-rojo {
    color: #fc5458;
    font-weight: bold;
}
.cursor-pointer {
    cursor: pointer !important;
}
.owl-prev .icon-arror-left {
    background: rgba(0, 0, 0, .3);
    bottom: 55px;
    color: #fff;
    font-size: 30px;
    position: absolute;
    left: 0;
    top: 0;
    width: 50px;
}
.icon-arror-left:before {
    content: "\e931";
}
.icon-arror-right:before {
    content: "\e930";
}
.owl-next .icon-arror-right {
    background: rgba(0, 0, 0, .3);
    bottom: 55px;
    color: #fff;
    font-size: 30px;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
}
.owl-carousel .item h4 {
    color: #000 !important;
    font-size: 14px !important;
}
span.sombra-naranja {
    color: #fca917;
    font-weight: bold;
}
span.sombra-lila {
    color: #5c1c8c;
    font-weight: bold;
}
span.importante {
    font-style: italic;
    font-weight: bold;
}
.mundo-bg {
    position: relative;
    /* Puedes definir una altura mínima para que se muestre la imagen completa verticalmente */
    min-height: 800px;
}

    .mundo-bg::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url('/css-src/images/salud-evolutiva/fondo-mundo.png');
        background-size: contain; /* Se asegura que se muestre la imagen completa */
        background-position: center;
        background-repeat: no-repeat;
        opacity: 0.5; /* Ajusta la transparencia */
        z-index: -1;
    }
img.imagen-portada {
    width: 100%;
    max-width: 800px;
    height: auto;
    /* height: 600px; */
    /* max-width: 600px; */
    object-fit: contain;
}
button.navbar-toggler {
    margin-right: 10px;
}
.zoom {
    text-align: center !important;
}
.ico-descargable {
    height: 200px !important;
}
.no-decoration,
.no-decoration {
    text-decoration: none !important;
}
.caja-azul {
    background: #14b4d4;
    border: none;
    border-radius: 30px;
    padding: 20px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease-in-out;
    border-radius: 80px;
}
.text-black {
    color: #000 !important;
    font-size: 14px !important;
}
.c-likes {
    color: #fff;
    position: absolute;
    left: 16px;
    top: 141px;
    font-size: 14px;
    background: #000;
    line-height: 1;
    padding: 4px 6px;
    border-radius: 2px;
}
.c-time {
    background: #000;
    border-radius: 2px;
    top: 141px;
    font-size: 14px;
    color: #fff;
    line-height: 1;
    padding: 4px 6px;
    position: absolute;
    right: 16px;
}

@media (max-width: 1024px) { /* Para pantallas menores a 768px */
    .c-time {
        top: 242px;
        right: 20px;
    }
    .c-likes {
        top: 242px;
        left: 20px;
    }
}

.caja-azul:hover {
    transform: translateY(-5px);
}
.btn-saludevo {
    background: linear-gradient(135deg, #fa7236, #ff506c) !important;
    border-radius: 30px !important;
    border: none !important;

    color: white !important;
}
.tarjeta {
    border: none;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease-in-out;
}
.tarjeta-cuerpo {
    min-height: 500px;
}
.texto-tarjeta {
    color: #fff !important;
}
    .tarjeta:hover {
        transform: translateY(-5px);
    }
.row > div:nth-child(1) .caja-azul {
    background: #14b4d4;
}

.row > div:nth-child(1) .tarjeta {
    background: linear-gradient(135deg, #d0c84d, #52ac75);
}

.row > div:nth-child(2) .tarjeta {
    background: linear-gradient(135deg, #ff0566, #fa7236);
}

.row > div:nth-child(3) .tarjeta {
    background: linear-gradient(135deg,#ff7b02, #ffcb52);
}

.row > div:nth-child(4) .tarjeta {
    background: linear-gradient(135deg, #5c27fe,#c165dd);
}



.fondo-gris {
    background-color: #D3D3D3; /* Color gris */
    height: 500px;
    width: 100%; /* Asegura que cubre todo el ancho */
}
.icono-circular {
    width: 110px; /* Tamaño del círculo */
    height: 110px;
    background: rgba(255, 255, 255, 0.5); /* Blanco con 70% de transparencia */
    border-radius: 50%; /* Hace que el div sea un círculo */
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 15px; /* Centra el círculo y agrega margen inferior */
}
.icono {
    width: 180px;
    height: 180px;
    object-fit: contain; /* Evita que la imagen se distorsione */
}
.transparencia {
    opacity: 0.5; /* Reduce la opacidad al 50% */
}
.navbar-brand img {
    /*width: 100px;*/ /* Tamaño predeterminado */
}

@media (max-width: 768px) { /* Para pantallas menores a 768px */
    .navbar-brand img {
        width: 70px; /* Reducir tamaño en móviles */
        margin-left: 20px;
    }
}

@/*media (max-width: 480px) {*/ /* Para pantallas menores a 480px */
    /*.navbar-brand img {
        width: 50px;*/ /* Aún más pequeño en pantallas muy pequeñas */
    /*}
}*/