@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100&display=swap');

body {
    padding: 0;
    margin: 0;
}

.container {
    height: 100vh;
}

.bar-container {
    display: none;
    position: absolute;
    margin: 0 auto;
    left: 0;
    right: 0;
    height: 0.3vh;
    width: 27.5vh;
    background-color: rgba(23, 23, 23, 90%);
    bottom: 12vh;
    border-radius: .5vh;
    box-shadow: 0rem 0rem 0.1rem 0.05rem #000000;
    overflow: hidden;
}

.bar-check {
    position: absolute;
    height: 100%;
    width: 10%;
    background-color: #dc143c7e;
    bottom: 0;
    right: 50%;
    z-index: 101;
    text-align: center;
    transition: background-color .1s ease;
    z-index: 101;
}

.bar-total {
    height: 100%;
    width: 0%;
    background: #dc143c;
    border-right: white 1px solid;
    z-index: 100;
}

.bar-label {
    position: absolute;
    height: auto;
    width: auto;
    text-align: center;
    z-index: 101;
    margin: 0 auto;
    left: 0;
    right: 0;
    bottom: 13vh;
}

.bar-label > span {
    line-height: 4.3vh;
    color: #dc143c;
    font-size: 3.6vh;
    font-weight: 900;
    font-family: "Poppins", sans-serif !important;
    text-shadow: 0px 0px 3px #000000;
}
