:root {
          --bg-color-light: #ffffff;
          --bg-color-dark: #121212;
          --text-color-light: #000000;
          --text-color-dark: #ffffff;
          --icon-color-light: #000000;
          --icon-color-dark: #ffffff;
        }

        body {
          background-color: var(--bg-color-light);
          color: var(--text-color-light);
          transition: background-color 0.3s, color 0.3s;
        }

        body.dark-mode {
          background-color: var(--bg-color-dark);
          color: var(--text-color-dark);
        }

        .theme-switch {
          
          top: 80%;
          right: 10px;
          width: 50px;
          height: 50px;
          border: none;
          border-radius: 50%;
          cursor: pointer;
          outline: none;
        }

        .theme-switch svg {
          fill: var(--icon-color-light);
          transition: fill 0.3s;
        }

        .theme-switch.dark-mode svg {
          fill: var(--icon-color-dark);
        }

        small {
          font-size: 15px;
          color: white;
        }

        .h1 {
          color: black;
          font-family: 'Pixelify Sans', cursiva;
          text-transform: uppercase;
        }

        p {
          font-size: 15px;
        }