/* Add this as it's own dark.css file and linked on all pages */
/*-- -------------------------- -->
<---      Core Dark Styles      -->
<--- -------------------------- -*/
/* Base (mobile first) */
:root {
  --dark: #121212;
  --medium: #282828;
  --accent: #404040;
  --bodyTextColorWhite: #FAFBFC;
}
body.dark-mode {
  background-color: var(--dark);
}
body.dark-mode p,
body.dark-mode li,
body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode h5,
body.dark-mode h6,
body.dark-mode .cs-title,
body.dark-mode .cs-text,
body.dark-mode .cs-li {
  color: var(--bodyTextColorWhite);
}
body.dark-mode .light {
  display: none;
}
body.dark-mode .dark {
  display: block !important;
}
.dark {
  display: none;
}
/*-- -------------------------- -->
<---      Dark Mode Toggle      -->
<--- -------------------------- -*/
body.dark-mode #dark-mode-toggle .sun {
  transform: translate(-50%, -50%);
  opacity: 1;
}
body.dark-mode #dark-mode-toggle .moon {
  transform: translate(-50%, -150%);
  opacity: 0;
}

/*-- -------------------------- -->
<---      Dark Contact Strip    -->
<--- -------------------------- -*/

body.dark-mode #contact-strip-325 {
  background-color: var(--medium);
}
body.dark-mode #contact-strip-325 .cs-header,
body.dark-mode #contact-strip-325 .cs-link,
body.dark-mode #contact-strip-325 .cs-hours {
  color: var(--bodyTextColorWhite);
}
body.dark-mode #contact-strip-325 .cs-item:hover .cs-icon {
  filter: brightness(100%);
}
body.dark-mode #contact-strip-325 .cs-icon {
  filter: brightness(1000%);
}

/* Dark Mode meet the team*/
@media only screen and (min-width: 0rem) {
  body.dark-mode #meet-team-1102 .cs-title,
  body.dark-mode #meet-team-1102 .cs-text,
  body.dark-mode #meet-team-1102 .cs-name,
  body.dark-mode #meet-team-1102 .cs-job {
      color: var(--bodyTextColorWhite);
  }
  body.dark-mode #meet-team-1102 .cs-job {
      opacity: 0.8;
  }
  body.dark-mode #meet-team-1102 .cs-info {
      background-color: var(--medium);
  }
  body.dark-mode #meet-team-1102 .cs-social-group {
      border-color: rgba(255, 255, 255, 0.2);
  }
}

  /* Dark mode gallery */
  @media only screen and (min-width: 0rem) {
    body.dark-mode #gallery-2442 .cs-title {
      color: var(--bodyTextColorWhite);
    }
  }