@media (min-width: 921px) {
    #oferta-idiomas {
        height: 64.7vw;
        overflow: hidden;
    }

}

.contenedor-marquee {
    display: none;
}

.contenedor-mapa {
    position: relative;
    width: 100%;
    height: auto;
    background-color: #FFFFFF;
}

@media (max-width: 920px) {
    .contenedor-marquee {
        display: flex;
        width: 100%;
        flex-direction: column;
    }

    .contenedor-mapa {
        display: none;
        background-color: #FFFFFF;
    }
}

.mapa-idiomas {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: auto;
    background-color: #ffffff;
}

.aleman {
    width: 19.6vw !important;
    top: 9.2vw;
    left: 38.4vw;
    z-index: 10;
}

.ingles {
    width: 20vw !important;
    top: 8vw;
    left: 16vw;
}

.espanol {
    top: 18.7vw;
    left: 0vw;
    width: 19.8vw !important;
}

.nahuatl {
    width: 18.1vw !important;
    top: 31.4vw;
    left: 2.3vw;
}

.frances {
    width: 21.7vw !important;
    top: 17.5vw;
    left: 25.5vw;
    z-index: 4;
}

.portugues {
    width: 20.3vw !important;
    top: 25.7vw;
    left: 32.5vw;
}

.italiano {
    width: 24.1vw !important;
    top: 21.5vw;
    left: 46.6vw;
}

.chino {
    top: 13.3vw;
    left: 70.3vw;
    width: 25.4vw !important;
}

.mapa-element {
    position: absolute;
}

.mapa-text {
    color: white;
    position: absolute;
    font-family: 'Montserrat';
    font-weight: 800;
    font-size: 1.35vw;
    transition: 0.3s;
}

.mapa-text:hover {
    color: #FFFFFF;
}

.aleman-text {
    top: 18.4vw;
    left: 41.4vw;
    z-index: 11;
}

.ingles-text {
    top: 15.8vw;
    left: 28.8vw;
}

.espanol-text {
    top: 29.7vw;
    left: 8.3vw;
    font-size: 1.05vw;
    line-height: 0.9vw;
}

.nahuatl-text {
    top: 46.1vw;
    left: 4.4vw;
}

.frances-text {
    top: 28.6vw;
    left: 26.6vw;
    z-index: 5;
}

.portugues-text {
    top: 48.5vw;
    left: 41.8vw;
}

.italiano-text {
    top: 33.6vw;
    left: 63vw;
}

.chino-text {
    top: 23.9vw;
    left: 86.7vw;
    line-height: 1.07vw;
}

.menu-idiomas-img {
    width: 100%;
    height: 12.5vw;
    background-repeat: round;
    margin: 3px 0px;
    text-transform: uppercase;
    color: #ffffff !important;
    font-size: 7vw;
    font-family: 'Montserrat';
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    text-align: center;
}

.bg-ingles {
    background-image: url("../images/menu-idiomas-ingles-sm.jpg");
}

.bg-frances {
    background-image: url("../images/menu-idiomas-frances-sm.jpg");
}

.bg-aleman {
    background-image: url("../images/menu-idiomas-aleman-sm.jpg");
}

.bg-portugues {
    background-image: url("../images/menu-idiomas-portugues-sm.jpg");
}

.bg-italiano {
    background-image: url("../images/menu-idiomas-italiano-sm.jpg");
}

.bg-chino {
    background-image: url("../images/menu-idiomas-chino-sm.jpg");
}

.bg-espanol {
    background-image: url("../images/menu-idiomas-espanol-sm.jpg");
    font-size: 5vw !important;
}

.bg-nahuatl {
    background-image: url("../images/menu-idiomas-nahuatl-sm.jpg");
}

#modalidad {
    margin-bottom: 10vh;
}

.nivel {
    min-width: 350px;
}

.cont p {
    left: 50%;
    transform: translate(-50%);
}

.cont2 p {
    font-size: 20px;
}

@media (max-width: 920px) {
    .caja2 {
        padding-left: 24%;
        height: 20vw;
    }

    .cont p {
        font-size: 3.7vw;
        line-height: 3.4vw;
        left: 10px;
        top: 50%;
        transform: translatey(-50%);
    }

    .cont img {
        height: 32.4vw;
        width: 30vw;
    }

    .nivel {
        height: 32.4vw;
        box-shadow: 7px 3px 4px 1px rgb(0 0 0 / 67%);
        padding-top: 0px;
    }

    .cont2 p {
        font-size: 4vw;
        line-height: 4.5vw;
        text-align: justify;
    }
}

.temario {
    width: 100%;
    height: auto;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    box-shadow: 3px 3px 3px darkgrey;
    border: 1px solid darkgrey;
    border-top: unset;
}

.titulo-temario {
    width: 100%;
    min-height: max-content;
    background-position-y: 30%;
    background-repeat: no-repeat;
    background-size: cover;
}

.contenido-temario {
    display: flex;
    align-items: flex-start;
    padding: 2rem;
}

.adistancia {
    background-image: url("../images/modalidad-distancia.jpg");
}

.presencial {
    background-image: url("../images/modalidad-presencial.jpg");
}

#marcador-ingles *, 
#marcador-nahuatl *, 
#marcador-aleman *,  
#marcador-espanol *,
#marcador-frances *, 
#marcador-portugues *, 
#marcador-italiano *,  
#marcador-chino *
{
    transition: 0.5s;
}

#elemento-ingles:hover>#icono-ingles,
#elemento-nahuatl:hover>#icono-nahuatl,
#elemento-aleman:hover>#icono-aleman,
#elemento-espanol:hover>#icono-espanol,
#elemento-frances:hover>#icono-frances,
#elemento-portugues:hover>#icono-portugues,
#elemento-italiano:hover>#icono-italiano,
#elemento-chino:hover>#icono-chino,
.color-icon
{
    filter: grayscale(0%) !important;
}

#icono-ingles,
#icono-nahuatl,
#icono-aleman,
#icono-espanol,
#icono-frances,
#icono-portugues,
#icono-italiano,
#icono-chino
{
    filter: grayscale(100%);
}

#elemento-ingles:hover #forma-ingles,
#elemento-nahuatl:hover #forma-nahuatl,
#elemento-aleman:hover #forma-aleman,
#elemento-espanol:hover #forma-espanol,
#elemento-frances:hover #forma-frances,
#elemento-portugues:hover #forma-portugues,
#elemento-italiano:hover #forma-italiano,
#elemento-chino:hover #forma-chino,
.marcador-hover{
    filter: drop-shadow(0px 0px 20px rgb(255, 123, 0));
    animation: ease-in-out 0.8s forwards infinite fill-below;
}

@keyframes fill-below {
    0% {
        fill: #ff4500;
    }

    50% {
        fill: rgba(255, 123, 0, 0.836);
    }

    100% {
        fill: #ff4500;
    }
}

.panel{
    max-height: 0; 
    overflow: hidden; 
    transition: 0.5s ease-out;
}

.chevron{
    rotate: 180deg;
    transition: 0.5s;
}