/*----- animation section start -----*/
.shape {
    position: absolute;
    opacity: 1;
}
.shape-1 {
    bottom: 0;
    right: 0;
    -webkit-animation: zoom1 4s infinite linear;
    animation: zoom1 4s infinite linear;
}
.shape-2 {
    top: 40px;
    right: 40px;
    -webkit-animation: moveupdown1 3s infinite linear;
    animation: moveupdown1 3s infinite linear;
}
.shape-3 {
    top: 3%;
    right: 0;
    -webkit-animation: moveleftright1 3s infinite linear;
    animation: moveleftright1 3s infinite linear;
}
.shape-4 {
    position: absolute;
    top: 5%;
    left: 3%;
    -webkit-animation: moveupdown1 4s infinite linear;
    animation: moveupdown1 4s infinite linear;
}
.shape-5 {
    z-index: 1;
    -webkit-animation: circle2 2.2s infinite linear;
    animation: circle2 2.2s infinite linear;
}
@keyframes circle2 {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
@keyframes moveupdown1 {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(10px);
    }
    100% {
        transform: translateY(0px);
    }
}
@keyframes zoom1 {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes moveleftright1 {
    0% {
        transform: translateX(0px);
    }
    50% {
        transform: translateX(10px);
    }
    100% {
        transform: translateX(0px);
    }
}


.dance3 {
    -webkit-animation: dance3 8s alternate infinite;
    animation: dance3 8s alternate infinite;
}

@keyframes dance3 {
    0% {
        -webkit-transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

/*----- animation section end -----*/


.happy-client-shape .shape-5 {
    top: 40px;
    left: 230px;
}
.happy-client-shape .shape-2.left {
    bottom: 40px;
    left: 40px;
    top: auto;
}
.service-shape .shape-2.left{
    left: 60px;
    top: 60px;
}
.service-shape .dance3 {
    position: absolute;
    bottom: 0;
    right: 4%;
}

.working-process-section .shape-4 {
    top: 18%;
    left: 5%;
}
.working-process-section .shape-3 {
    top: 18%;
    right: 5%;
}
.about_area .shape-3 {
    top: 5%;
    right: 5%;
}
.about_area .shape-4 {
    bottom: 5%;
    right: 3%;
    top: auto;
    left: auto;
}
.about_shape1 {
    position: absolute;
    bottom: 3%;
    left: 1%;
    z-index: -1;
}
.dance {
    -webkit-animation: dance 2s alternate infinite;
    animation: dance 2s alternate infinite;
}

@keyframes dance {
    0% {
        -webkit-transform: scale(0.2);
    }

    100% {
        -webkit-transform: scale(1);
    }
}
.portfolio-section .shape-5 {
    left: 10%;
    width: 40px;
}

.portfolio-section .shape-2 {
    right: 0;
    top: -30px;
}
.portfolio-section .shape-2 img {
    height: 250px;
}