@font-face {
    font-family: 'quicksandbold';
    src: url(../fonts/quicksandbold.otf);
}

.displayNone {
    display: none !important;
}

.opacidadeZero {
    opacity: 0;
    cursor: default !important;
}

.greenText {
    color: green !important;
}

.container {
    margin: 0 auto;
    width: 60%;
}

.menus {
    display: flex;
    align-items: center;
}

.tituloDados {
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
}

.nomeTexto,
.nifTexto {
    text-align: center;
    font-size: 1em;
    font-weight: bold;
    padding: 2em 0 0;
}

.nomeInput,
.nifInput,
.btnCriarConta {
    display: flex;
    margin: 0 auto;
    margin-top: 1.5em;
}

.dadosUser p {
    text-align: center;
    font-size: 1.5em;
}

.multibanco {
    background-color: #3171ce;
    width: 100vw;
    height: 80vh;
    max-width: 100%;
    overflow: hidden;
}

.opcoes {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.opcao {
    background-color: #142d52;
    width: 35%;
    max-width: 70%;
    margin-top: 3em;
    padding: 1em;
    cursor: pointer;
}

.opcao:nth-child(odd) {
    border-radius: 0 20px 20px 0;
}

.opcao:nth-child(even) {
    border-radius: 20px 0 0 20px;
}

#opcaoZeroZero,
#opcaoPonto {
    margin-bottom: 3em;
}


.opcoesInfo {
    text-align: center;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.numeroOpcao {
    font-family: 'quicksandbold';
    font-weight: bold;
    background-color: white;
    border: 3px solid #224f90;
    width: 1em;
    height: 1em;
    padding: 1em;
    margin-left: 1em;
    text-align: center;
}


.descricaoOpcao {
    font-family: 'quicksandbold';
    font-weight: bold;
    color: white;
    text-align: center;
    padding-right: 1em;
    margin-left: 5em;
}

.barraBackground {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
    height: 5em;
    background-color: #142d52;
    margin-top: 15%;
    margin-bottom: 13em;
}

.montante {
    font-family: 'quicksandbold';
    font-weight: bold;
    color: white;
    text-align: center;
    padding-top: 1em;
    margin-bottom: 1em;
}

.inputMontante {
    font-family: 'quicksandbold';
    font-weight: bold;
    color: white;
    font-size: 1.3em;
    background: none;
    border: none;
    border-bottom: 2px solid white;
    text-align: center;
    max-width: 20%;
}

.textoSaldo,
.textoNIB,
.textoIBAN {
    font-family: 'quicksandbold';
    text-align: center;
    font-size: 2em;
    margin-top: 30%;
}

.dadosUser p:nth-child(odd) {
    margin-bottom: 0.5em;
    font-weight: bold;
}

.dadosUser p:nth-child(even) {
    margin-bottom: 0.5em;
}


/* DISCLAIMER */
/* THE FOLLOWING CODE WAS NOT CREATED BY ME AND IT WAS COPIED ONLINE */
/* O CODIGO A SEGUIR NÃO FOI CRIADO POR MIM E FOI COPIADO ONLINE */

.voucherAnimation::after {
    font-family: 'quicksandbold', Arial, sans-serif;
    content: counter(count);
    top: 10%;
    font-size: 2rem;
    animation: counter 0.2s linear infinite alternate;
    counter-reset: count 0;
    color: white;
}

@keyframes counter {
    0% {
        counter-increment: count 0758964123;
    }

    10% {
        counter-increment: count 1587694230;
    }

    20% {
        counter-increment: count 2048965713;
    }

    30% {
        counter-increment: count 3751082694;
    }

    40% {
        counter-increment: count 4910235786;
    }

    50% {
        counter-increment: count 5874963210;
    }

    60% {
        counter-increment: count 6895741230;
    }

    70% {
        counter-increment: count 7541236908;
    }

    80% {
        counter-increment: count 8972635410;
    }

    90% {
        counter-increment: count 9874563110;
    }

    100% {
        counter-increment: count 1058967413;
    }
}