*
{
    font-family: calibri, arial; 
    box-sizing: border-box;
}

body
{
    background-color: #f1edd6;
    margin: 10px 20px 0 20px;
}

hr{
    background-color: blue;
}

input{
    margin-bottom: 10px;
}

input[type="submit"]
{
    border: red 3px solid; border-radius: 5px;
    background-color: white; color: blue;   
}

input[type="submit"]:hover
{
    border: blue 3px solid; border-radius: 5px;
    background-color: blue; color: white; 
    transition: 0.3s;
    
}

textarea
{
    resize: none;
}

.form-control{
    width: 50%;
}

.largeLogo{
    width: 80%;
}

.smallLogo{
    display: none;
}

/*Smartphone*/
@media screen and (max-width:500px)
{
    input[type="text"]{
        width: 100%;
    }
    
    input[type="submit"]{
        width: 100%;
        margin: auto;
    }
    
    .form-control{
        width: 75%;
    }
    
    .largeLogo {
        display: none;
    }
    
    .smallLogo{
        display: block;
    }
}

/*Tablet*/
@media screen and (max-width:800px), (min-width:376px)
{
    h1{
        text-align: center;
    }

}