@font-face {
    font-family: "SFUIDisplay";
    src: url("fonts/SFUIDisplay/SFUIDisplay-Light.ttf");
  }

h1 {
    font-family: "SFUIDisplay";
    font-size: 10vh;
    color: #f8f8f8;

    text-shadow: 3px 10px 14px -10px rgba(0,0,0,0.75);
}

.text {
    font-size: 3.5vh;
    font-weight: bold;
    color: #212121;

    text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);
}

.centered {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.oval {
    height: 30vh;
    width: 45vw;
    border-radius: 50%;

    background-color: #eeeeee;
    opacity: 100;

    box-shadow: 3px 10px 14px -10px rgba(0,0,0,0.75);
}

.grain {
    background: rgba(0, 0, 0, 0.2);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.27;

    background-image: url("assets/svg/grain_2.svg");
}

.gray_opacity {
    background: rgba(78, 78, 78, 0.2);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.3;
}

.rainbow { 
    height: 100%;
    width: 100%;
    left:0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
  background: linear-gradient(124deg, #ff2400, #e81d1d, #e8b71d, #e3e81d, #1de840, #1ddde8, #2b1de8, #dd00f3, #dd00f3);
  background-size: 1800% 1800%;
  
  -webkit-animation: rainbow 22s ease infinite;
  -z-animation: rainbow 22s ease infinite;
  -o-animation: rainbow 22s ease infinite;
    animation: rainbow 22s ease infinite;}
  
  @-webkit-keyframes rainbow {
      0%{background-position:0% 82%}
      50%{background-position:100% 19%}
      100%{background-position:0% 82%}
  }
  @-moz-keyframes rainbow {
      0%{background-position:0% 82%}
      50%{background-position:100% 19%}
      100%{background-position:0% 82%}
  }
  @-o-keyframes rainbow {
      0%{background-position:0% 82%}
      50%{background-position:100% 19%}
      100%{background-position:0% 82%}
  }
  @keyframes rainbow { 
      0%{background-position:0% 82%}
      50%{background-position:100% 19%}
      100%{background-position:0% 82%}
  }