.mainx {
    position: relative;
    width: 500px;
    margin: 0 auto;
    /* border: 2px solid #aaa; */
    border-radius: 50%;
    height: 500px;
}

.img1 { top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; } /* Center */
.img2 { top: 10%; left: 50%; margin-left: -20px; } /* Top */
.img3 { top: 30%; left: 80%; margin-left: -20px; } /* Top Right */
.img4 { top: 50%; left: 90%; margin-top: -20px; } /* Right */
.img5 { top: 70%; left: 80%; margin-left: -20px; } /* Bottom Right */
.img6 { top: 90%; left: 50%; margin-left: -20px; } /* Bottom */
.img7 { top: 70%; left: 20%; margin-left: -20px; } /* Bottom Left */
.img8 { top: 50%; left: 10%; margin-top: -20px; } /* Left */
.img9 { top: 30%; left: 20%; margin-left: -20px; } /* Top Left */
.img10 { top: 0%; left: 50%; margin-left: -20px; } /* Top Center */
.img11 { top: 15%; left: 75%; margin-left: -20px; } /* Top Center Right */
.img12 { top: 15%; left: 25%; margin-left: -20px; } /* Top Center Left */
.img13 { top: 85%; left: 50%; margin-left: -20px; } /* Bottom Center */
.img14 { top: 85%; left: 15%; margin-left: -20px; } /* Bottom Left Center */
.img15 { top: 85%; left: 85%; margin-left: -20px; } /* Bottom Right Center */
.img16 { top: 50%; left: 0%; margin-top: -20px; } /* Far Left Center */
.img17 { top: 50%; left: 100%; margin-top: -20px; } /* Far Right Center */
.img18 { top: 25%; left: 10%; margin-left: -20px; } /* Slightly below Top Left */
.img19 { top: 25%; left: 90%; margin-left: -20px; } /* Slightly below Top Right */
.img20 { top: 75%; left: 10%; margin-left: -20px; } /* Slightly above Bottom Left */

/* .img1 {
    top: -16%;
    left: 33%;
}

.img6 {
    top: -6%;
    left: 23%;
}
.img7 {
    top: 4%;
    left: 13%;
}
.img8 {
    top: 14%;
    left: 3%;
}

.img2 {
    right: -14%;
    top: 16%;
}

.img9 {
    right: -4%;
    top: 6%;
}
.img10 {
    right: 6%;
    top: -4%;
}
.img11 {
    right: 16%;
    top: -14%;
}

.img3 {
    right: -1%;
    bottom: -5%;
}

.img12 {
    right: 9%;
    bottom: 10%;
}
.img13 {
    right: 19%;
    bottom: 25%;
}
.img14 {
    right: 29%;
    bottom: 35%;
}

.img4 {
    bottom: -7%;
    left: 2%;
}

.img15 {
    bottom: 7%;
    left: 12%;
}
.img16 {
    bottom: 17%;
    left: 22%;
}
.img17 {
    bottom: 27%;
    left: 32%;
}

.img5 {
    left: -17%;
    top: 21%;
}

.img18 {
    left: -7%;
    top: 11%;
}
.img19 {
    left: 3%;
    top: 1%;
}
.img20 {
    left: 13%;
    top: -11%;
} */

.mainx img {   
    position: absolute;
    width: 15%;
}

.mainx {
    -webkit-animation: spin1 14s infinite linear;
    -moz-animation: spin1 14s infinite linear;
    -o-animation: spin1 14s infinite linear;
    -ms-animation: spin1 14s infinite linear;
    animation: spin1 14s infinite linear;
}

.img1,
.img2,
.img3,
.img4,
.img5,
.img6,
.img7,
.img8,
.img9,
.img10,
.img11,
.img12,
.img13,
.img14,
.img15,
.img16,
.img17,
.img18,
.img19,
.img20 {
    -webkit-animation: spin2 14s infinite linear;
    -moz-animation: spin2 14s infinite linear;
    -o-animation: spin2 14s infinite linear;
    -ms-animation: spin2 14s infinite linear;
    animation: spin2 14s infinite linear;
}

@-webkit-keyframes spin1 {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes spin1 {
    0% {
        -moz-transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-o-keyframes spin1 {
    0% {
        -o-transform: rotate(0deg);
    }
    100% {
        -o-transform: rotate(360deg);
    }
}

@-ms-keyframes spin1 {
    0% {
        -ms-transform: rotate(0deg);
    }
    100% {
        -ms-transform: rotate(360deg);
    }
}

@-keyframes spin1 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes spin2 {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(-360deg);
    }
}

@-moz-keyframes spin2 {
    0% {
        -moz-transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(-360deg);
    }
}

@-o-keyframes spin2 {
    0% {
        -o-transform: rotate(0deg);
    }
    100% {
        -o-transform: rotate(-360deg);
    }
}

@-ms-keyframes spin2 {
    0% {
        -ms-transform: rotate(0deg);
    }
    100% {
        -ms-transform: rotate(-360deg);
    }
}

@-keyframes spin2 {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(-360deg);
    }
}