/* metodologia agil */
@import url('https://fonts.googleapis.com/css2?family=Koulen&display=swap');
@import url('https://fonts.googleapis.com/css2family=Oleo+Script+Swash+Caps&family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,200;0,300;1,100&display=swap');

*{
    box-sizing: border-box;
}
form {
    width: 95%;
    margin-top: 100px;
    margin-bottom: 150px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
form > div {
    margin: 20px 0;
    text-align: left;
}
.area-logo{
    background-color: white;
}

.resposta{/*Style que configura as caixa que podem ser digitadas*/
    border: none;
    border-bottom: 2px solid #003727;
    width: 100%;
    margin-top: 20px;
    padding: 5px;
}

.botao{
    background-color: #00966c;
    border: none;
    color: white;
    font-weight: bold;
    width: 80%;
    padding: 10px;
    border-radius: 20px;
    cursor: pointer;
    transition: 0.3s;
}
.botao:hover {
    background-color: #229776;
}

/* PEQUENO(CELULAR) */
.col-sm-1{width: 8.33%}
.col-sm-2{width: 16.66%}
.col-sm-3{width: 25%}
.col-sm-4{width: 33.33%}
.col-sm-5{width: 41.66%}
.col-sm-6{width: 50%}
.col-sm-7{width: 58.33%}
.col-sm-8{width: 66.66%}
.col-sm-9{width: 75%}
.col-sm-10{width: 83.33%}
.col-sm-11{width: 91.66%}
.col-sm-12{width: 100%}

@media only screen and (min-width: 600px) { /* MEDIO (TABLET) */
    .col-md-1{width: 8.33%}
    .col-md-2{width: 16.66%}
    .col-md-3{width: 25%}
    .col-md-4{width: 33.33%}
    .col-md-5{width: 41.66%}
    .col-md-6{width: 50%}
    .col-md-7{width: 58.33%}
    .col-md-8{width: 66.66%}
    .col-md-9{width: 75%}
    .col-md-10{width: 83.33%}
    .col-md-11{width: 91.66%}
    .col-md-12{width: 100%}
    
    form {
        width: 90%;
    }
    
}


@media only screen and (min-width: 1024px) { /* GRANDE (COMPUTADOR) */
    .col-lg-1{width: 8.33%}
    .col-lg-2{width: 16.66%}
    .col-lg-3{width: 25%}
    .col-lg-4{width: 33.33%}
    .col-lg-5{width: 41.66%}
    .col-lg-6{width: 50%}
    .col-lg-7{width: 58.33%}
    .col-lg-8{width: 66.66%}
    .col-lg-9{width: 75%}
    .col-lg-10{width: 83.33%}
    .col-lg-11{width: 91.66%}
    .col-lg-12{width: 100%}
    
    form {
        width: 85%;
    }
    
}