/* Archipelago Logo */
.circles {
    position: relative;
    width: 200px;
    height: 200px;
    /* animation: spin 30s ease both; */
}

.circle {
    position: absolute;
    width: 5rem;
    height: 5rem;
    border-radius: 100%;
    border: 0.6rem solid #e5e5f7;
    transform: translateX(-50%);
    /* animation: graviton 30s ease both; */
}

.circle:first-of-type {
    top: 50%;
    left: 50%;
    background: #D9A07D;
    z-index: 5;
}

.circle:nth-of-type(2) {
    top: 40%;
    left: 30%;
    background: #767EBD;
    z-index: 4;
}

.circle:nth-of-type(3) {
    top: 40%;
    left: 70%;
    background: #CA94C2;
    z-index: 4;
}

.circle:nth-of-type(4) {
    top: 24%;
    left: 30%;
    background: #EEE391;
    z-index: 3;
}

.circle:nth-of-type(5) {
    top: 24%;
    left: 70%;
    background: #75C275;
    z-index: 3;
}

.circle:nth-of-type(6) {
    top: 12%;
    left: 50%;
    background: #C97682;
    z-index: 2;
}