.slide-right {
    width: 40vw;
    overflow: hidden;
    /*margin-left: 300px;*/
    max-width: 500px
}

    .slide-right h2 {
        animation: 1s slide-right 0s forwards;
        transform: translateX(-100%);
    }

.slide-left {
    width: 40vw;
    overflow: hidden;
    /* margin-right: 300px;*/
    max-width: 500px
}

    .slide-left h2 {
        animation: 1s slide-right 0s forwards;
        transform: translateX(100%);
    }

    .slide-left img {
        animation: 1s slide-right 0s forwards;
        transform: translateX(100%);
    }

@keyframes slide-right {
    to {
        transform: translateX(0);
    }
}

@keyframes slide-right2 {
    to {
        transform: translateX(1000);
    }
}

.educacion-enlace {
    text-decoration: none;
    font-size: 1.1vw;
    color: #606060;
    font-family: Gotham-Medium;
}


.wrapper {
    display: inline-flex;
    justify-content: center;
    width: 100%;
}

.educacion-texto-izq-top {
    padding-top: 2vw;
    font-size: 1vw;
    padding-left: 1.5vw;
}

.educacion-texto-izq {
    padding-bottom: 1vw;
    font-size: 1vw;
    padding-left: 1.5vw;
}

.educacion-texto-der-top {
    padding-top: 2vw;
    font-size: 1vw;
    right: 0;
    padding-right: 1.5vw;
}

.educacion-texto-der {
    padding-bottom: 1vw;
    font-size: 1vw;
    padding-right: 1.5vw;
}


.box {
    width: 22vw;
    padding-top: 25%;
    position: relative;
}

    .box .inner {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: end;
        align-items: center;
        padding: 0px;
    }

#contenedor-mobile {
    display: none
}

.item-educacion-desktop {
    align-items: center;
    background-color: #F1F1F1;
    color: white;
    display: flex;
    width: 20.5vw;
    height: 20.5vw;
    justify-content: center;
    border-radius: 1vw;
    transition: background-color 1s ease-out 100ms
}

    .item-educacion-desktop:hover {
        background-color: #FF6600;
    }

        .item-educacion-desktop:hover a {
            color: #FFFFFF !important
        }




#contenedor-desktop {
    display: block
}

.educacion-espacio {
    margin-top: 1vw;
}

.item-educacion {
    align-items: center;
    background-color: #F1F1F1;
    color: white;
    display: flex;
    height: 12.188rem;
    justify-content: center;
    border-radius: 5vw;
}

.educacion-contenedor-mobile {
    display: none;
}

.educacion-decorado {
    width: 12.5vw !important;
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
}

.educacion-texto-mobile {
    z-index: 1;
    position: absolute;
    bottom: 0.5rem;
    font-size: 0.9rem;
    font-family: Gotham-Book;
    right: 0.5rem;
    left: 2rem;
    text-align: right
}



@media all and (min-width: 360px) and (max-width: 767px) {
    #contenedor-desktop {
        display: none !important
    }

    .item-educacion {
        align-items: center;
        background-color: #F1F1F1;
        color: white;
        display: flex;
        width: 20.5vw;
        height: 20.5vw;
        justify-content: center;
        border-radius: 6vw;
        transition: background-color 1s ease-out 100ms
    }

    .educacion-contenedor-mobile {
        visibility: unset;
        display: block;
    }

    .educacion-decorado-mobile {
        width: 30vw !important;
        z-index: 1;
        position: absolute;
        top: 0;
        left: 0;
        border-radius: unset !important;
    }

    .educacion-texto-mobile {
        font-family: Gotham-Medium;
        bottom: 1.5vw;
        font-size: 2.7vw;
        right: 3vw;
    }

    .educacion-texto-der {
        padding-bottom: 1vw !important;
        padding-right: 3vw;
        padding-left: 0vw
    }

    .item-educacion-mobile {
        align-items: center;
        background-color: transparent;
        color: white;
        display: flex;
        width: 54.2vw !important;
        height: 54.2vw !important;
        justify-content: center;
        border-radius: 6vw;
        transition: background-color 1s ease-out 100ms
    }

    .box .inner {
        position: absolute;
        left: 0;
        top: 0;
        width: 54.2vw !important;
        height: 54.2vw !important;
        display: flex;
        justify-content: end;
        align-items: center;
        padding: 0px;
    }

    .educacion-enlace {
        font-size: 3vw;
        color: white;
        font-family: Gotham-Medium;
    }
    .slide-right {
        width: 60vw;
        overflow: hidden;
        /*margin-left: 300px;*/
        max-width: 500px
    }
}
