.component-style--style-1 {
  --color--section--heading: black;
  --color--text: black;
  --color--text--muted: #cccccc;
  --color--text--highlight: #ee2323;
  --color--link: #cccccc;
  --color--background: #121212;
  --color--background--overlay: #000000;
  --color--background--overlay--opacity: 0.2;


  background-image: radial-gradient(ellipse, #FF896B 0%, #FAC0FA 90% );


  /**
  Cards displayed in a dark style need to have a light background and dark text
  to stand out against the dark background.
   */

  .card {
    --color--text: black;
    --color--link: #0000EE;
    --color--background: lightgray;
    --color--background--overlay: #ffffff;

    --color--card--text: black;
    --color--card--background: var(--color--rootid-almost-white);
    --color--card--link: var(--color--red);
    --color--card--heading: var(--color--blue);
  }

  .card--no-background {
    --color--text: white;
    --color--link: #cccccc;
    --color--background: transparent;
    --color--background--overlay: transparent;
    --color--background--overlay--opacity: 0;

    --color--card--text: white;
    --color--card--background: trasnsparent;
    --color--card--link: var(--color--red);
    --color--card--heading: white;
  }
}