:root,
:root[data-theme="graphit"] {
  color-scheme: light;
  --fl-page: #F1F2F3;
  --fl-page-top: #C3CBCF;
  --fl-surface: #FFFFFF;
  --fl-header: #37474F;
  --fl-primary: #263238;
  --fl-bar: #263238;
  --fl-logo: #FF8A50;
  --fl-accent: #BF3F0B;
  --fl-accent-hover: #F76707;
  --fl-text: #4F5B62;
  --fl-strong: #263238;
  --fl-line: #DDE1E3;
  --fl-on-dark: #FFFFFF;
  --fl-on-dark-soft: #FFC9A8;
  --fl-box-content: #E3E7E9;
  --fl-stripe: #E6E9EB;
  --fl-shadow: rgba(0, 0, 0, .4);
  --fl-img-shadow: 0 0 2px rgba(0, 0, 0, .4);
}

:root[data-theme="beere"] {
  color-scheme: light;
  --fl-page: #F6EEF3;
  --fl-page-top: #DDB8CE;
  --fl-surface: #FFFFFF;
  --fl-header: #8E3B6E;
  --fl-primary: #6A2350;
  --fl-bar: #6A2350;
  --fl-logo: #F3C6E0;
  --fl-accent: #0E7C6B;
  --fl-accent-hover: #14A38D;
  --fl-text: #5A4E55;
  --fl-strong: #3A2C34;
  --fl-line: #E6D9E0;
  --fl-on-dark: #FFFFFF;
  --fl-on-dark-soft: #F3C6E0;
  --fl-box-content: #EFDCE7;
  --fl-stripe: #F0E3EA;
  --fl-shadow: rgba(0, 0, 0, .4);
  --fl-img-shadow: 0 0 2px rgba(0, 0, 0, .4);
}

:root[data-theme="dunkel"] {
  color-scheme: dark;
  --fl-page: #0E141B;
  --fl-page-top: #1A2A3D;
  --fl-surface: #17202A;
  --fl-header: #1F3550;
  --fl-primary: #8DB8E8;
  --fl-bar: #12253A;
  --fl-logo: #8DB8E8;
  --fl-accent: #FFB347;
  --fl-accent-hover: #FFD08A;
  --fl-text: #C9D3DD;
  --fl-strong: #E8EEF4;
  --fl-line: #2C3A48;
  --fl-on-dark: #E8EEF4;
  --fl-on-dark-soft: #8DB8E8;
  --fl-box-content: #1F2B38;
  --fl-stripe: #1B2531;
  --fl-shadow: rgba(0, 0, 0, .8);
  --fl-img-shadow: 0 0 0 1px #2C3A48;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    color-scheme: dark;
    --fl-page: #0E141B;
    --fl-page-top: #1A2A3D;
    --fl-surface: #17202A;
    --fl-header: #1F3550;
    --fl-primary: #8DB8E8;
    --fl-bar: #12253A;
    --fl-logo: #8DB8E8;
    --fl-accent: #FFB347;
    --fl-accent-hover: #FFD08A;
    --fl-text: #C9D3DD;
    --fl-strong: #E8EEF4;
    --fl-line: #2C3A48;
    --fl-on-dark: #E8EEF4;
    --fl-on-dark-soft: #8DB8E8;
    --fl-box-content: #1F2B38;
    --fl-stripe: #1B2531;
    --fl-shadow: rgba(0, 0, 0, .8);
    --fl-img-shadow: 0 0 0 1px #2C3A48;
  }
}

html {
  background-color: var(--fl-page);
}

body {
  color: var(--fl-text);
}

#site {
  background-color: var(--fl-surface);
}

#header,
.box_head {
  background-color: var(--fl-header);
}

#headLogo {
  color: var(--fl-on-dark);
}

#headLogo span {
  color: var(--fl-logo);
}

h1,
h2,
h3 {
  color: var(--fl-primary);
}

#nav1 a,
#nav1 a:active,
#nav1 a:link,
#nav1 a:visited,
#a-z a,
#a-z a:active,
#a-z a:link,
#a-z a:visited {
  background-color: var(--fl-surface);
  color: var(--fl-primary);
}

#a-z,
#foot {
  background-color: var(--fl-bar);
}

@media only screen and (max-width: 799px) {
  .js .wf-responsive-nav {
    background-color: var(--fl-bar);
  }
}

a,
#nav1 a:hover,
#nav1 a.active,
#a-z a:hover,
.search-expand,
.wf-responsive-nav-switch {
  color: var(--fl-accent);
}

a:hover,
.search-expand:hover,
.wf-responsive-nav-switch:hover {
  color: var(--fl-accent-hover);
}

.search-expand,
.wf-responsive-nav-switch {
  background-color: var(--fl-surface);
}

.button {
  background-color: var(--fl-accent);
}

.button:hover {
  background-color: var(--fl-accent-hover);
}

.rbox {
  border-color: var(--fl-header);
  background-color: var(--fl-surface);
}

.box_head,
#foot,
#foot a {
  color: var(--fl-on-dark);
}

#foot a:hover {
  color: var(--fl-on-dark-soft);
}

.box_button,
.box_link {
  background-color: var(--fl-surface);
}

.box_button + .box_link,
.box_link + .box_link {
  border-top-color: var(--fl-header);
}

.box_content {
  background-color: var(--fl-box-content);
}

.line,
#enav:before {
  background-color: var(--fl-line);
}

#enav li {
  color: var(--fl-line);
}

#enav a {
  border-bottom-color: var(--fl-line);
  background-color: var(--fl-surface);
}

#enav a.active {
  border-bottom-color: var(--fl-surface);
}

#content p.intro strong,
strong {
  color: var(--fl-strong);
}

#news_detail_image a span {
  color: var(--fl-text);
}

#enav a,
#head,
#nav1 a {
  box-shadow: 0 0 2px var(--fl-shadow);
}

#content img {
  box-shadow: var(--fl-img-shadow);
}

#head {
  position: relative;
}

.fl-theme-toggle {
  position: absolute;
  top: 0;
  right: 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  font-size: 22px;
  line-height: 40px;
  color: var(--fl-on-dark);
  cursor: pointer;
}

.fl-theme-toggle:hover,
.fl-theme-toggle:focus-visible {
  color: var(--fl-logo);
}

.fl-theme-toggle .fl-icon-sun,
:root[data-theme="dunkel"] .fl-theme-toggle .fl-icon-moon {
  display: none;
}

:root[data-theme="dunkel"] .fl-theme-toggle .fl-icon-sun {
  display: inline-block;
}

.fl-theme-choice {
  display: block;
  margin-top: -6px;
  font-size: 13px;
}

.fl-theme-choice button {
  padding: 0 2px;
  border: none;
  background: none;
  font: inherit;
  color: var(--fl-on-dark);
  cursor: pointer;
  opacity: .75;
}

.fl-theme-choice button:hover,
.fl-theme-choice button:focus-visible {
  opacity: 1;
  color: var(--fl-on-dark-soft);
}

.fl-theme-choice button[aria-pressed="true"] {
  opacity: 1;
  font-weight: 700;
  text-decoration: underline;
}

@media only screen and (min-width: 800px) {
  :root {
    background-color: var(--fl-page);
    background-image: linear-gradient(to bottom, var(--fl-page-top), var(--fl-page));
    background-size: 100px 800px;
    background-repeat: repeat-x;
  }

  #site {
    background-image: repeating-linear-gradient(-45deg, var(--fl-stripe) 0 1px, transparent 1px 6px);
    background-size: 300px 100%;
    background-position: right top;
    background-repeat: repeat-y;
  }

  .fl-theme-toggle {
    top: 50%;
    right: 15px;
    margin-top: -20px;
  }
}

.fl-icon {
  display: inline-block;
  width: 1em;
  height: 1em;
  vertical-align: middle;
}