body{
    background: linear-gradient(193.76deg, #005099 21.1%, #009989 83.9%);
    display: flex;
    height: 100vh;
    width: 100vw;
    flex-direction: column ;
    justify-content: center;
    align-items: center ;
    padding:0;
    margin:0;
}

.logo{
    width: 80%;
}

.title{
    font-family: 'Roboto', sans-serif;
    font-style: normal;
    font-weight: 300;
    font-size: 1.3em;
    /* identical to box height */

    text-align: center;

    color: #FFFFFF;
}


@media (min-width:300px) and (max-width:500px) {
    .logo{
        width: 60%;
    }
}

@media (min-width:501px) and (max-width:1200px) {
    .logo{
        width: 40%;
    }
}

@media (min-width:1201px)  {
    .logo{
        width: 25%;
    }
}