.brand-bg {
  background-color: #036cb6;
  color: white; }
  html.oldie .brand-bg:before {
    opacity: 0.6;
    background: #036cb6; }
  .brand-bg.overlay:before {
    opacity: 0.6;
    background: #036cb6;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .brand-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(3, 108, 182, 0.6) 20%, rgba(3, 108, 182, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(3, 108, 182, 0.6) 20%, rgba(3, 108, 182, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-bg > * {
    z-index: 1; }

.brand-dark-bg {
  background-color: #13437e;
  color: white; }
  html.oldie .brand-dark-bg:before {
    opacity: 0.6;
    background: #13437e; }
  .brand-dark-bg.overlay:before {
    opacity: 0.6;
    background: #13437e;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .brand-dark-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(19, 67, 126, 0.6) 20%, rgba(19, 67, 126, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-dark-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(19, 67, 126, 0.6) 20%, rgba(19, 67, 126, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-dark-bg > * {
    z-index: 1; }

.brand-light-bg {
  background-color: #60bbfc;
  color: white; }
  html.oldie .brand-light-bg:before {
    opacity: 0.6;
    background: #60bbfc; }
  .brand-light-bg.overlay:before {
    opacity: 0.6;
    background: #60bbfc;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .brand-light-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(96, 187, 252, 0.6) 20%, rgba(96, 187, 252, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-light-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(96, 187, 252, 0.6) 20%, rgba(96, 187, 252, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .brand-light-bg > * {
    z-index: 1; }

.midnight-bg {
  background-color: #112c4e;
  color: white; }
  html.oldie .midnight-bg:before {
    opacity: 0.6;
    background: #112c4e; }
  .midnight-bg.overlay:before {
    opacity: 0.6;
    background: #112c4e;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .midnight-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(17, 44, 78, 0.6) 20%, rgba(17, 44, 78, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .midnight-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(17, 44, 78, 0.6) 20%, rgba(17, 44, 78, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .midnight-bg > * {
    z-index: 1; }

.midnight-bright-bg {
  background-color: #1d3757;
  color: white; }
  html.oldie .midnight-bright-bg:before {
    opacity: 0.6;
    background: #1d3757; }
  .midnight-bright-bg.overlay:before {
    opacity: 0.6;
    background: #1d3757;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .midnight-bright-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(29, 55, 87, 0.6) 20%, rgba(29, 55, 87, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .midnight-bright-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(29, 55, 87, 0.6) 20%, rgba(29, 55, 87, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .midnight-bright-bg > * {
    z-index: 1; }

.chalk-bg {
  background-color: #e9e4e2;
  color: #333; }
  html.oldie .chalk-bg:before {
    opacity: 0.6;
    background: #e9e4e2; }
  .chalk-bg.overlay:before {
    opacity: 0.6;
    background: #e9e4e2;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .chalk-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(233, 228, 226, 0.6) 20%, rgba(233, 228, 226, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .chalk-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(233, 228, 226, 0.6) 20%, rgba(233, 228, 226, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .chalk-bg > * {
    z-index: 1; }

.dark-chalk-bg {
  background-color: #b8b5b4;
  color: white; }
  html.oldie .dark-chalk-bg:before {
    opacity: 0.6;
    background: #b8b5b4; }
  .dark-chalk-bg.overlay:before {
    opacity: 0.6;
    background: #b8b5b4;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .dark-chalk-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(184, 181, 180, 0.6) 20%, rgba(184, 181, 180, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .dark-chalk-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(184, 181, 180, 0.6) 20%, rgba(184, 181, 180, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .dark-chalk-bg > * {
    z-index: 1; }

.teal-bg {
  background-color: #55b0b2;
  color: white; }
  html.oldie .teal-bg:before {
    opacity: 0.6;
    background: #55b0b2; }
  .teal-bg.overlay:before {
    opacity: 0.6;
    background: #55b0b2;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .teal-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(85, 176, 178, 0.6) 20%, rgba(85, 176, 178, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .teal-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(85, 176, 178, 0.6) 20%, rgba(85, 176, 178, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .teal-bg > * {
    z-index: 1; }

.ocean-light-bg {
  background-color: #b6c8d4;
  color: white; }
  html.oldie .ocean-light-bg:before {
    opacity: 0.6;
    background: #b6c8d4; }
  .ocean-light-bg.overlay:before {
    opacity: 0.6;
    background: #b6c8d4;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .ocean-light-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(182, 200, 212, 0.6) 20%, rgba(182, 200, 212, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .ocean-light-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(182, 200, 212, 0.6) 20%, rgba(182, 200, 212, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .ocean-light-bg > * {
    z-index: 1; }

.ocean-bg {
  background-color: #6d92a7;
  color: white; }
  html.oldie .ocean-bg:before {
    opacity: 0.6;
    background: #6d92a7; }
  .ocean-bg.overlay:before {
    opacity: 0.6;
    background: #6d92a7;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .ocean-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(109, 146, 167, 0.6) 20%, rgba(109, 146, 167, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .ocean-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(109, 146, 167, 0.6) 20%, rgba(109, 146, 167, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .ocean-bg > * {
    z-index: 1; }

.eggplant-bg {
  background-color: #865e8b;
  color: white; }
  html.oldie .eggplant-bg:before {
    opacity: 0.6;
    background: #865e8b; }
  .eggplant-bg.overlay:before {
    opacity: 0.6;
    background: #865e8b;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .eggplant-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(134, 94, 139, 0.6) 20%, rgba(134, 94, 139, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .eggplant-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(134, 94, 139, 0.6) 20%, rgba(134, 94, 139, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .eggplant-bg > * {
    z-index: 1; }

.slate-bg {
  background-color: #6d6f71;
  color: white; }
  html.oldie .slate-bg:before {
    opacity: 0.6;
    background: #6d6f71; }
  .slate-bg.overlay:before {
    opacity: 0.6;
    background: #6d6f71;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .slate-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(109, 111, 113, 0.6) 20%, rgba(109, 111, 113, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .slate-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(109, 111, 113, 0.6) 20%, rgba(109, 111, 113, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .slate-bg > * {
    z-index: 1; }

.pumpkin-bg {
  background-color: #ca7768;
  color: white; }
  html.oldie .pumpkin-bg:before {
    opacity: 0.6;
    background: #ca7768; }
  .pumpkin-bg.overlay:before {
    opacity: 0.6;
    background: #ca7768;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .pumpkin-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(202, 119, 104, 0.6) 20%, rgba(202, 119, 104, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .pumpkin-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(202, 119, 104, 0.6) 20%, rgba(202, 119, 104, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .pumpkin-bg > * {
    z-index: 1; }

.raspberry-bg {
  background-color: #99435c;
  color: white; }
  html.oldie .raspberry-bg:before {
    opacity: 0.6;
    background: #99435c; }
  .raspberry-bg.overlay:before {
    opacity: 0.6;
    background: #99435c;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .raspberry-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(153, 67, 92, 0.6) 20%, rgba(153, 67, 92, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .raspberry-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(153, 67, 92, 0.6) 20%, rgba(153, 67, 92, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .raspberry-bg > * {
    z-index: 1; }

.sage-bg {
  background-color: #89b387;
  color: white; }
  html.oldie .sage-bg:before {
    opacity: 0.6;
    background: #89b387; }
  .sage-bg.overlay:before {
    opacity: 0.6;
    background: #89b387;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .sage-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(137, 179, 135, 0.6) 20%, rgba(137, 179, 135, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .sage-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(137, 179, 135, 0.6) 20%, rgba(137, 179, 135, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .sage-bg > * {
    z-index: 1; }

.bubblegum-bg {
  background-color: #e55690;
  color: white; }
  html.oldie .bubblegum-bg:before {
    opacity: 0.6;
    background: #e55690; }
  .bubblegum-bg.overlay:before {
    opacity: 0.6;
    background: #e55690;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .bubblegum-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(229, 86, 144, 0.6) 20%, rgba(229, 86, 144, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .bubblegum-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(229, 86, 144, 0.6) 20%, rgba(229, 86, 144, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .bubblegum-bg > * {
    z-index: 1; }

.sky-bg {
  background-color: #cee8f8;
  color: #333; }
  html.oldie .sky-bg:before {
    opacity: 0.6;
    background: #cee8f8; }
  .sky-bg.overlay:before {
    opacity: 0.6;
    background: #cee8f8;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .sky-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(206, 232, 248, 0.6) 20%, rgba(206, 232, 248, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .sky-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(206, 232, 248, 0.6) 20%, rgba(206, 232, 248, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .sky-bg > * {
    z-index: 1; }

.light-sky-bg {
  background-color: #e0f0fb;
  color: #333; }
  html.oldie .light-sky-bg:before {
    opacity: 0.6;
    background: #e0f0fb; }
  .light-sky-bg.overlay:before {
    opacity: 0.6;
    background: #e0f0fb;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .light-sky-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(224, 240, 251, 0.6) 20%, rgba(224, 240, 251, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .light-sky-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(224, 240, 251, 0.6) 20%, rgba(224, 240, 251, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .light-sky-bg > * {
    z-index: 1; }

.purple-bg {
  background-color: #6b436f;
  color: white; }
  html.oldie .purple-bg:before {
    opacity: 0.6;
    background: #6b436f; }
  .purple-bg.overlay:before {
    opacity: 0.6;
    background: #6b436f;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .purple-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(107, 67, 111, 0.6) 20%, rgba(107, 67, 111, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .purple-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(107, 67, 111, 0.6) 20%, rgba(107, 67, 111, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .purple-bg > * {
    z-index: 1; }

.grey-bg {
  background-color: #e0dddc;
  color: #333; }
  html.oldie .grey-bg:before {
    opacity: 0.6;
    background: #e0dddc; }
  .grey-bg.overlay:before {
    opacity: 0.6;
    background: #e0dddc;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .grey-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(224, 221, 220, 0.6) 20%, rgba(224, 221, 220, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .grey-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(224, 221, 220, 0.6) 20%, rgba(224, 221, 220, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .grey-bg > * {
    z-index: 1; }

.light-grey-bg {
  background-color: #f4f1f0;
  color: #333; }
  html.oldie .light-grey-bg:before {
    opacity: 0.6;
    background: #f4f1f0; }
  .light-grey-bg.overlay:before {
    opacity: 0.6;
    background: #f4f1f0;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .light-grey-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(244, 241, 240, 0.6) 20%, rgba(244, 241, 240, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .light-grey-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(244, 241, 240, 0.6) 20%, rgba(244, 241, 240, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .light-grey-bg > * {
    z-index: 1; }

.white-bg {
  background-color: #ffffff;
  color: #333; }
  html.oldie .white-bg:before {
    opacity: 0.6;
    background: #ffffff; }
  .white-bg.overlay:before {
    opacity: 0.6;
    background: #ffffff;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .white-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .white-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .white-bg > * {
    z-index: 1; }

.black-bg {
  background-color: #000000;
  color: white; }
  html.oldie .black-bg:before {
    opacity: 0.6;
    background: #000000; }
  .black-bg.overlay:before {
    opacity: 0.6;
    background: #000000;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .black-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(0, 0, 0, 0.6) 20%, transparent 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .black-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 20%, transparent 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .black-bg > * {
    z-index: 1; }

.dark-pumpkin-bg {
  background-color: #5b281e;
  color: white; }
  html.oldie .dark-pumpkin-bg:before {
    opacity: 0.6;
    background: #5b281e; }
  .dark-pumpkin-bg.overlay:before {
    opacity: 0.6;
    background: #5b281e;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .dark-pumpkin-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(91, 40, 30, 0.6) 20%, rgba(91, 40, 30, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .dark-pumpkin-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(91, 40, 30, 0.6) 20%, rgba(91, 40, 30, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .dark-pumpkin-bg > * {
    z-index: 1; }

.error-bg {
  background-color: #d45252;
  color: white; }
  html.oldie .error-bg:before {
    opacity: 0.6;
    background: #d45252; }
  .error-bg.overlay:before {
    opacity: 0.6;
    background: #d45252;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0; }
  .error-bg.gradient--bottom:before {
    background: linear-gradient(to top, rgba(212, 82, 82, 0.6) 20%, rgba(212, 82, 82, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .error-bg.gradient--top:before {
    background: linear-gradient(to bottom, rgba(212, 82, 82, 0.6) 20%, rgba(212, 82, 82, 0) 100%);
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    opacity: 1; }
  .error-bg > * {
    z-index: 1; }
