rainbow theme v3.0 (nitro type) by ethan122121

/* ==UserStyle==
@name           NitroType Rainbow Style
@namespace      github.com/openstyles/st1111s
@version        1.0.0
@description    A colorful rainbow-themed userstyle for NitroType with transparent elements and animations
@author         Me
==/UserStyle== */

@-moz-document domain("nitrotype.com") {

  /* Background */
  html {
    background: linear-gradient(135deg, #ff0000, #ff7f00, #ffff00, #00ff00, #0000ff, #4b0082, #9400d3);
    background-size: 400% 400%;
    animation: rainbowBG 15s ease infinite;
  }

  body {
    background: none;
  }

  /* Dashboard Container Styling */
  .dash-copyContainer {
    background: rgba(0, 0, 0, 0.5); /* Semi-transparent */
    box-shadow: 0 1px 15px rgba(0, 0, 0, 0.6);
    border-radius: 10px;
    padding: 20px;
  }

  /* Text Styling */
  .dash-copy, .raceText {
    font-size: 32px;
    background: linear-gradient(90deg, #ff0000, #ff7f00, #00ff00, #0000ff, #4b0082, #9400d3);
    background-size: 200% 200%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: rainbowText 30s linear infinite;
    text-shadow: 0 0 3px rgba(255, 255, 255, 0.8), 0 0 5px rgba(0, 0, 0, 0.6);
  }

  .raceText {
    font-size: 24px;
    background-size: 300% 300%;
    text-shadow: 0 0 2px rgba(255, 255, 255, 0.7), 0 0 4px rgba(0, 0, 0, 0.5);
  }

  /* Typing Area */
  .raceText-container, .raceContainer {
    background: rgba(0, 0, 0, 0.3); /* Transparent typing area */
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  }

  /* Garage Area */
  .garage-container {
    background: rgba(0, 0, 0, 0.4); /* Transparent garage */
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.7);
  }

  /* Button Styling */
  button, .btn {
    background: linear-gradient(90deg, #ff0000, #ff7f00, #00ff00, #0000ff, #4b0082, #9400d3);
    background-size: 400% 400%;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    border-radius: 5px;
    cursor: pointer;
    animation: rainbowBG 8s ease infinite;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.5);
  }

  button:hover, .btn:hover {
    transform: scale(1.1);
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.8);
  }

  /* Notification Styling */
  .growl--a {
    background: linear-gradient(45deg, #ff0000, #00ff00, #0000ff);
    background-size: 200% 200%;
    animation: rainbowBG 10s ease infinite;
    color: #ffffff;
  }

  /* Close Button Styling */
  .raceResults-close.raceResults-close--minimizer {
    background: linear-gradient(90deg, #ff00ff, #9400d3);
  }

  /* Animations */
  @keyframes rainbowBG {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }

  @keyframes rainbowText {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
  }
}