@import url(./general.css);

.principal{
    width: 1100px;
    margin: 0 auto;
}
.pageName{
    text-align: center;
    width: 250px;
    margin: 32px auto 48px auto;
    border-top: 2px solid var(--blueMain);
    border-bottom: 2px solid var(--blueMain);
}
.seccion{
    display: grid;
    grid-template-columns: 550px 542px;
    grid-template-rows: 300px;
    margin: 64px auto;
    gap: 8px;
}
.seccion img{
    height: 100%;
    width: auto;
    margin: 0 auto;
    max-width: 100%;
}
.seccion h3{
    text-align: center;
    color: var(--blueMain);
}
.seccion p{
    font-size: 22px;
    text-align: justify;
}
@media(max-width: 1150px){
    .principal{
        width: 850px;
    }
    .seccion{
        grid-template-columns: 425px 417px;
    }
    .seccion p{
        font-size: 20px;
    }
}
@media(max-width: 860px){
    .seccion div, .seccion img{
        grid-column: 1/3;
    }
    .seccion{
        grid-template-rows: auto;
        grid-template-columns: auto;
    }
    .seccion img{
        height: 300px;
        grid-row: 2/3;
    }
    .principal{
        width: 500px;
    }
}
@media(max-width: 510px){
    .principal{
        width: 320px;
    }
}