:root {
  /* THESE NEED TO BE HEX */
  --main-text-color: #333;
  --main-elements-color: #ccc;
  --main-elements-active-color: #666;
  --main-elements-disabled-color: #dedede;

  --main-background-color: #fff;
  --main-disabled-color: #ddd;

  --main-text-color-invert: #fff;
  --main-background-color-invert: #333;

  --main-decoration-light-color: #ddd;
}

@media (prefers-color-scheme: dark) {
  :root {
    /* THESE NEED TO BE HEX */
    --main-text-color: #ddd;
    --main-elements-color: #454545;
    --main-elements-active-color: #888;
    --main-elements-disabled-color: #343434;

    --main-background-color: #222;
    --main-disabled-color: #333;

    --main-text-color-invert: #222;
    --main-background-color-invert: #bbb;

    --main-decoration-light-color: #444;

    img {
      opacity: .8;
    }
  }
}

/* @media only screen and (max-aspect-ratio: 7/10) { /* Portrait Including Edge Case */
/* @media only screen and (min-aspect-ratio: 7/10) { /* Landscape Including Edge Case */

.imagePreloader{
  width: 0px;
  height: 0px;
  display: inline;
  overflow-x: hidden;
}
.imagePreloader img{
  width: 0px;
  height: 0px;
  overflow-x: hidden;
}