@media (prefers-color-scheme: dark) {

  /* =============================
     GLOBAL
  ============================== */
  body {
    background: #121212 !important;
    color: #e0e0e0 !important;
  }

  p, li, dd {
    color: #cfcfcf;
  }

  strong {
    color: #ffffff;
  }

  /* =============================
     HEADINGS
  ============================== */
  h1, h2, h3, h4, h5, h6 {
    color: #ffffff !important;
  }

  .text3 {
    color: #b0b0b0;
  }

  /* =============================
     LINKS
  ============================== */
  a {
    color: #7cc7ff;
  }

  a:hover {
    color: #4da3ff;
  }

  a:visited {
    color: #9bbcff;
  }

  /* =============================
     CONTENT / SECTIONS
  ============================== */
  .content,
  .bg1,
  .bg2,
  .bg4,
  .quote_cnt,
  .service_price,
  .search-form {
    background: #1e1e1e !important;
    color: #e0e0e0;
  }

  .bg3 {
    background: #2a2a2a;
  }

  .contact {
    background: #1b1b1b;
  }

  /* =============================
     HEADER / BRAND
  ============================== */
  .brand {
    border-bottom: 1px solid #333;
  }

  .brand_name a,
  .brand_slogan {

  }

  /* =============================
     NAVIGATION
  ============================== */
  .sf-menu > li > a {
    color: #e0e0e0;
  }

  .sf-menu > li > a:hover {
    background: #2a2a2a;
    color: #7cc7ff;
  }

  .sf-menu > li.active > a {
    background: #4da3ff;
    color: #000;
  }

  .sf-menu ul {
    background: #1e1e1e;
  }

  .sf-menu ul > li > a {
    color: #e0e0e0;
  }

  .sf-menu ul > li > a:hover {
    background: #4da3ff;
    color: #000;
  }

  /* =============================
     BUTTONS
  ============================== */
  .btn1 {
    color: #e0e0e0;
    border-color: #e0e0e0;
  }

  .btn1:hover {
    color: #7cc7ff;
    border-color: #7cc7ff;
  }

  .btn2 {
    border-color: #e0e0e0;
    color: #e0e0e0;
  }

  .btn2:hover {
    background: #e0e0e0;
    color: #000;
  }

  /* =============================
     IMAGES / THUMBS
  ============================== */
  .thumb {
    border-color: #333;
  }

  .thumb_overlay {
    background: rgba(0, 0, 0, 0.85);
    color: #fff;
  }

  /* =============================
     FORMS
  ============================== */
  input,
  select,
  textarea {
    background: #1e1e1e;
    color: #e0e0e0;
    border-color: #333;
  }

  /* =============================
     FOOTER
  ============================== */
  .footer {
    background: #121212;
    color: #cfcfcf;
  }

  .handwerksstern-footer {
    border-top: 1px solid #333;
  }

  .copyright {
    color: #9a9a9a;
  }

  /* =============================
     MISC
  ============================== */
  .map {
    filter: grayscale(1) brightness(0.8);
  }

  .toTop {
    background: #2a2a2a;
  }

  .toTop:hover {
    background: #4da3ff;
  }

}