p { margin:5px }

body {
      margin: 0;
      padding: 0;
    }
    
.full-screen-cover {
      position: fixed;
      top: 0;
      left: 0;
      width: 100vw;
      height: 100vh;
      background-color: rgba(255, 255, 255, 1);
      z-index: 9999;

      display: none;
      justify-content: center;
      align-items: center;
      color: white;
      font-family: Arial, sans-serif;
    }

.rank2 {
  color: blue;
  text-align: center;
}

.rank3 {
  color: red;
  text-align: center;
  text-decoration: underline;
}

.rank4 {
  color: white;
  text-align: center;
  font-style: italic;
  font-weight: 600;
  text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
}

.rank5 {
  color: #fff;
  text-align: center;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: glow 1s ease-in-out infinite alternate;
  font-weight: 900;
}

.rank6 {
  color: red;
  -webkit-animation: rainbow 6s linear infinite alternate;
  font-weight: 700;
}

.rank7 {
  animation: wiggle 1s steps(1) infinite, rainbow 0.3s steps(1) infinite;
  -webkit-animation: wiggle 1s steps(1) infinite, rainbow 0.3s steps(1) infinite;
  text-shadow: 0 0 10px #000000, 0 0 20px #000000, 0 0 30px #000000;
  font-size: 80px;
  font-family: Georgia;
  font-weight: 900;
}

.rank7compact {
  animation: wiggle 1s steps(1) infinite, rainbow 0.3s steps(1) infinite;
  -webkit-animation: wiggle 1s steps(1) infinite, rainbow 0.3s steps(1) infinite;
  text-shadow: 0 0 10px #000000, 0 0 20px #000000, 0 0 30px #000000;
  font-family: Georgia;
  font-weight: 900;
}

.rank7offdaperc {
  color: white;
  font-size: 50px;
  font-family: Georgia;
  font-weight: 900;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 5px #000000, 0 0 10px #000000, 0 0 15px #000000, 0 0 20px #000000, 0 0 25px #000000, 0 0 30px #000000, 0 0 35px #000000;
    color: #fff
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #fff, 0 0 25px #fff, 0 0 30px #fff, 0 0 35px #fff;
    color: #000000
  }
}
@-webkit-keyframes wiggle {
  0% { transform: rotate(-3deg) translate(2px, -3px); }
  5% { transform: rotate(6deg) translate(6px, -10px); }
  10% { transform: rotate(8deg) translate(8px, -5px); }
  15% { transform: rotate(-7deg) translate(0px, 0px); }
  20% { transform: rotate(1deg) translate(2px, -3px); }
  25% { transform: rotate(5deg) translate(-5px, -2px); }
  30% { transform: rotate(-4deg) translate(6px, 0px); }
  35% { transform: rotate(6deg) translate(4px, 8px); }
  40% { transform: rotate(0deg) translate(-3px, -3px); }
  45% { transform: rotate(4deg) translate(5px, 7px); }
  50% { transform: rotate(5deg) translate(-4px, 6px); }
  55% { transform: rotate(1deg) translate(0px, 0px); }
  60% { transform: rotate(-3deg) translate(4px, -4px); }
  65% { transform: rotate(0deg)  translate(-4px, 4px); }
  70% { transform: rotate(-3deg) translate(7px, 7px); }
  75% { transform: rotate(6deg) translate(2px, -3px); }
  80% { transform: rotate(8deg) translate(0px, 0px); }
  85% { transform: rotate(-7deg) translate(8px, -3px); }
  90% { transform: rotate(1deg) translate(-4px, 0px); }
  95% { transform: rotate(5deg) translate(5px, -5px); }
  100% { transform: rotate(-4deg) translate(0px, 0px); }
}
@-webkit-keyframes rainbow {
  0%  {color: red;}
 20%  {color: orange;}
 40%    {color: yellow;}
 60%  {color: green;}
 80%  {color: indigo;}
 100%   {color: violet;}
}