style.css

   1 @charset "utf-8";
   2
   3 /* Variables for light & dark modes. */
   4
   5 :root {
   6         --nano-content-bg-color: #fff;
   7         --nano-content-fg-color: #440077;
   8         --nano-inverted-bg-color: #407;
   9         --nano-inverted-fg-color: #fff;
  10         --nano-a-color: #407;
  11         --nano-a-visited-color: #51188E;
  12         --nano-a-active-color: #F00;
  13         --nano-a-inverted-color: #fff;
  14 }
  15
  16 @media (prefers-color-scheme: dark) {
  17 :root {
  18         --nano-content-bg-color: #111;
  19         --nano-content-fg-color: #cc88ff;
  20         --nano-inverted-bg-color: #9200ff;
  21         --nano-inverted-fg-color: #fff;
  22         --nano-a-color: #c8f;
  23         --nano-a-visited-color: #b7f;
  24         --nano-a-active-color: #F00;
  25         --nano-a-inverted-color: #fff;
  26 }
  27 }
  28
  29 body {
  30         color: var(--nano-content-fg-color);
  31         background-color: var(--nano-content-bg-color);
  32 }
  33 .inverted {
  34         color: var(--nano-inverted-fg-color);
  35         background-color: var(--nano-inverted-bg-color);
  36 }
  37
  38 a {
  39         color: var(--nano-a-color);
  40 }
  41 a:visited {
  42         color: var(--nano-a-visited-color);
  43 }
  44 a:active {
  45         color: var(--nano-a-active-color);
  46 }
  47
  48 .inverted a {
  49         color: var(--nano-a-inverted-color);
  50 }
  51
  52 * {
  53         box-sizing: border-box;
  54 }
  55
  56 .onecolumn {
  57         float: left;
  58         width: 45%;
  59         padding: 5%;
  60 }
  61
  62 table {
  63         border-spacing: 0px;
  64         border-collapse: separate;
  65 }
  66
  67 table#homepage {
  68         padding-top: 3em;
  69         padding-bottom: 3em;
  70 }