@font-face {
    font-family: eka;
    src: url(fontit/SPACESUI.TTF);
}
@font-face {
    font-family:toka ;
    src: url(fontit/RubikBurned-Regular.ttf);
}
@font-face {
    font-family:kolmas ;
    src: url(fontit/Diplomata/Diplomata-Regular.ttf);
}
@font-face {
    font-family:neljas ;
    src: url(fontit/Rubik_Glitch/RubikGlitch-Regular.ttf);
}
       @keyframes text-flash {
    0%, 50%, 100% { opacity: 1; }
    25%, 75% { opacity: 0; }
}
@keyframes text-rotate {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes text-wobble {
    0% { transform: translateX(0%); }
    15% { transform: translateX(-25px) rotate(-5deg); }
    30% { transform: translateX(20px) rotate(3deg); }
    45% { transform: translateX(-15px) rotate(-3deg); }
    60% { transform: translateX(10px) rotate(2deg); }
    75% { transform: translateX(-5px) rotate(-1deg); }
    100% { transform: translateX(0%); }
}
@keyframes text-rubber {
    0% { transform: scale(1); }
    30% { transform: scaleX(1.25) scaleY(0.75); }
    40% { transform: scaleX(0.75) scaleY(1.25); }
    50% { transform: scaleX(1.15) scaleY(0.85); }
    65% { transform: scaleX(0.95) scaleY(1.05); }
    75% { transform: scaleX(1.05) scaleY(0.95); }
    100% { transform: scale(1); }
}
body {
text-align: center;
      background: url(neebula.jpg);
      background-size: cover;
      font-size: 140px;
      min-height: 100vh;
      margin: 0;
      padding: 1px;
      box-sizing: border-box;
}

.eka {font-family: eka;
      color: #F0422B;
      margin-top: 150px;
      margin-bottom: 50px;
    text-shadow:7px 20px 3px #c91515;
letter-spacing: 20px;

    animation: text-rotate 1s linear infinite;
    animation-delay: 0s;


}

.toka {
    font-family: toka;
      line-height:1em;
color:#851eb8;
font-weight:normal;
font-size:115px;
text-shadow:0px 0px 0 rgb(170, 14, 14),-1px 1px 0 rgb(108,5,159),-2px 2px 0 rgb(95,-8,146),-3px 3px 0 rgb(82,-21,133),-4px 4px 0 rgb(69,-34,120),-5px 5px 0 rgb(57,-46,108),-6px 6px 0 rgb(44,-59,95),-7px 7px 0 rgb(31,-72,82),-8px 8px 0 rgb(18,-85,69),-9px 9px 0 rgb(6,-97,57),-10px 10px 0 rgb(-7,-110,44),-11px 11px 0 rgb(-20,-123,31),-12px 12px 0 rgb(-33,-136,18),-13px 13px 0 rgb(-46,-149,5),-14px 14px 0 rgb(-58,-161,-7),-15px 15px 0 rgb(-71,-174,-20),-16px 16px 0 rgb(-84,-187,-33),-17px 17px 0 rgb(-97,-200,-46),-18px 18px 0 rgb(-109,-212,-58),-19px 19px 0 rgb(-122,-225,-71), -20px 20px 0 rgb(-135,-238,-84),-21px 21px 20px rgba(0,0,0,1),-21px 21px 1px rgba(0,0,0,0.5),0px 0px 20px rgba(0,0,0,.2);
      margin-top: 0px;
      margin-bottom: -60px;
    letter-spacing: 50px;
     animation: text-rubber 1.8s ease-out infinite;
    animation-delay: 0s;


}

.kolmas {
    font-family: kolmas;
      color: #e7d97e;
      margin-top: 0px;
      margin-bottom: 0px;
    text-shadow:7px 20px 10px #ff00d4;
letter-spacing: 40px;
animation: text-wobble 4s ease-in-out infinite;
    animation-delay: 0s;

}

    .neljas{
 font-family: neljas;
      color: #00F07B;
      margin-top: -100px;
      margin-bottom: 20px;
       text-shadow:7px 20px 10px #3a04ff4b;
     animation: text-flash 3s linear infinite;
    animation-delay: 0s;
    }