.manufacturing1 {
    width: 800px;
    height: 800px;
    position: absolute;
    top: -80px;
    left: 0px;
    transform: scale(1);
}

@media (max-width: 1536px) {
    .manufacturing1 {
        transform: scale(0.7);
        top: -166px;
        left: -155px;
    }
}

@media (max-width: 1366px) {
    .manufacturing1 {
        transform: scale(0.6);
        top: -166px;
        left: -155px;
    }
}

.man1-fac-top {
    position: absolute;
    z-index: 9;
}

.man1-fac-bottom {
    position: absolute;
    z-index: 2;
}

.man1-v1 {
    position: absolute;
    top: 430px;
    left: 260px;
    z-index: 5;
    animation: v1-move 3s 1;
    -webkit-animation-timing-function: ease-in-out; /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}

@keyframes v1-move {
    0% {
        top: 60px;
        left: -300px;
    }

    100% {
        top: 430px;
        left: 260px;
    }
}

.man1-v2 {
    position: absolute;
    top: 327px;
    left: 400px;
    z-index: 4;
    animation: v2-move 3s 1;
    -webkit-animation-timing-function: ease-in-out; /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}

@keyframes v2-move {
    0% {
        top: -60px;
        left: -121px;
    }

    100% {
        top: 327px;
        left: 400px;
    }
}

/* -------------------- */

.manufacturing2 {
    position: relative;
    width: 583px;
    height: 440px;
    left: 250px;
    transform: scale(0.8);
    top: 100px;
}

.manufacturing2.active {
    position: relative;
    width: 583px;
    height: 440px;
    left: 250px;
    transform: scale(0.8);
    top: 100px;
}

@media (max-width: 1536px) {
    .manufacturing2,
    .manufacturing2.active {
        left: 100px;
    }
}

@media (max-width: 1366px) {
    .manufacturing2,
    .manufacturing2.active {
        left: 40px;
    }
}

.man2-bg {
    position: absolute;
    width: 513px;
    height: 480px;
    z-index: 9;
}
.man2-bg1 {
    position: absolute;
    width: 185px;
    height: 353px;
    top: 122px;
    left: 81px;
}

.man2-v {
    position: absolute;
    width: 583px;
    height: 440px;
    top: -83px;
    left: 50px;
    z-index: 12;
}
.man2-p {
    position: absolute;
    top: 0;
    left: 110px;
    z-index: 15;
}
.man2-v img {
    opacity: 0;
}
.manufacturing2.active .man2-v {
    animation: man2-v-move 3s 1;
    -webkit-animation-timing-function: ease-in-out; /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}
.manufacturing2.active .man2-v img {
    opacity: 1;
}

@keyframes man2-v-move {
    0% {
        top: -175px;
        left: -110px;
        opacity: 1;
    }

    100% {
        top: -83px;
        left: 50px;
        opacity: 1;
    }
}

/* -------------- */

.manufacturing3 {
    position: relative;
    width: 651px;
    height: 526px;
    transform: scale(0.7);
    float: right;
    left: -150px;
    top:-65px;
}
.manufacturing3.active {
    position: relative;
    width: 651px;
    height: 526px;
    transform: scale(0.7);
    float: right;
    left: -150px;
    top:-65px;
}

@media (max-width: 1536px) {
    .manufacturing3,
    .manufacturing3.active {
        left: -20px;
    }
}

@media (max-width: 1366px) {
    .manufacturing3,
    .manufacturing3.active {
        left: 40px;
    }
}

.man3-bg {
    position: absolute;
    width: 651px;
    height: 526px;
    z-index: 4;
}

.man3-v {
    position: absolute;
    width: 340px;
    height: 371px;
    right: 150px;
    top: 104px;
    z-index: 8;
}

.man3-v img {
    opacity: 0;
}

.manufacturing3.active .man3-v {
    animation: man3-v-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}
.manufacturing3.active .man3-v img {
    opacity: 1;
}

@keyframes man3-v-move {
    0% {
        right: -160px;
        top: -78px;
        opacity: 2;
    }

    100% {
        right: 150px;
        top: 104px;
        opacity: 1;
    }
}

.man3-p {
    position: absolute;
    width: 98px;
    height: 261px;

    top: 180px;
    right: 160px;
    z-index: 9;
}

/* ------------------ */

.manufacturing4 {
    position: relative;
    width: 650px;
    height: 367px;
    transform: scale(0.7);
    left: 120px;
    top: -65px;
}
.manufacturing4.active {
    position: relative;
    width: 650px;
    height: 367px;
    transform: scale(0.7);
    left: 120px;
    top: -65px;
}

@media (max-width: 1536px) {
    .manufacturing4,
    .manufacturing4.active {
        left: 10px;
    }
}

@media (max-width: 1366px) {
    .manufacturing4,
    .manufacturing4.active {
        left: -60px;
    }
}

.man4-bg {
    position: absolute;
    width: 651px;
    height: 526px;
}

.man4-v {
    position: absolute;
    width: 340px;
    height: 371px;
    top: 10px;
    left: 150px;
}
.man4-v img {
    opacity: 0;
}

.manufacturing4.active .man4-v {
    animation: man4-v-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}
.manufacturing4.active .man4-v img {
    opacity: 1;
}

@keyframes man4-v-move {
    0% {
        top: -140px;
        left: -120px;
        opacity: 4;
    }

    100% {
        opacity: 1;
        top: 10px;
        left: 150px;
    }
}

.man4-1 {
    position: absolute;
    width: 135px;
    height: 303px;
    top: 120px;
    left: 160px;
}

.man4-2 {
    position: absolute;
    width: 135px;
    height: 303px;
    top: 50px;
    left: 460px;
}

/* ------------------ */

.manufacturing5 {
    position: relative;
    width: 650px;
    height: 367px;
    float: right;
    transform: scale(0.7);
    left: -135px;
}

.manufacturing5.active {
    position: relative;
    width: 650px;
    height: 367px;
    float: right;
    transform: scale(0.7);
    left: -135px;
}
@media (max-width: 1536px) {
    .manufacturing5,
    .manufacturing5.active {
        left: 30px;
    }
}

@media (max-width: 1366px) {
    .manufacturing5 {
        left: 8rem;
    }
    .manufacturing5.active {
        left: 8rem;
    }
}

.man5-bg {
    position: absolute;
    width: 643px;
    height: 316px;
}

.man5-p {
    position: absolute;
    width: 102px;
    height: 240px;
    top: 65px;
    left: 256px;
}

.man5-o1 {
    position: absolute;
    width: 24px;
    height: 24px;
    top: 146px;
    left: 97px;
    opacity: 1;
}

.manufacturing5.active .man5-o1 {
    animation: man5-o1-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}

@keyframes man5-o1-move {
    0% {
        top: 124px;
        left: 50px;
        opacity: 1;
    }

    100% {
        opacity: 0;
        top: 146px;
        left: 97px;
    }
}

.man5-o2 {
    position: absolute;
    width: 75px;
    height: 61px;
    top: 118px;
    left: 252px;
}
.manufacturing5.active .man5-o2 {
    animation: man5-o2-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}

@keyframes man5-o2-move {
    0% {
        top: 170px;
        left: 150px;
        opacity: 1;
    }

    100% {
        top: 118px;
        left: 252px;
        opacity: 1;
    }
}

.man5-o3 {
    position: absolute;
    width: 52px;
    height: 79px;
    top: 75px;
    left: 496px;
}

.manufacturing5.active .man5-o3 {
    animation: man5-o3-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}

.man5-o1 img,
.man5-o2 img,
.man5-o3 img {
    opacity: 0;
}
.manufacturing5.active .man5-o1 img,
.manufacturing5.active .man5-o2 img,
.manufacturing5.active .man5-o3 img {
    opacity: 1;
}

@keyframes man5-o3-move {
    0% {
        top: 20px;
        left: 400px;
        opacity: 1;
    }

    100% {
        top: 75px;
        left: 496px;
        opacity: 1;
    }
}

/* ----------------------------- */

/* -------------- */

.manufacturing6 {
    position: relative;
    width: 651px;
    height: 526px;
    transform: scale(0.7);
    float: right;
    left: -150px;
}
.manufacturing6.active {
    position: relative;
    width: 651px;
    height: 526px;
    transform: scale(0.7);
    float: right;
    left: -150px;
}

@media (max-width: 1536px) {
    .manufacturing6,
    .manufacturing6.active {
        left: -20px;
    }
}

@media (max-width: 1366px) {
    .manufacturing6,
    .manufacturing6.active {
        left: 40px;
    }
}

.man6-bg {
    position: absolute;
    width: 651px;
    height: 526px;
    z-index: 4;
}

.man6-v {
    position: absolute;
    width: 340px;
    height: 371px;
    right: 150px;
    top: 60px;
    z-index: 8;
}

.man6-v img {
    opacity: 0;
}

.manufacturing6.active .man6-v {
    animation: man6-v-move 3s 1;
    -webkit-animation-timing-function: ease-in-out;
    /* Chrome, Safari, Opera */
    animation-timing-function: ease-in-out;
}
.manufacturing6.active .man6-v img {
    opacity: 1;
}

@keyframes man6-v-move {
    0% {
        right: -65px;
        top: -55px;
        opacity: 2;
    }

    100% {
        right: 150px;
        top: 60px;
        opacity: 1;
    }
}

.man6-p {
    position: absolute;
    width: 98px;
    height: 261px;

    top: 180px;
    right: 160px;
    z-index: 9;
}

.man6-p2 {
    position: absolute;
    width: 98px;
    height: 261px;
    top: 195px;
    right: 490px;
    z-index: 9;
}