[class^="col-"] {
    z-index: 999;
}

@keyframes move {
    100% {
        transform: translate3d(0, 0, 1px) rotate(360deg);
    }
}

.background {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    background: #ffffff;
    overflow: hidden;
}

.background span {
    width: 44vmin;
    height: 44vmin;
    border-radius: 44vmin;
    backface-visibility: hidden;
    position: absolute;
    animation: move;
    animation-duration: 45;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}


.background span:nth-child(0) {
    color: #a6f5f2;
    top: 7%;
    left: 83%;
    animation-duration: 30s;
    animation-delay: -26s;
    transform-origin: -11vw 24vh;
    box-shadow: 88vmin 0 11.145951478852263vmin currentColor;
}
.background span:nth-child(1) {
    color: #a6f5f2;
    top: 10%;
    left: 33%;
    animation-duration: 49s;
    animation-delay: -40s;
    transform-origin: -13vw -8vh;
    box-shadow: 88vmin 0 11.788293322113248vmin currentColor;
}
.background span:nth-child(2) {
    color: #a6f5f2;
    top: 64%;
    left: 70%;
    animation-duration: 11s;
    animation-delay: -24s;
    transform-origin: -9vw -20vh;
    box-shadow: -88vmin 0 11.481030755856972vmin currentColor;
}
.background span:nth-child(3) {
    color: #a6f5f2;
    top: 11%;
    left: 33%;
    animation-duration: 27s;
    animation-delay: -8s;
    transform-origin: -14vw -15vh;
    box-shadow: 88vmin 0 11.50709443669365vmin currentColor;
}
.background span:nth-child(4) {
    color: #a6f5f2;
    top: 94%;
    left: 15%;
    animation-duration: 21s;
    animation-delay: -14s;
    transform-origin: -9vw 12vh;
    box-shadow: 88vmin 0 11.171541306557563vmin currentColor;
}
.background span:nth-child(5) {
    color: #c0ff7a;
    top: 19%;
    left: 96%;
    animation-duration: 40s;
    animation-delay: -11s;
    transform-origin: -24vw -22vh;
    box-shadow: 88vmin 0 11.223245360296888vmin currentColor;
}
.background span:nth-child(6) {
    color: #c0d8f2;
    top: 69%;
    left: 81%;
    animation-duration: 46s;
    animation-delay: -43s;
    transform-origin: 17vw -10vh;
    box-shadow: -88vmin 0 11.229429098340015vmin currentColor;
}
.background span:nth-child(7) {
    color: #c0ff7a;
    top: 5%;
    left: 74%;
    animation-duration: 27s;
    animation-delay: -46s;
    transform-origin: -11vw -3vh;
    box-shadow: 88vmin 0 11.572785087983872vmin currentColor;
}
.background span:nth-child(8) {
    color: #c0d8f2;
    top: 94%;
    left: 35%;
    animation-duration: 34s;
    animation-delay: -17s;
    transform-origin: 18vw -24vh;
    box-shadow: 88vmin 0 11.321582290326397vmin currentColor;
}
.background span:nth-child(9) {
    color: #a6f5f2;
    top: 33%;
    left: 89%;
    animation-duration: 17s;
    animation-delay: -42s;
    transform-origin: 13vw -9vh;
    box-shadow: 88vmin 0 11.155669545368921vmin currentColor;
}
.background span:nth-child(10) {
    color: #c0d8f2;
    top: 96%;
    left: 93%;
    animation-duration: 25s;
    animation-delay: -47s;
    transform-origin: -17vw -9vh;
    box-shadow: 88vmin 0 11.407208234557794vmin currentColor;
}
.background span:nth-child(11) {
    color: #c0ff7a;
    top: 58%;
    left: 73%;
    animation-duration: 47s;
    animation-delay: -18s;
    transform-origin: -19vw 9vh;
    box-shadow: -88vmin 0 11.354509210149503vmin currentColor;
}
.background span:nth-child(12) {
    color: #a6f5f2;
    top: 93%;
    left: 97%;
    animation-duration: 6s;
    animation-delay: -30s;
    transform-origin: -6vw 2vh;
    box-shadow: -88vmin 0 11.098642476973541vmin currentColor;
}
.background span:nth-child(13) {
    color: #a6f5f2;
    top: 98%;
    left: 65%;
    animation-duration: 54s;
    animation-delay: -50s;
    transform-origin: -19vw -24vh;
    box-shadow: 88vmin 0 11.404808579598102vmin currentColor;
}
.background span:nth-child(14) {
    color: #c0d8f2;
    top: 61%;
    left: 37%;
    animation-duration: 44s;
    animation-delay: -40s;
    transform-origin: 22vw -14vh;
    box-shadow: 88vmin 0 11.707912984804937vmin currentColor;
}
.background span:nth-child(15) {
    color: #c0d8f2;
    top: 5%;
    left: 24%;
    animation-duration: 36s;
    animation-delay: -3s;
    transform-origin: 5vw -20vh;
    box-shadow: 88vmin 0 11.114550634768543vmin currentColor;
}
.background span:nth-child(16) {
    color: #a6f5f2;
    top: 71%;
    left: 79%;
    animation-duration: 26s;
    animation-delay: -48s;
    transform-origin: -13vw 1vh;
    box-shadow: 88vmin 0 11.460435964426269vmin currentColor;
}
.background span:nth-child(17) {
    color: #a6f5f2;
    top: 67%;
    left: 11%;
    animation-duration: 7s;
    animation-delay: -26s;
    transform-origin: 25vw -17vh;
    box-shadow: -88vmin 0 11.162807703439269vmin currentColor;
}
.background span:nth-child(18) {
    color: #c0ff7a;
    top: 80%;
    left: 38%;
    animation-duration: 49s;
    animation-delay: -11s;
    transform-origin: -2vw 25vh;
    box-shadow: -88vmin 0 11.411636725157486vmin currentColor;
}
.background span:nth-child(19) {
    color: #a6f5f2;
    top: 61%;
    left: 50%;
    animation-duration: 45s;
    animation-delay: -21s;
    transform-origin: -20vw 14vh;
    box-shadow: -88vmin 0 11.108498645485469vmin currentColor;
}
.background span:nth-child(20) {
    color: #a6f5f2;
    top: 48%;
    left: 51%;
    animation-duration: 43s;
    animation-delay: -21s;
    transform-origin: 18vw -14vh;
    box-shadow: -88vmin 0 11.812598898183715vmin currentColor;
}
.background span:nth-child(21) {
    color: #c0ff7a;
    top: 5%;
    left: 3%;
    animation-duration: 21s;
    animation-delay: -9s;
    transform-origin: -21vw 0vh;
    box-shadow: 88vmin 0 11.384579179458978vmin currentColor;
}

.btn-main {
    background-color: #425c79;
    font-size: 24px;
    font-weight: bold;
    text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    color: #fff;
    border-radius: 50px 50px 50px 50px;
    padding: 15px 30px 15px 30px;
}

.btn-main:hover,
.btn-main:focus {
    background-color: #2c3e50;
    color: #fff;
    text-decoration: none;
}