.font-serif {
  font-family: 'Noto Serif', serif;
}

.font-sans {
  font-family: 'Noto Sans', sans-serif;
}

.font-classic {
  /* font-family: 'Abyssinica SIL', 'Noto Serif', serif; */
  font-family: 'Andika', 'Abyssinica SIL', sans-serif;
}

.font-easy {
  font-family: 'Andika', 'Noto Sans', sans-serif;
}

.font-sans h2.cycle,
.font-sans h2.theme,
.font-sans h3.reading {
  font-family: 'Noto Serif', serif;
}

.font-serif h2.month,
.font-serif h2.name,
.font-serif h3.title,
.font-serif h3.ref,
.font-serif h3.reading {
  font-family: 'Noto Sans', sans-serif;
}

.font-sans .ethiopic,
.font-serif .ethiopic,
.font-easy .ethiopic {
  font-family: inherit;
  font-weight: unset !important;
}

h3.reading:after,
h3.reading:before {
  content: "—";
  margin: 0 .5em;
}

.size-12 {
  font-size: 12px;
}

.size-14 {
  font-size: 14px;
}

.size-16 {
  font-size: 16px;
}

.size-18 {
  font-size: 18px;
}

.spacing-125 {
  line-height: 1.25;
}

.spacing-140 {
  line-height: 1.40;
}

.spacing-155 {
  line-height: 1.55;
}

.theme-light {
  background-color: hsl(200deg, 80%, 100%);
  color: hsl(200deg, 60%, 15%);
}

.theme-light section {
  background-color: hsl(200deg, 10%, 99%);
}

.theme-light .button,
.theme-light section:nth-of-type(2n) {
  background-color: hsl(200deg, 10%, 96%);
}

.theme-light section:nth-of-type(n+2) {
  background: -webkit-linear-gradient(180deg, hsla(200deg, 20%, 50%, 7%) 0%, hsla(200deg, 20%, 50%, 0%) 100%);
  background: -moz-linear-gradient(180deg, hsla(200deg, 20%, 50%, 7%) 0%, hsla(200deg, 20%, 50%, 0%) 100%);
  background: linear-gradient(180deg, hsla(200deg, 20%, 50%, 7%) 0%, hsla(200deg, 20%, 50%, 0%) 100%);
  background-color: #fff;
  background-size: 100% 120px;
  background-repeat: no-repeat;
}

/* .theme-light header+section {
  background: #ff0;
} */

.theme-light .day {
  background-color: hsl(200deg, 10%, 93%);
}

.theme-light .day.today:after {
  background-color: hsl(200deg, 90%, 55%);
}

.theme-light .inRange {
  background-color: hsl(200deg, 30%, 90%);
}

.theme-light .color_n #cross {
  color: #6661;
}

.theme-light .color_g {
  background-color: #082;
}

.theme-light .color_r {
  background-color: #a01;
}

.theme-light .color_p {
  background-color: #808;
}

.theme-light .color_w {
  background-color: #fff;
}

.theme-light .day.color_w {
  box-shadow: 0 0 2px hsla(200deg, 10%, 40%, 0.2);
}

.theme-light .color_b {
  background-color: #001;
}

.theme-light .color_n {
  background-color: hsl(200deg, 10%, 94%);
  color: hsl(200deg, 20%, 35%);
}

.theme-light .info {
  opacity: 1.0;
  color: hsl(200deg, 15%, 50%);
}

.theme-light #tabbar {
  background-color: hsl(200deg, 80%, 95%);
  color: hsl(200deg, 20%, 65%);
}

.theme-light .tab-icon.active .icon {
  background-color: hsl(200deg, 80%, 90%);
  color: hsl(200deg, 80%, 30%);
}

.theme-sand {
  background-color: hsl(50deg, 60%, 95%);
  color: hsl(50deg, 40%, 15%);
}

.theme-sand #tabbar {
  background-color: hsl(50deg, 50%, 90%);
  color: hsl(50deg, 20%, 70%);
}

.theme-sand .tab-icon.active {
  background-color: hsl(50deg, 50%, 85%);
  color: hsl(50deg, 80%, 30%);
}

.theme-dark {
  background-color: hsl(200deg, 40%, 15%);
  color: hsl(200deg, 15%, 82%);
}

.theme-dark #tabbar {
  background-color: hsl(200deg, 30%, 25%);
  color: hsl(200deg, 20%, 45%);
}

.theme-dark .tab-icon.active {
  background-color: hsl(200deg, 30%, 35%);
  color: hsl(200deg, 20%, 85%);
}