
    /* animation */
    .serviceboxanimation{
        position:absolute;
        left:100px;
        /* z-index: 200; */
        width:70px;
        height:70px;
        border-radius: 3px;
    }

    .serviceboxanimation:nth-child(odd){
        border:2px solid #01a0e1;

    }

    .serviceboxanimation:nth-child(even){
        border:2px solid #f36523;
    }

    .serviceboxanimation:nth-child(1){
        top: 20%;
        left:10%;
        animation: serviceanimation 6s linear infinite;

    }
    .serviceboxanimation:nth-child(2){
        top: 30%;
        left:15%;
        animation: serviceanimation 7s linear infinite;

    }
    .serviceboxanimation:nth-child(3){
        top: 70%;
        left:5%;
        animation: serviceanimation 11s linear infinite;

    }
    .serviceboxanimation:nth-child(4){
        top: 80%;
        left:10%;
        animation: serviceanimation 9s linear infinite;

    }
    .serviceboxanimation:nth-child(5){
        top: 20%;
        left:80%;
        animation: serviceanimation 8s linear infinite;

    }
    .serviceboxanimation:nth-child(6){
        top: 40%;
        left:60%;
        animation: serviceanimation 6s linear infinite;

    }
    .serviceboxanimation:nth-child(7){
        top: 50%;
        left:90%;
        animation: serviceanimation 14s linear infinite;

    }
    .serviceboxanimation:nth-child(8){
        top: 60%;
        left:110%;
        border:2px solid red;
        animation: serviceanimation 12s linear infinite;

    }
    .serviceboxanimation:nth-child(9){
        top: 80%;
        left:55%;
        animation: serviceanimation 11s linear infinite;

    }
    .serviceboxanimation:nth-child(10){
        top: 25%;
        left:55%;
        animation: serviceanimation 6s linear infinite;

    }
    .serviceboxanimation:nth-child(11){
        top: 30%;
        left:60%;
        animation: serviceanimation 7s linear infinite;

    }

    .serviceboxanimation:nth-child(12){
        top: 65%;
        left:40%;
        animation: serviceanimation 5s linear infinite;

    }

    .serviceboxanimation:nth-child(13){
        top: 60%;
        left:75%;
        animation: serviceanimation 8s linear infinite;

    }

    .serviceboxanimation:nth-child(14){
        top: 63%;
        left:69%;
        animation: serviceanimation 6s linear infinite;

    }

    .serviceboxanimation:nth-child(15){
        top: 14%;
        left:18%;
        animation: serviceanimation 4s linear infinite;

    }

    .serviceboxanimation:nth-child(16){
        top: 2%;
        left:11%;
        animation: serviceanimation 10s linear infinite;

    }

    @keyframes serviceanimation {
    0% {
        transform: scale(0.5) translateY(0) rotate(70deg);
    }
    100% {
        transform: scale(1.3) translateY(-100px) rotate(260deg);
    }
    }
