#finalMessage {
    position: absolute;
    margin: 0;
    padding: 0;
    left: 0;
    top: 0;
    z-index: 20;
    width: 100%;
    height: 100%;
    background-image: url('../img/dark_overlay.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    display: flex;
}

    #final-message-top {
        max-width: 90vmin;
        margin-bottom: 5vmin;
        position: relative;
        width: 100%;
        height: 22vmin;
    }

    #final-message-top div {
        font-size: 3vmin;
        overflow-x: hidden;
        position: absolute;
        left: 0;
        top: 0;
    }

    #final-message-bottom {
        font-size: 3vmin;
        max-width: 90vmin;
        color: #00FFFF;
        width: 100%;
    }

        #final-message-top.continue {
            top: 50%;
            left: 50%;
            position: absolute;
            transform: translate(-50%, -50%);
            width: 33vmin;
            height: 4vmin;
        }

            #final-message-top.continue .r,
            #final-message-top.continue .g,
            #final-message-top.continue .b {
                position: absolute;
            }

    .text, .text > * {
    }
    .text > * {
      -webkit-animation: giggle 2s ease infinite;
              animation: giggle 2s ease infinite;
      mix-blend-mode: difference;
    }

    .text .r {
      color: #f00;
      margin-left: -0.5px;
    }
    .text .g {
      color: #0f0;
      -webkit-animation-delay: -0.67s;
              animation-delay: -0.67s;
    }
    .text .b {
      color: #00f;
      -webkit-animation-delay: -0.33s;
              animation-delay: -0.33s;
      margin-left: 0.5px;
    }

    @-webkit-keyframes giggle {
      0%, 100% {
        -webkit-transform: translateY(-2px);
                transform: translateY(-2px);
      }
      50% {
        -webkit-transform: translateY(2px);
                transform: translateY(2px);
      }
    }

    @keyframes giggle {
      0%, 100% {
        -webkit-transform: translateY(-2px);
                transform: translateY(-2px);
      }
      50% {
        -webkit-transform: translateY(2px);
                transform: translateY(2px);
      }
    }
    @-webkit-keyframes lines {
      0% {
        background-position: 0px 0px;
      }
      100% {
        background-position: 0px 25px;
      }
    }
    @keyframes lines {
      0% {
        background-position: 0px 0px;
      }
      100% {
        background-position: 0px 25px;
      }
    }

@media(max-width: 800px), (max-height: 800px) {
    #final-message-top {
        margin: 5vmin;
        width: calc(100% - 10vmin);
        height: calc(100% - 10vmin);
    }

        #final-message-top.continue {
            width: 55vmin;
        }

        #final-message-top div {
            font-size: 5vmin;
            height: auto;
        }

        #final-message-top.continue {
            font-size: 6vmin;
        }
}