html, body {

    padding: 0px;

    margin: 0px;

    width: 100%;

    min-height: 100%;

    height: 100%;

    font-family: "Roboto";

    font-size: 16px;

}



* {

    box-sizing: border-box;

}



.cont {

    display: flex;

    justify-content: space-between;

    width: 100%;

    min-height: 100%;

    height: 100%;

}



.col1 {

    width: 35%;

    background-color: #aaa;

    min-height: 100%;

    height: 100%;

    background-image: url('../../assets/images/img-login.png');

}



.col2 {

    width: 65%;

    min-height: 100%;

    height: 100%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

}



    .logo {

        margin-bottom: 30px;

    }



        .logo img {

            width: 280px;

        }



    .titulo {

        margin-bottom: 20px;

        font-size: 18px;

        color: #174A84;

        font-weight: 600;

    }



    .texto {

        margin-bottom: 30px;

        color: #666;

        font-size: 15px;

    }

    

    .form {

        display: flex;

        flex-direction: column;

        max-width: 300px;

    }



    input {

        width: 100%;

        border: 1px solid #CEB965;

        padding: 10px;

        margin-bottom: 10px;

        border-radius: 5px;

    }



    input[type="submit"] {

        background-color: rgb(156, 135, 50);

        border: 0px;

        color: #FFF;

        font-size: 17px;

        cursor: pointer;

    }



    input[type="submit"]:hover {

        background-color: rgb(167, 145, 79);

    }





@media screen and (max-width: 768px) {

    .col1 {

        width: 35%;

        background-color: #aaa;

        min-height: 100%;

        height: 100%;

        background-image: url('../img-login.png');

        display: none;

    }

    

    .col2 {

        width: 100%;

        min-height: 100%;

        height: 100%;

        display: flex;

        flex-direction: column;

        justify-content: center;

        align-items: center;

    }

}