@keyframes pulsing {
    0%   {font-size: 1.7em; }
    50%  {font-size: 1.9em; }
    100% {font-size: 1.7em; }
}

@keyframes pulsingHover {
    0%   {font-size: 1.8em; }
    50%  {font-size: 2em; }
    100% {font-size: 1.8em; }
}

@keyframes beginningAnimation {
    0%   {opacity: 0; position: relative; top: -50px}
    80%  {opacity: 0; position: relative; top: -50px}
    90%  {opacity: 1; position: relative; top: 5px}
    100% {opacity: 1; position: relative; top: 0px}
}

@keyframes slideInBottom {
    0%   {opacity: 0; position: relative; top: 0}
    50%  {opacity: 0; position: relative; top: 0}
    90%  {opacity: 1; position: relative; top: -2.2em}
    100% {opacity: 1; position: relative; top: -2em}
}

@keyframes grain {
    0%, 100% { transform:translate(0, 0) }
    10% { transform:translate(-5%, -10%) }
    20% { transform:translate(-15%, 5%) }
    30% { transform:translate(7%, -25%) }
    40% { transform:translate(-5%, 25%) }
    50% { transform:translate(-15%, 10%) }
    60% { transform:translate(15%, 0%) }
    70% { transform:translate(0%, 20%) }
    80% { transform:translate(3%, 15%) }
    90% { transform:translate(-10%, 10%) }
  }

  @keyframes GameOverScreenAnimation {
    0% {opacity: 0; top: -100px;}
    80% {opacity: 1; top: 20px;}
    100% {opacity: 1; top: 0;}
}

@keyframes BuiltUpAnimation {
    0%   {opacity: 1; z-index: 1;}
    99%   {opacity: 1; z-index: 1;}
    100% {opacity: 0; z-index: -1;}
}

@keyframes AnimationSlideOut {
    0%   {opacity: 1; transform:translate(0%, 0%) }
    99%  {opacity: 0; transform:translate(0%, -100%);  }
    100%  {opacity: 0; transform:translate(0%, -100%); display: none; }
}

@keyframes AnimationSlideIn {
    0%   {opacity: 0; transform:translate(100%, 0%);}
    99%  {opacity: 1; transform:translate(0%, 0%);  }
    100%  {opacity: 1; transform:translate(0%, 0%); z-index: 10;}
}

@keyframes AnimationSlideOutBottom {
    0%   {opacity: 1; transform:translate(0%, 0%) }
    99%  {opacity: 0; transform:translate(0%, -100%);  }
    100%  {opacity: 0; transform:translate(0%, -100%); display: none;}
}

@keyframes AnimationSlideInTop {
    0%   {opacity: 0; transform:translate(0%, -100%) }
    99%  {opacity: 1; transform:translate(0%, 0%);  }
    100%  {opacity: 1; transform:translate(0%, 0%);}
}

@keyframes changeBgColor {
    0%   {background-color: #98989e; }
    100%  {background-color: #8e8d92; }
}

@keyframes AnimationSlideInRules {
    0%   {opacity: 0; transform:translate(0%, 100%);}
    99%  {opacity: 1; transform:translate(0%, 0%);  }
    100%  {opacity: 1; transform:translate(0%, 0%); z-index: 10;}
}



/* @keyframes StartScreenAnimation {
    0%   {opacity: 0; display: none;}
    90%   {opacity: 0; display: none;}
    100% {opacity: 1; display: initial;}
} */