.line-drawing,
.subtle {
    position: absolute;
    transform: translate(-50%);
    z-index: -1;
}

.path {
    fill: none;
    stroke: #8c8c8c;
    stroke-dasharray: 10;
}


.mask {
    fill: none;
    stroke: white;
    stroke-width: 10;
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;

}

.aos-animate .line-drawing .mask {
    stroke-dashoffset: 0;
    -webkit-transition: stroke-dashoffset 2s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0s;
    transition: stroke-dashoffset 2s cubic-bezier(0.445, 0.05, 0.55, 0.95) 0s;
}

#line-1 {
    left: 55%;
    top: -7rem;
}

#line-2 {
    top: 41%;
    left: 51%;
}

.aos-animate #line-2 .mask {
    transition-delay: 2s;
}

#line-3 {
    top: -71%;
    left: 23%;
}

#line-4 {
    top: -9rem;
    left: 50%;
}

#line-5 {
    top: -9rem;
    left: 17%;
}

#line-6 {
    top: -11rem;
    left: 60%;
}

#line-7 {
    top: -21rem;
    left: 46%;
}

#line-8 {
    top: -10rem;
    left: 38%;
}

#line-9 {
    left: 40%;
    top: 35%;
}

#line-10 {
    left: 73%;
    top: 60%;
}

.aos-animate #line-9 .mask {
    transition-delay: 2.5s;
}

.aos-animate #line-10 .mask {
    transition-delay: 4.3s;
}

.aos-animate.para-text-image .para-desc {

    transform: rotateY(0);
    perspective-origin: 1000px;
    transition-delay: 1s;
}

.animation {
    transition-duration: .5s;
    transition-timing-function: ease-out;
}

#subtle_1 {
    right: 3%;
    top: -2%;
}

#subtle_2 {
    bottom: 5%;
    left: 44%;
}

#subtle_3 {
    left: 0;
    top: -35%;
}

#subtle_4 {
    bottom: 0;
    left: 2rem;
}

#subtle_5 {
    bottom: -5rem;
    right: 2rem;
}

#subtle_6 {
    top: -4rem;
    left: 2rem;
}

#subtle_7 {
    right: 0;
    top: -4rem;
}

#subtle_8 {
    top: 0;
    right: 7rem;
}

#subtle_9 {
    bottom: 0;
    left: 2rem;
}

#subtle_10 {
    bottom: -20rem;
    left: 0;
}

#subtle_11 {
    right: 0;
    bottom: -2rem;
}

#subtle_12 {
    top: -2rem;
    left: 0;
}

#subtle_13 {
    right: 0;
    top: 0;
}

#subtle_14 {
    bottom: 9rem;
    left: 2rem;
}

#subtle_15 {
    right: 2rem;
    bottom: 0;
}

#subtle_16 {
    bottom: -18rem;
    left: 0;
}

/*Paragraph 1*/

@media(min-width: 992px) {

    .view-schools.front .v-wrapper,
    .view-medias.latest .v-wrapper {
        opacity: 0;
        visibility: hidden;
        transform: translateY(-50px);
    }

    .aos-animate .view-schools.front .v-wrapper:first-child {
        transition-delay: 2.5s;
    }

    .aos-animate .view-schools.front .v-wrapper:last-child {
        transition-delay: 1s;
    }

    .aos-animate .view-schools.front .v-wrapper,
    .aos-animate .view-medias.latest .v-wrapper {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .aos-animate .view-medias.latest .v-wrapper:first-child {
        transition-delay: 1.5s;
    }

    .aos-animate .view-medias.latest .v-wrapper:nth-child(2) {
        transition-delay: 3s;
    }

    .aos-animate .view-medias.latest .v-wrapper:last-child {
        transition-delay: 4.5s;
    }
}