#wrap {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    align-items: center;
}
img {
    width:40%;
    max-width: 30rem;
}
.loading_wrap .bar {
    position: relative;
    width: 25vw;
    max-width: 300px;
    margin: 0 auto;
    height:1rem;
    background:#e0e0e0;
}
.loading_wrap .bar:after {
    content:'';
    position: absolute;
    max-width: 300px;
    height:1rem;
    background:#4c60e3;
    -webkit-animation: loading 1s;
    -o-animation: loading 1s;
    animation: loading 1s;
    animation-timing-function: ease-out;
    animation-fill-mode: both;
}

@keyframes loading {
    0% {width: 0vw;}
    100% {width: 25vw;}
}

.loading_wrap .loading {
    font-size: 1.8rem;
    font-weight: bold;
    color: #b3b3b3;
    margin-bottom: .7rem;
    text-align: center;
}