.load-modal {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgb(0, 0, 0, 0.5);
    z-index: 100000;
    top: 0;
    left: 0;
}

    .load-modal.load-modal-off {
        display: none;
    }

.load-modal-content {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    /*width: 600px;*/
}

.load-text {
    color:white;
    text-align: center;
}
/*
.load-pin1 {
    fill: #ff4040;
}

.load-pin2 {
    fill: #1ad1ff;
}

.load-pin3 {
    fill: white;
}

.pin {
    width: 60px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto;
    animation: ball 500ms cubic-bezier(0.165, 0.840, 0.440, 1.000) infinite alternate;
}

#pin {
    enable-background: new 0 0 250.3 250.3;
}

.shadow {
    width: 50px;
    height: 15px;
    border-radius: 50%;
    background-color: #1ad1ff;
    display: block;
    margin: 0 auto;
    position: relative;
    top: -5px;
    opacity: 0.2;
    animation: shadow 500ms infinite alternate;
}

@keyframes ball {
    0% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(-120px);
    }
}

@keyframes shadow {
    0% {
        transform: scale(1.1);
        opacity: 0.6;
    }

    100% {
        transform: scale(.5);
    }
}

.rotate-y {
    -webkit-animation: rotate-y 1s linear .2s infinite;
    -moz-animation: rotate-y 1s linear .2s infinite;
    animation: rotate-y 1s linear .2s infinite;
}

@-webkit-keyframes rotate-y {
    0% {
        -webkit-transform: rotateY(0deg);
    }

    100% {
        -webkit-transform: rotateY(360deg);
    }
}

@-moz-keyframes rotate-y {
    0% {
        -moz-transform: rotateY(0deg);
    }

    100% {
        -moz-transform: rotateY(360deg);
    }
}

@keyframes rotate-y {
    0% {
        transform: rotateY(0deg);
    }

    100% {
        transform: rotateY(360deg);
    }
}


@-webkit-keyframes animatedBackground {
    from {
        background-position: 0 0;
    }

    to {
        background-position: -1511px 0;
    }
}
*/


.dots-bars-6 {
    width: 40px;
    height: 20px;
    --c: radial-gradient(farthest-side,currentColor 93%,#0000);
    background: var(--c) 0 0, var(--c) 50% 0;
    background-size: 8px 8px;
    background-repeat: no-repeat;
    position: relative;
    clip-path: inset(-200% -100% 0 0);
    animation: db6-0 1.5s linear infinite;
    left: 37px;
    color: white;
}

    .dots-bars-6:before {
        content: "";
        position: absolute;
        width: 8px;
        height: 12px;
        background: currentColor;
        left: -16px;
        top: 0;
        animation: db6-1 1.5s linear infinite, db6-2 0.5s cubic-bezier(0,200,.8,200) infinite;
    }

    .dots-bars-6:after {
        content: "";
        position: absolute;
        inset: 0 0 auto auto;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: currentColor;
        animation: db6-3 1.5s linear infinite;
    }

@keyframes db6-0 {
    0%,30% {
        background-position: 0 0,50% 0
    }

    33% {
        background-position: 0 100%,50% 0
    }

    41%,63% {
        background-position: 0 0,50% 0
    }

    66% {
        background-position: 0 0,50% 100%
    }

    74%,100% {
        background-position: 0 0,50% 0
    }
}

@keyframes db6-1 {
    90% {
        transform: translateY(0)
    }

    95% {
        transform: translateY(15px)
    }

    100% {
        transform: translateY(15px);
        left: calc(100% - 8px)
    }
}

@keyframes db6-2 {
    100% {
        top: -0.1px
    }
}

@keyframes db6-3 {
    0%,80%,100% {
        transform: translate(0)
    }

    90% {
        transform: translate(26px)
    }
}