:root {
  color-scheme: light dark;
}

.kemistry-contact-links a,
.kemistry-mode-toggle {
  display: inline-block;
}

.kemistry-mode-toggle {
  appearance: none;
  border: 1px solid rgba(60, 60, 60, 0.28);
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.74);
  color: #323232;
  cursor: pointer;
  font: inherit;
  line-height: 1;
  margin-left: 8px;
  padding: 4px 7px;
}

.kemistry-mode-toggle:hover,
.kemistry-mode-toggle:focus-visible {
  border-color: #555;
  color: #111;
  outline: none;
}

.kemistry-footer-connect p,
.kemistry-footer-connect ul,
.kemistry-footer-articles ul {
  margin-bottom: 0;
}

.kemistry-footer-connect li,
.kemistry-footer-articles li {
  margin-bottom: 6px;
}

@media (prefers-color-scheme: dark) {
  body:not(.kemistry-light) {
    background: #111;
    color: #d6d6d6;
  }

  body:not(.kemistry-light) #section-tophat,
  body:not(.kemistry-light) #section-header,
  body:not(.kemistry-light) #section-footer,
  body:not(.kemistry-light) #section-sub-footer {
    background-color: #171717 !important;
    color: #d8d8d8;
  }

  body:not(.kemistry-light) #section-content,
  body:not(.kemistry-light) .content,
  body:not(.kemistry-light) .container {
    color: #d6d6d6;
  }

  body:not(.kemistry-light) h1,
  body:not(.kemistry-light) h2,
  body:not(.kemistry-light) h3,
  body:not(.kemistry-light) h4,
  body:not(.kemistry-light) h5,
  body:not(.kemistry-light) h6,
  body:not(.kemistry-light) .feature h2,
  body:not(.kemistry-light) .footer-widget-title {
    color: #f2f2f2;
  }

  body:not(.kemistry-light) p,
  body:not(.kemistry-light) li,
  body:not(.kemistry-light) .textwidget,
  body:not(.kemistry-light) .module-meta,
  body:not(.kemistry-light) .module-meta p,
  body:not(.kemistry-light) .special {
    color: #d0d0d0;
  }

  body:not(.kemistry-light) a {
    color: #8fd6c2;
  }

  body:not(.kemistry-light) a:hover,
  body:not(.kemistry-light) a:focus {
    color: #ffffff;
  }

  body:not(.kemistry-light) #menu-site a strong,
  body:not(.kemistry-light) #menu-site a {
    color: #f0f0f0;
  }

  body:not(.kemistry-light) #menu-site li.current-menu-item a strong,
  body:not(.kemistry-light) #menu-site a:hover strong {
    color: #8fd6c2;
  }

  body:not(.kemistry-light) .module,
  body:not(.kemistry-light) .module-container,
  body:not(.kemistry-light) .module-img,
  body:not(.kemistry-light) .post,
  body:not(.kemistry-light) .page {
    background-color: transparent;
  }

  body:not(.kemistry-light) img {
    opacity: 0.94;
  }

  body:not(.kemistry-light) #logotype,
  body:not(.kemistry-light) .social img,
  body:not(.kemistry-light) .flexslider img,
  body:not(.kemistry-light) .module-img img {
    opacity: 1;
  }

  body:not(.kemistry-light) hr {
    border-color: rgba(255, 255, 255, 0.16);
  }

  body:not(.kemistry-light) select,
  body:not(.kemistry-light) input,
  body:not(.kemistry-light) textarea {
    background: #202020;
    border-color: #444;
    color: #f0f0f0;
  }

  body:not(.kemistry-light) .kemistry-mode-toggle {
    background: #242424;
    border-color: #555;
    color: #f2f2f2;
  }
}

body.kemistry-dark {
  background: #111;
  color: #d6d6d6;
}

body.kemistry-dark #section-tophat,
body.kemistry-dark #section-header,
body.kemistry-dark #section-footer,
body.kemistry-dark #section-sub-footer {
  background-color: #171717 !important;
  color: #d8d8d8;
}

body.kemistry-dark h1,
body.kemistry-dark h2,
body.kemistry-dark h3,
body.kemistry-dark h4,
body.kemistry-dark h5,
body.kemistry-dark h6,
body.kemistry-dark .feature h2,
body.kemistry-dark .footer-widget-title {
  color: #f2f2f2;
}

body.kemistry-dark p,
body.kemistry-dark li,
body.kemistry-dark .textwidget,
body.kemistry-dark .module-meta,
body.kemistry-dark .module-meta p,
body.kemistry-dark .special {
  color: #d0d0d0;
}

body.kemistry-dark a {
  color: #8fd6c2;
}

body.kemistry-dark a:hover,
body.kemistry-dark a:focus {
  color: #ffffff;
}

body.kemistry-dark #menu-site a strong,
body.kemistry-dark #menu-site a {
  color: #f0f0f0;
}

body.kemistry-dark #menu-site li.current-menu-item a strong,
body.kemistry-dark #menu-site a:hover strong {
  color: #8fd6c2;
}

body.kemistry-dark hr {
  border-color: rgba(255, 255, 255, 0.16);
}

body.kemistry-dark select,
body.kemistry-dark input,
body.kemistry-dark textarea {
  background: #202020;
  border-color: #444;
  color: #f0f0f0;
}

body.kemistry-dark .kemistry-mode-toggle {
  background: #242424;
  border-color: #555;
  color: #f2f2f2;
}

@media only screen and (max-width: 767px) {
  .kemistry-mode-toggle {
    margin: 6px 0 0;
  }

  #tagline {
    height: auto !important;
  }
}