.ContenedorPricnipal {
    background-color: white;
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, 1fr);
    grid-template-areas:
        "Historia Historia PoliticaCalidad PoliticaCalidad"
        "Foto1 Foto1 Foto1 Foto1"
        "Filosofia Filosofia Foto2 Foto2"
        "Mision Mision Foto2 Foto2"
        "Vision Vision Foto2 Foto2"
        "Valores Valores Valores Valores";
}
.Foto1 {
    grid-area: Foto1;
    text-align:center;
    margin-top:40px;
    margin-bottom:40px;
}

.Foto2 {
    grid-area: Foto2;
    text-align: center;
}

.DiseñoFoto1 {
    width: 80%;
    border-radius: 30px;
    /*Resplandor exterior*/
    -moz-box-shadow: 0px 0px 5px;
    -webkit-box-shadow: 0px 0px 5px;
    box-shadow: 0px 0px 5px black;
}

.DiseñoFoto2 {
    width: 60%;
    border-radius: 30px;
    /*Resplandor exterior*/
    -moz-box-shadow: 0px 0px 5px;
    -webkit-box-shadow: 0px 0px 5px;
    box-shadow: 0px 0px 5px black;
}

.Historia {
    margin-top: 20px;
    margin-left: 10%;
    margin-right: 5%;
    grid-area: Historia;
}

.PoliticaCalidad {
    margin-top: 20px;
    margin-left: 5%;
    margin-right: 10%;
    grid-area: PoliticaCalidad;
}

.Filosofia {
    margin-top: 20px;
    margin-left: 20%;
    grid-area: Filosofia;
}

.Mision {
    margin-top: 20px;
    margin-left: 20%;
    grid-area: Mision;
}

.Vision {
    margin-top: 20px;
    margin-left: 20%;
    grid-area: Vision;
}

.Valores {
    margin-top: 20px;
    margin-bottom: 50px;
    margin-left: 10%;
    grid-area: Valores;
}

.Valores2{
    display:flex;
    flex-direction:row;
}
@media screen and (max-width: 800px) {
    .ContenedorPricnipal {
        background-color: white;
        justify-content: center;
        display: grid;
        grid-gap: 10px;
        grid-template-columns: repeat(2, 1fr);
        grid-template-areas:
            "Historia Historia"
            "PoliticaCalidad PoliticaCalidad"
            "Foto1 Foto1"
            "Filosofia Filosofia"
            "Foto2 Foto2"
            "Mision Mision"
            "Vision Vision"
            "Valores Valores";
    }

    .Historia {
        margin-top: 20px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: Historia;
    }

    .PoliticaCalidad {
        margin-top: 20px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: PoliticaCalidad;
    }

    .Filosofia {
        margin-top: 20px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: Filosofia;
    }

    .Mision {
        margin-top: 20px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: Mision;
    }

    .Vision {
        margin-top: 20px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: Vision;
    }

    .Valores {
        margin-top:20px;
        margin-bottom:50px;
        margin-left: 5%;
        margin-right: 5%;
        grid-area: Valores;
    }

    .Valores2 {
        display: flex;
        flex-direction: column;
    }
}