html, body {
height: 100%;
width: 100%;
}
body{
background-color: black;
}
.laatikko {
height: 100%;
width: 100%;
position: relative;
}
/*.box{
font-size: 50px;
font-weight: bold;
opacity: 0;
position: absolute;
top: 50%;
width: 100%;
text-align: center;
font-family: tahoma, geneva;
color: white;
letter-spacing: 5px;
}
.b1{
animation: ani1 11s infinite;
}
.b2{
animation: ani2 11s infinite;
}
.b3{
animation: ani3 11s infinite;
}
.b4{
animation: ani4 11s infinite;
}
@keyframes ani1{
0% {opacity: 0;}
10% {opacity: 1;}
25% {opacity: 0;}
}
@keyframes ani2{
25% {opacity: 0;}
35% {opacity: 1;}
50% {opacity: 0;}
}
@keyframes ani3{
50% {opacity: 0;}
60% {opacity: 1;}
75% {opacity: 0;}
}
@keyframes ani4{
75% {opacity: 0;}
85% {opacity: 1;}
100% {opacity: 0;}
}*/
.pallo {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(2){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(3){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(4){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(5){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example {
0% {background-color: white; left:0%; top:0%;}
100% {background-color: white; left:0%; top:85%;}
}
.pallo:nth-child(6){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(7){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(8){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(9){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(10){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(11){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(12){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(13){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(14){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(15){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(16){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(17){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(18){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(19){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(20){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(21){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(22){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(23){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(24){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(25){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(26){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(27){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(28){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(29){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(30){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(31) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(32){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(33){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(34){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(35){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example2 {
0% {background-color: white; left:10%; top: 0%}
100% {background-color: white; left:10%; top:85%;}
}
.pallo:nth-child(36){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(37){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(38){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(39){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(40){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(41){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(42){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(43){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(44){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(45){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(46){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(47){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(48){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(49){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(50){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(51){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(52){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(53){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(54){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(55){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(56){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(57){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(58){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(59){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(60){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example2;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(61) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(62){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(63){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(64){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(65){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example3 {
0% {background-color: white; left:20%; top: 0%}
100% {background-color: white; left:20%; top:85%;}
}
.pallo:nth-child(66){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(67){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(68){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(69){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(70){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(71){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(72){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(73){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(74){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(75){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(76){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(77){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(78){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(79){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(80){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(81){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(82){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(83){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(84){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(85){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(86){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(87){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(88){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(89){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(90){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example3;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(91) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(92){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(93){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(94){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(95){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example4 {
0% {background-color: white; left:30%; top: 0%}
100% {background-color: white; left:30%; top:85%;}
}
.pallo:nth-child(96){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(97){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(98){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(99){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(100){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(101){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(102){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(103){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(104){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(105){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(106){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(107){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(108){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(109){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(110){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(111){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(112){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(113){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(114){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(115){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(116){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(117){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(118){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(119){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(120){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example4;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(121) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(122){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(123){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(124){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(125){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example5 {
0% {background-color: white; left:40%; top: 0%}
100% {background-color: white; left:40%; top:85%;}
}
.pallo:nth-child(126){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(127){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(128){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(129){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(130){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(131){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(132){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(133){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(134){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(135){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(136){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(137){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(138){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(139){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(140){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(141){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(142){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(143){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(144){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(145){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(146){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(147){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(148){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(149){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(150){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example5;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(151) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(152){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(153){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(154){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(155){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example6 {
0% {background-color: white; left:50%; top: 0%}
100% {background-color: white; left:50%; top:85%;}
}
.pallo:nth-child(156){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(157){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(158){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(159){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(160){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(161){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(162){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(163){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(164){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(165){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(166){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(167){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(168){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(169){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(170){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(171){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(172){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(173){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(174){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(175){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(176){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(177){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(178){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(179){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(180){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example6;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(181) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(182){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(183){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(184){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(185){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example7 {
0% {background-color: white; left:60%; top: 0%}
100% {background-color: white; left:60%; top:85%;}
}
.pallo:nth-child(186){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(187){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(188){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(189){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(190){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(191){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(192){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(193){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(194){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(195){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(196){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(197){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(198){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(199){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(200){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(201){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(202){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(203){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(204){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(205){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(206){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(207){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(208){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(209){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(210){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example7;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(211) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(212){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(213){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(214){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(215){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example8 {
0% {background-color: white; left:70%; top: 0%}
100% {background-color: white; left:70%; top:85%;}
}
.pallo:nth-child(216){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(217){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(218){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(219){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(220){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(221){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(222){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(223){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(224){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(225){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(226){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(227){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(228){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(229){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(230){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(231){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(232){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(233){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(234){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(235){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(236){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(237){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(238){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(239){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(240){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example8;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(241) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(242){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(243){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(244){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(245){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
@keyframes example9 {
0% {background-color: white; left:80%; top: 0%}
100% {background-color: white; left:80%; top:85%;}
}
.pallo:nth-child(246){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(247){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(248){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(249){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(250){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(251){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(252){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(253){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(254){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(255){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(256){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(257){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(258){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(259){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(260){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(261){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(262){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(263){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(264){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(265){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(266){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(267){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(268){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(269){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(270){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example9;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
.pallo:nth-child(271) {
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
}
.pallo:nth-child(272){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.2s;
}
.pallo:nth-child(273){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.4s;
}
.pallo:nth-child(274){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.6s;
}
.pallo:nth-child(275){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 0.8s;
}
.pallo:nth-child(276){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 1.8s;
}
.pallo:nth-child(277){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2s;
}
.pallo:nth-child(278){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.2s;
}
.pallo:nth-child(279){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.4s;
}
.pallo:nth-child(280){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 2.6s;
}
.pallo:nth-child(281){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.6s;
}
.pallo:nth-child(282){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 3.8s;
}
.pallo:nth-child(283){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4s;
}
.pallo:nth-child(284){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.2s;
}
.pallo:nth-child(285){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 4.4s;
}
.pallo:nth-child(286){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.4s;
}
.pallo:nth-child(287){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.6s;
}
.pallo:nth-child(288){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 5.8s;
}
.pallo:nth-child(289){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6s;
}
.pallo:nth-child(290){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 6.2s;
}
.pallo:nth-child(291){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.2s;
}
.pallo:nth-child(292){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.4s;
}
.pallo:nth-child(293){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.6s;
}
.pallo:nth-child(294){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 7.8s;
}
.pallo:nth-child(295){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 8s;
}
.pallo:nth-child(296){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9s;
}
.pallo:nth-child(297){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.2s;
}
.pallo:nth-child(298){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.4s;
}
.pallo:nth-child(299){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.6s;
}
.pallo:nth-child(300){
width: 90px;
height: 90px;
background-color: white;
position: absolute;
animation-name: example10;
animation-duration: 4s;
animation-iteration-count: infinite;
animation-direction: alternate;
border-radius: 100%;
animation-delay: 9.8s;
}
@keyframes example10 {
0% {background-color: white; left:90%; top: 0%}
100% {background-color: white; left:90%; top:85%;}
}
.linkit{
display: flex;
width: 100vw;
height: 100vh;
position: absolute;
top: 0;
left: 0;
}
.linkki{
flex: 1;
}
.linkki:nth-child(1){
cursor: w-resize;
}
.linkki:nth-child(2){
cursor: e-resize;
}