RSS News | Dark Mode draft

darkmode.css

 p {
  color:white;
    }

    a {
      text-decoration: none;
      text-transform: uppercase;
      color: #76daff;
    }

    @font-face {
      font-family: 'Telefon Black';
      font-weight: 400;
      src: url('https://raykooyenga.com/fonts/telefon-black.temp.woff2') format("woff2");
    }

    html,
    body,
    div,
    article,
    p,
    p.author,
    p.date,
    h1,
    h2,
    #banner,
    .rssPost,
    * {
      color: white !important;
      background-image: none;
      background-color: #131417 !important;
      -webkit-over-scrolling: touch;
      text-decoration: none;
      text-rendering: optimizeLegibility;
      -moz-font-smoothing: antialiased;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-family: 'Telefon Black';
      transform: translate3d(0, 0, 0);
    }

    h1,
    .h1,
    h1#feedTitle {
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      font-family: 'Telefon Black' !important;
      line-height: 1.1;
      font-size: 150px;
      font-style: bold;
      font-weight: 400;
      text-transform: none;
    }

    #banner>h2 {
      font-size: 35px;
    }

    .rssPost>h3 {
      /* this defeats dynamic sizing logic */
      font-size: 40px;
    }

    .rssPost .readMore {
      font-family: "Lato", serif;
      color: white;
    }

    .rssPost .readMore:hover {
      color: #131417 !important;
      background-color: rgb(255, 255, 255) !important;
      transition: background-color 1.2s ease-in-out;
    }

    @media (max-width: 768px) {
      .rssPost {
        flex: 1 1 95%;
        max-width: auto;
        border-bottom: 1px double var(--color-border);
      }

      h1#feedTitle {
        font-size: 84px;
      }

      h2#feedDescription {
        font-size: 24px;
      }
    }

    @media (max-width: 576px) {
      #banner h1 {
        font-size: 64px;
      }

      #banner h2 {
        font-size: 1rem;
      }

      h3 {
        font-size: 2rem;
      }

      .rssPost {
        max-width: auto;
      }
    }