@media (max-width:1100px) {
    .contenedor__historia {
        width: 90%;
    }

    .carta {
        margin: 10px;
    }

    .slogan__valores {
        width: 100%;
        margin-bottom: 20px;
    }

    .contenedor__carta__valores {
        flex-wrap: wrap;
        justify-content: center;
    }

    .btn__slogan__historia {
        padding: 6px 0;
    }
}

@media (max-width:960px) {
    .right__historia {
        padding: 0;
    }

    .carta__valores {
        width: 330px;
        margin: 15px;
    }
}
@media (max-width:900px){
    .texto__historia h1{
        font-size: 2.625rem;
    } 
    .carta__valores {
        width: 300px;
        padding: 10px;
    }
}
@media (max-width:870px){
    .left__historia img{
        width: 300px;
    }
}
@media (max-width:840px){
    .carta__valores {
        width: 280px;
    }
}
@media (max-width:740px){
    .texto__historia h1{
        font-size: 2.125rem;
    }
    .texto__historia p,.slogan__mision p,.slogan__valores p{
        font-size: 1.063rem;
    }
    .cuerpo__carta p{
            font-size: 0.938rem;
        }
        .carta__valores{
            width: 350px;
        }
}
@media (max-width:670px){
    .contenedor__historia{
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
        .btn__slogan__historia{
            width: 100%;
        }
        .left__historia img{
            width: 400px;
        }
        .contenedor__slide__mision{
            flex-direction: column;
        }
        .imagen__carta{
            width: 90%;
            margin: 0 auto;
        }
        .carta{
            display: flex;
            flex-direction: column;
            align-content: center;
            justify-content: center;
            flex-wrap: wrap;
        } 
}
@media (max-width:500px){
    .left__historia img{
        width: 350px;
    }
    .texto__historia p,.slogan__mision p,.slogan__valores p{
        font-size: 1rem;
    }
}
@media (max-width:450px){
    .left__historia img{
        width: 300px;
    }
}
@media (max-width:360px){
    .left__historia img{
        width: 250px;
    }
    .texto__historia h1{
        font-size: 1.75rem;
    }
    .texto__historia p,.slogan__mision p,.slogan__valores p,.valor__cuerpo{
        font-size: 0.938rem;
    }
    .valor__name h4{
        font-size: 1.25rem;
    }
    .icono__carta__valores{
        font-size: 1.375rem;
    }
    .carta__valores{
        padding: 20px 10px;
    }
}