:root {
    --cor1: #00AF91;
    --cor2: #007965;
    --cor3: #F58634;
    --cor4: #FFCC29;
}

.corw { color: #fff !important; }
.cor1 { color: var(--cor1) !important; }
.cor2 { color: var(--cor2) !important; }
.cor3 { color: var(--cor3) !important; }
.cor4 { color: var(--cor4) !important; }

body {
    background-color: var(--cor1);
    color: #fff;
}
#header {
    .logo {
        height: 12vh;
        & .logo1 {
            height: 7vh;
        }
        & .logo2 {
            height: 4vh;
        }
    }
}

.inner {
    margin: auto;
    width: 100%;
    max-width: 600px;
    text-align: center;
    display: flex;
    min-height: 88vh;
    padding-bottom: 5vh;
    align-items: center;
    justify-content: center;
    & .base {
        display: block;
        width: 100%;
        opacity: 0;
        visibility: hidden;
        transition: all .5s;
    }
}

.active .inner .base, .moving .inner .base {
    visibility: visible;
    opacity: 1;
}


.display-6 {
    font-size: 1.8rem;
}


.spinning {
    transform-origin:50% 58%;
    animation: spin 1s infinite linear;
}
@keyframes spin {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
}

.btn-proximo {
    background-color: var(--cor4) !important;
    color: var(--cor2) !important;
}


.form-control::placeholder {
    opacity: .3;
}
.form-control:focus {
    xbox-shadow: 0 0 0 .25rem rgba(245,134,52,.75);
    box-shadow: 0 0 0 .25rem rgba(0,121,101,.33);
}
.form-control:disabled {
    color: #aaa;
}

.form-error {
    color: var(--cor4);
}