body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.divImage {
    display: flex;
    justify-content: center;
    align-items: center;
}

.logoimg {
    margin-top: 5%;
}

.divLogin {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

#inputName {
    margin-top: 3%;
    margin-bottom: 3%;
    font-family: 'Dancing Script', serif;
    font-size: 17px;
    border: 2px solid #f7f7f7;
    border-radius: 7px;
    text-align: center;
    color: white;
    background: None;
    padding-top: 5px;
    padding-bottom: 5px;
}
.botaoLogin {
    margin-top: 10%;
    font-family: 'Dancing Script', serif;
    font-size: 17px;
    padding: 5px;
    border: 2px solid #f7f7f7;
    border-radius: 7px;
}

.botaoLogin:hover {
    background: #87cefa;
    color: #f7f7f7;
    box-shadow: 0 0 6px #f7f7f7, 0 0 12px #f7f7f7, 0 0 18px #f7f7f7;
}

.progressBar {
    display: none;
    justify-content: center;
    align-items: center;
    color: #f7f7f7;
    font-family: 'Dancing Script', serif;
    font-size: 20px;
    font-weight: bold;
}

.progressBar p {
    text-align: center;
}

.welcome {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color: #f7f7f7;
    font-family: 'Dancing Script', serif;
    font-size: 20px;
    font-weight: bold;
}

.label {
    position: relative;
    overflow: hidden;
    width: 300px;
    height: 10px;
    border: 2px solid #f7f7f7;
    border-radius: 7px;
    margin-top: 2%;
}

.label::before {
    content: "";
    position: absolute;
    height: 100%;
    width: 40%;
    border-radius: 7px;
    background: linear-gradient(90deg, #06c199, #06c170, #06c159);
    box-shadow: 0 0 5px #06c199, 0 0 10px #06c170, 0 0 20px #06c159;
    animation: neon-pulse 1.5s ease-in-out infinite;
}

@keyframes neon-pulse {
    0% {
        left: -40%;
    }

    100% {
        left: 100%;
    }
}