style.css

html, body {
    height: 100%;
}
.container {
    min-height: 100%;
    /* For the footer */
    margin-bottom: -98px;
    padding-bottom: 98px;
}

body {
    font-family: 'Roboto Mono', serif;
    background-color: #dddddd;
}

.github-fork-banner {
    position: absolute;
    top: 0;
    right: 0;
    border: 0;
}

h1 {
    font-family: 'Roboto Slab', serif;
    font-size: 400%;
    color: #52b21a;
    padding: 20px;
}

.fa-copy {
    color: white;
}

pre {
    margin-top: 10px;
}

footer {
    background-color: #ffffff;
    text-align: center;
    height: 78px;
    padding: 15px;
    margin-top: 20px;
}

.seedScript {
    border-radius: 8px;
}

/* CSS for Dark Mode */

.dark {
    background-color: #151921;
    color: #e6e6e6;
    border-color: #e6e6e6;
}
.dark footer {
    background-color: #000000;
}

/* CSS for Toast Message */
.toastContainer {
    margin: 0;
    display: grid;
    position: absolute;
    justify-items: end;
    top: -2rem;
    right: -0.75rem;
    gap: 1rem;
    background-color: #52b21a;
    padding: 0.5rem 1rem;
    border-radius: 15px;
    animation: toastIt 3000ms cubic-bezier(0.785, 0.135, 0.15, 0.86) forwards;
  }

  .toastContainer p {
    padding: 0;
    margin: 0;
  }

  .toastContainer_message {
    font-size: 0.5rem;
    font-weight: bold;
    line-height: 1;
  }

  @keyframes toastIt {
    0%,
    100% {
      opacity: 0;
    }
    10%,
    90% {
      opacity: 1;
    }
  }