/* @(#)$Id */

/* If this works, credit goes to https://www.paulirish.com/2012/box-sizing-border-box-ftw/ */
/* apply a natural box layout model to all elements, but allowing components to change */
html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}


@media (prefers-color-scheme: no-preference) {
  body { 
    background-color:	inherit;
    color:		inherit;
  }
  img.cz {
    filter:		invert(0%);
  }
  a:link    { color:	inherit; } /* unvisited links */
  a:visited { color:	inherit; } /* visited links   */
  a:hover   { color:	inherit; } /* user hovers     */
  a:active  { color:	inherit; } /* active links    */
}

@media (prefers-color-scheme: dark) {
  body { 
    background-color:	#000000;
    color:		#FFB000;
  }
  img.cz {
    /* https://codepen.io/sosuke/pen/Pjoqqp */
    filter:		invert(77%) sepia(28%) saturate(4178%) hue-rotate(357deg) brightness(98%) contrast(108%);
  }
  a:link    { color:	inherit; } /* unvisited links */
  a:visited { color:	inherit; } /* visited links   */
  a:hover   { color:	inherit; } /* user hovers     */
  a:active  { color:	inherit; } /* active links    */
}

@media (prefers-color-scheme: light) {
  body { 
    background-color:	#FFB000;
    color:		#000000;
  }
  img.cz {
    filter:		invert(0%);
  }
  a:link    { color:	inherit; } /* unvisited links */
  a:visited { color:	inherit; } /* visited links   */
  a:hover   { color:	inherit; } /* user hovers     */
  a:active  { color:	inherit; } /* active links    */
}

body {
  font-family: "Lucida Console", Monaco, monospace;
}


h1 { 
/*  font-family: "Lucida Console", Monaco, monospace; */
  font-size:   large;
  font-weight: normal 
}

p {
/*  font-family: "Lucida Console", Monaco, monospace */
}

p.center {
  text-align: center;
}

p.small {
  font-size: small;
}

img.cz {
  width: 60%;
  max-width: 400px;
}

li {
  font-family: "Lucida Console", Monaco, monospace
}