.bonki-container { width: 300px; height: 150px; margin: 30px; border-bottom: 7px solid #024488; border-left: 7px dashed #024488; border-right: 7px dashed #024488; }

.bonki { display: flex; flex-direction: column; align-items: center; position: relative; animation: bonkimove 5s infinite; }

.bonki .ball { width: 26px; height: 26px; border-radius: 50%; background: #024488; }

@keyframes bonkimove { 0% { top: 0px; }
  30% { top: 127px; }
  50% { top: 10px; }
  80% { top: 127px; }
  100% { top: 0px; } }

.wonki { display: flex; flex-direction: column; align-items: center; position: relative; animation: wonkimove 5s infinite; }

.wonki .ball { width: 26px; height: 26px; border-radius: 50%; background: #034466; }

@keyframes wonkimove { 0% { right: -140px; }
  50% { right: 140px; }
  100% { right: -140px; } }

.btext { font-size: 15px; color: white; }

.bonki-container-2 { width: 300px; height: 150px; border-bottom: 7px solid #024488; border-right: 7px solid #bd1111; }

.wonki2 { display: flex; flex-direction: column; align-items: center; position: relative; animation: wonki2move 5s infinite; top: 80px; }

.wonki2 .ball { width: 26px; height: 26px; border-radius: 50%; background: #034466; animation: wonki2heavy 5s infinite; box-sizing: border-box; }

@keyframes wonki2move { 0% { right: -45px; }
  10% { right: -135px; }
  40% { right: 120px; }
  100% { right: 120px; } }

@keyframes wonki2heavy { 0% { border: 0px; }
  50% { border: 1px white solid; }
  52% { border: 0px; }
  57% { border: 0px; }
  70% { border: 0px; }
  100% { border: 0px; } }

.bonki2 { display: flex; flex-direction: column; align-items: center; position: relative; animation: bonki2move 5s infinite; top: 125px; }

.bonki2 .ball { width: 26px; height: 26px; border-radius: 50%; background: #024488; /*animation: bonki2die 5s infinite;*/ }

@keyframes bonki2move { 0% { right: 70px; }
  22.5% { right: 70px; }
  70% { right: 1600px;
    border: 2px black; }
  100% { right: 1600px;
    border: 0px; } }

@keyframes bonki2die { 0% { display: initial; }
  50% { display: none; }
  70% { display: initial; }
  100% { display: initial; } }

/*# sourceMappingURL=bonki.css.map */