@charset "UTF-8";

@media screen and (min-width: 768px) and (max-width: 992px) { /* TABLET */
    body {
        background-image: linear-gradient(to top, #49a09d, #5f2c82);
    }
    
    section#login {
        width: 80vw;
        height: 310px;
    }

    section#login > div#imagem {
        float: left;
        width: 40%;
        height: 100%;
    }

    section#login > div#formulario {
        float: right;
        width: 60%;
    }

    form > input[type=submit] {
        width: 95%;
        height: 40px;
     } 
 
     form > a.botao {
         width: 95%;
         height: 40px;
     }
}

@media screen and (min-width: 992px) { /* Grandes telas */
    body {
        background-image: linear-gradient(to top, #49a09d, #5f2c82);
    }
    
    section#login {
        width: 950px;
        height: 340px;
    }
    section#login > div#imagem {
        float: left;
        width: 50%;
        height: 100%;
    }

    section#login > div#formulario {
        float: right;
        width: 50%;
    }

    div#formulario > h1 {
        font-size: 2em;
    }


    div#formulario > p {
        font-size: 1em;
        margin: 10px 0px;
    }

    form > input[type=submit] {
       width: 93%;
       height: 40px;
    } 

    form > a.botao {
        width: 93%;
        height: 40px;
    }
}
    

/*  PARA MUDAR A CAIXA
    div.campo > input {
        height: 100%;
        width: calc(100% - 40%);
    } 
*/