:root {
    --linesGroup_1: 15s;
    --linesGroup_2: 7s;
}

@keyframes drawLine_pg01_yello {
    0% {
        stroke-dasharray: 1680 2000;
        opacity: 1; /*0.05*/
    }
    50% {
        stroke-dasharray: 1680 320;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 160 1700;
        opacity: 1; /*0.05*/
    }
}
.drawn-path-pg01-yello {
    stroke-dashoffset: 2000;
    animation: drawLine_pg01_yello var(--linesGroup_1) infinite linear;
}
@keyframes drawLine_pg01_blue {
    0% {
        stroke-dasharray: 120 450;
        opacity: 1; /*0.05*/
    }
    50% {
        stroke-dasharray: 273 450;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 550 450;
        opacity: 1; /*0.05*/
    }
}
.drawn-path-pg01-blue {
    stroke-dashoffset: 700;
    animation: drawLine_pg01_blue var(--linesGroup_1) infinite linear;
}
@keyframes drawLine_pg01_red {
    0% {
        stroke-dasharray: 550 450;
        opacity: 1; /*0.05*/
    }
    50% {
        stroke-dasharray: 273 450;
        opacity: 1; /*0.8*/
    }
    100% {
        stroke-dasharray: 120 450;
        opacity: 1; /*0.05*/
    }
}
.drawn-path-pg01-red {
    stroke-dashoffset: 700;
    animation: drawLine_pg01_red var(--linesGroup_1) infinite linear;
}
@keyframes drawLine_pg01_white {
    0% {
        stroke-dasharray: 120 450;
        opacity: 1; /*0.05*/
    }
    50% {
        stroke-dasharray: 273 450;
        opacity: 1; /*0.8*/
    }
    100% {
        stroke-dasharray: 655 450;
        opacity: 1; /*0.05*/
    }
}
.drawn-path-pg01-white {
    stroke-dashoffset: 700;
    animation: drawLine_pg01_white var(--linesGroup_1) infinite linear;
}
@keyframes drawLine_pg01_purple {
    0% {
        stroke-dasharray: 120 450;
        opacity: 1; /*0.05*/
    }
    50% {
        stroke-dasharray: 273 450;
        opacity: 1; /*0.8*/
    }
    100% {
        stroke-dasharray: 550 450;
        opacity: 1; /*0.05*/
    }
}
.drawn-path-pg01-purple {
    stroke-dashoffset: 700;
    animation: drawLine_pg01_purple var(--linesGroup_1) infinite linear;
}

@keyframes frame_path_105 {
    0% {
        stroke-dasharray: 0 2000;
        stroke-dashoffset: 0;
        opacity: 1;
    }

    50% {
        stroke-dasharray: 2000 2000;
        stroke-dashoffset: 0;
        opacity: 1;
    }
    100% {
        stroke-dasharray: 2000 2000;
        stroke-dashoffset: -2000;
        opacity: 1;
    }
}

.draw-path-105 {
    stroke-dasharray: 0 2000;
    stroke-dashoffset: 0;
    animation: frame_path_105 21s infinite linear;
}


@keyframes drawLine {
    to {
        stroke-dashoffset: 0;
    }
}
.drawn-path {
    fill: none;
    /* stroke: black; */
    stroke-width: 2;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    /* Adjust animation duration here */
    animation: drawLine var(--linesGroup_1) linear forwards;
    opacity: 1 !important;
    transition: opacity 5s ease;
}

.drawn-path-2 {
    fill: none;
    stroke-width: 2;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: drawLine var(--linesGroup_2) linear forwards;
    opacity: 1 !important;
}


.drawn-path-0 {
    animation: drawLine var(--linesGroup_2) linear forwards !important;
}

.drawn-path-3 {
    animation: drawLine var(--linesGroup_2) linear forwards !important;
}

.drawn-path-10 {
    animation-duration: var(--linesGroup_2);
}

.drawn-path-11 {
    animation-duration: var(--linesGroup_2);
}

.drawn-path-12 {
    animation-duration: var(--linesGroup_2);
    stroke-width: 1px;
}

.drawn-path-13 {
    animation-duration: 1s;
}



.moving-circle {
    stroke: none;
    display: none !important;
}

.svg-line {
    width: 100%;
    height: 300px;
    margin-bottom: 20px;
    overflow: visible;
    position: absolute;
    /* Add some space between SVGs */
}


.svg-0 {
    height: 32vh !important;
    top: -22%;
    right: -35%;
    width: 105vw;
}

.svg-1 {
    top: -3%;
    left: -31%;
    width: 85vw;
    height: 48vh;
}

.svg-2 {
    width: 55vw;
    height: 38vh;
    right: -21%;
    top: 36%;
}

.svg-3 {
    width: 15vw;
    height: 38vh;
    bottom: 11%;
    left: 39.4%;
}

.svg-4 {
    width: 15vw;
    height: 48vh;
    left: 4%;
    bottom: 18%;
}

.svg-5 {
    width: 50vw;
    height: 38vh;
    left: -10%;
    top: -10%;
    transform: rotate(-14deg);
}
.svg-105 {
    top: 11%;
    right: 16%;
    height: 45vh;
    width: 76vw;
}

.svg-6 {
    right: -13%;
    width: 46% !important;
    top: -5%;
}

.svg-6 path {
    opacity: 0;
}

.svg-7 {
    left: -9%;
    width: 44% !important;
    top: -15%;
}

.svg-7 path {
    opacity: 0;
}

.svg-8 {
    width: 52% !important;
    left: -21%;
    top: 21%;
    transform: rotate(-9deg);
}

.svg-8 path {
    opacity: 0;
}

.svg-9 {
    width: 52% !important;
    left: -21%;
    top: 42%;
}

.svg-9 path {
    opacity: 0;
}


.svg-10 {
    width: 57% !important;
    left: 0;
    top: -20%;
    transform: rotate(-18deg);
}

.svg-10 path {
    opacity: 0;
}

.svg-11 {
    height: 42vh !important;
    bottom: -18%;
    transform: rotate(51deg);
    left: -34%;
}


.svg-11 path {
    opacity: 0;
}

.svg-12 {
    height: 37vh !important;
    top: -10%;
    left: 13%;
}

.svg-13 {
    height: 58vh !important;
    left: -40%;
    bottom: -8%;
    transform: rotate(-12deg);
}

.svg-14 {
    height: 66vh !important;
    left: -67%;
    bottom: -8%;
    transform: rotate(-48deg);
}

.svg-010 {
    height: 16vh !important;
    right: -12%;
    bottom: 26%;
    width: 46%;
}

.svg-011 {
    height: 14vh !important;
    right: -10%;
    bottom: -1%;
    width: 46%;
}
