#container{
    background-color: #F0F0F0;
}
#bluebox{
    background-color: #1F3876;  height: 300px;
}
#downcontainer{
    background-color: white; margin-left: 5%; margin-right: 5%; margin-top: -10%;  padding: 7%;
}
#textoffirstbox{
    font-family: Helvetica; font-weight: 700; font-size: 14px; line-height: 24px; margin-top: 0%;
}
#textofsecondbox{
    font-family: Helvetica; font-weight: 700; font-size: 14px; line-height: 24px; margin-top: 0%;
}
.textofthirdbox{
    font-family: Helvetica; font-weight: 400; font-size: 14px; line-height: 25px;margin-top: 0%;margin-bottom: 2%;
}
#fourthbox{
    margin-top: 5%; padding: 3%;
}
.thirdbox{
    margin-top: 8%; padding: 3%;
}
@media only screen and (max-width: 800px) and (min-width: 500px)  {
    #bluebox{
        background-color: #1F3876;  height: 250px;
    }
    #downcontainer{
        background-color: white; margin-left: 5%; margin-right: 5%; margin-top: -15%;  padding: 7%;
    }
}
@media only screen and (max-width: 500px) and (min-width : 350px)  {
    #bluebox{
        background-color: #1F3876;  height: 200px;
    }
    #downcontainer{
        background-color: white; margin-left: 5%; margin-right: 5%; margin-top: -25%;  padding: 7%;
    }
}
@media only screen and (max-width: 350px) {
    #bluebox{
        background-color: #1F3876;  height: 160px;
    }
    #downcontainer{
        background-color: white; margin-left: 5%; margin-right: 5%; margin-top: -30%;  padding: 7%;
    }
}