@media(min-width: 2000px){
    .body{
        font-size: 1.2em;
    }
}

.container{
    display: flex;
    flex-direction: column;
    padding-top: 0px;
/*    color: white;*/
}

.section1{
        background-color:#f4f4f4;
     
    display: flex;
    flex-direction: column;
}

.section1>h1{
    text-align: center;
    padding-top: 30px;
    margin-bottom: 2px;
}

.section1>p{
    max-width: 50%;
    margin-left:auto;
    margin-right: auto;
    text-align: justify;
    font-size: 1.2em;
    padding-bottom: 30px;
}

.section2{
    /*    background-color: rgba(71,105,145, 1);*/
    background-color: #d5d5d5;
    display: flex;
    flex-direction: column;
    padding-top: 20px;
    padding-bottom: 20px;
}

.section2>h1{
    text-align: center;
    padding-top: 30px;
    margin-bottom: 2px;
}

.section2>p{
    max-width: 50%;
    margin-left:auto;
    margin-right: auto;
    text-align: justify;
    font-size: 1.2em;
    padding-bottom: 30px;
}

.section3{
/*    background-color: #d3f0ff;*/
    background-color: #f4f4f4;
    display: flex;
    flex-direction: column;
    padding-top: 50px;
    padding-bottom: 50px;
}

.section3>p{
    text-align:center;
    font-size: 2.2em;
    font-weight: 600;
    margin-bottom: 2px;
}

.section3>div{
    text-align: center;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;

}
.section3>div>img{
    flex-grow:1;
    margin-left: 30px;
    margin-top: 30px;
    margin-right: 30px;
    margin-bottom: 30px;
}

.section4{
    background-color: #d5d5d5;
    display: flex;
    flex-direction: column;
    padding-top: 20px;
    padding-bottom: 20px;
}

.section4>h1{
    text-align: center;
    padding-top: 30px;
    margin-bottom: 2px;
}

.section4>p{
    max-width: 50%;
    margin-left:auto;
    margin-right: auto;
    text-align: justify;
    font-size: 1.2em;
}

#yorku{
    max-height: 140px;
}

#ru{
    max-height: 120px;
}

#hw{
    max-height: 120px;

}

#csa{
    max-height: 140px;
}

@media (max-device-width:900px){

    .container{
        display: flex;
        flex-direction: column;
        padding-top: 100px;
    }

    .section1{
        background-color: #f4f4f4;
        display: flex;
        flex-direction: column;
    }

    .section1>h1{
        text-align: center;
        padding-top: 20px;
        margin-bottom: 2px;
    }

    .section1>p{
        max-width: 70%;
        margin-left:auto;
        margin-right: auto;
        text-align: justify;
        font-size: 1.2em;
        padding-bottom: 20px;
    }

    .section2{
        background-color: #d5d5d5;
        display: flex;
        flex-direction: column;
    }

    .section2>h1{
        text-align: center;
        padding-top: 20px;
        margin-bottom: 2px;
    }

    .section2>p{
        max-width: 70%;
        margin-left:auto;
        margin-right: auto;
        text-align: justify;
        font-size: 1.2em;
        padding-bottom: 20px;
    }

    .section3{
        background-color:#f4f4f4;
        display: flex;
        flex-direction: column;

    }
    .section3>p{
        text-align:center;
        font-size: 2.2em;
        font-weight: 600;
        margin-bottom: 2px;
    }
    .section3>div{
        /*    display: flex;*/
        text-align: center;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
    }

    .section3>div>img{
        flex-grow:1;
        margin-left: 50px;
        margin-top: 50px;
        margin-right: 50px;
        margin-bottom: 50px;
    }

    #yorku{
        max-height: 200px;
    }

    #ru{
        max-height: 200px;
    }

    #hw{
        max-height: 200px;
        flex-grow:2;
    }

    #csa{
        max-height: 200px;
    }    
}