:root{
    --color-principa: #095828;
    --color-secundaria: #fafafa;
    --color-secundaria-dark: #063e1c;
    --color-light-gray: #e6e7ea;
    --color-dark-gray: #515050;

    --modulo-length: 20px;
}
body{
    font-family: 'Ubuntu',sans-serif;
    background-color: var(--color-light-gray);
    overflow-y: hidden; 
    height: 100vh;
}
.row{
    margin-left: 0;
    margin-right: 0;
}
.conteudo-metade-da-esquerda{
    margin-left: 0px;
    padding-bottom: 20px;
    font-size: 1.2rem;
    
}

.logo{
    margin: 80px auto;
}
.logo img{
    max-width: 500px;
}

.awesome-gradient{
    /* background-image: linear-gradient(to right, #0f579a, #159b58); */
    background-image: linear-gradient(to right, #666, #757575);
    padding-bottom: 120px;
    height: 100vh;
}
.awesome-gradient h2{
    margin:80px 0 40px 0;
}

/*presonalizações da metade direita*/
/*inputs*/
.field-input{
    margin: 10px 0 0 0;
    width: 100%;
}
.field-input label{
    position: relative;
    background-color: rgba(0,0,0,0.0);
    top: 20px;
    transition: transform 500ms;
}
.field-input label.ativo{
    transform: translate(-8px,-14px) scale(0.8);
}
.field-input input,.field-input textarea {
    color: white;
    border:none;
    width: 100%;
    background-color: rgba(0,0,0,0.0);
    border-bottom: solid 1px var(--color-secundaria);         
}
.field-input input:focus, .field-input textarea:focus{
    outline: none;
}

.btn-enviar{
    width: 100%;
    border: solid 1px var(--color-secundaria);
    background-color: var(--color-secundaria);
    text-align: center;
    padding: 10px 0;
    border-radius: 5px;
    font-size: 1.5rem;
    -webkit-box-shadow: 2px 3px 9px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: 2px 3px 9px 0px rgba(0,0,0,0.5);
    box-shadow: 2px 3px 9px 0px rgba(0,0,0,0.5);
    color: var(--color-secundaria-dark) !important;
}
input.btn-enviar{
    outline: none;
}
.mensagem-de-envio{
    opacity: 0;
    transition: opacity 500ms;
}
.mensagem-de-envio.status{
    opacity: 1;
}
.mt-20{
    margin-top: 20px;
}
.mt-40{
    margin-top: 40px;
}
.mb-20{
    margin-bottom: 20px;
}    

@media(max-width: 767px){
    body{
        overflow-y: initial; 
    }
    .awesome-gradient h2{
        margin:40px 0 20px 0;
    }
}

.font-light{
    font-weight: 300;
}

.color-dark-gray{
    color: var(--color-dark-gray);
}
.color-light-green{
    color: var(--color-secundaria);
}