body {
  --body-bg: #f5f5f5;
  --body-color: #222;
  --border-color: #255d25;
  --side-bg: #f0eded;
  --hr: rgba(175, 173, 173, 0.85);
  --footer-a: #f5f5f5;
  --a: rgb(26, 99, 37);
  --a-hover: rgb(101, 133, 107);
  --btn-color: #f5f5f5;
  --btn-bg: #d3884f;
  --red: #ba1a1a;
  --blue: #1c12db;
  --orange: #d95c1e;
  --green: rgba(59, 99, 65);
  --grey: var(--body-color);
  --copy-btn: #222;
  --printout-bg: #f2f5f2;
  --offcanvas-border: #cccccc;
  --accordion-bg: #f2f5f2;
  --select-bg: var(--body-bg);
  --select-color: var(--body-color);
  --whitish: rgb(228, 227, 227);
  --anagram-bg: #ededed;
  --anagram-ltrs-trans: #aaa;
  --anagram-found-green: #006e00;
  --anagram-hover: #f1f1f0c7;
  --anagram-active: #e2e2e1b6;
  --toggler: rgba(166, 180, 168, 0.7);
  --solver-bg: rgb(220, 218, 218);
  --to-find: #000;
  --mid-ltr-bg: #e7e7e4;
  --scrabble-bg: rgb(205, 203, 203);
  --generator-bg: #e7e7e7;
  --input-anagram-drop: #aaa;
}

#toggle_nightAndDay:checked ~ * {
  --body-bg: rgb(36, 36, 36);
  --body-color: rgb(205, 204, 204);
  --border-color: #5f7b5f;

  --side-bg: rgb(44, 43, 43);
  --hr: var(--body-color);
  --a: rgb(137, 162, 141);
  --a-hover: rgb(86, 104, 89);
  --btn-color: #d9d7d7;
  --btn-bg: #b67645;
  --red: #c57777;
  --blue: #9f9bec;
  --orange: #d95c1e;
  --green: rgba(45, 103, 53, 0.7);
  --grey: var(--body-color);
  --whitish: rgb(205, 204, 204);
  --copy-btn-bg: var(--body-bg);
  --copy-btn-color: var(--body-color);
  --printout-bg: #4e4f4e8e;
  --offcanvas-border: #cccccc44;
  --accordion-bg: #222;
  --select-bg: var(--body-bg);
  --select-color: var(--body-color);
  --anagram-ltrs-trans: #727171;
  --anagram-bg: #2b2a2a;
  --anagram-hover: #535252;
  --anagram-active: #4e4e4e;
  --anagram-found-green: rgb(108, 174, 108);
  --toggler: rgba(194, 212, 196, 0.7);
  --solver-bg: rgb(72, 72, 72);
  --to-find: #fff;
  --mid-ltr-bg: #5e5d5d;
  --scrabble-bg: var(--body-bg);
  --generator-bg: #636363;
  --input-anagram-drop: #eee;
}

#toggle_nightAndDay:checked ~ #fauxBody p,
#toggle_nightAndDay:checked ~ #fauxBody .all .main-container h1,
#toggle_nightAndDay:checked ~ #fauxBody .all .main-container h2,
#toggle_nightAndDay:checked ~ #fauxBody .all .main-container h3,
#toggle_nightAndDay:checked ~ #fauxBody .all .main-container h4,
#toggle_nightAndDay:checked ~ #fauxBody .all .main-container h5 {
  font-weight: 300;
}

.all .main-container .night-mode-div label:before {
  content: "Go to Dark Mode";
}

#toggle_nightAndDay:checked
  ~ #fauxBody
  .all
  .main-container
  .night-mode-div
  label:before {
  content: "Go to Light Mode";
}

/* anagram game  */
#toggle_nightAndDay:checked
  ~ #fauxBody
  .all
  .main-container
  .anagram-margin
  #tiles {
  opacity: 0.8;
}

#toggle_nightAndDay:checked ~ #fauxBody .all .main-container .anagram-margin,
#toggle_nightAndDay:checked
  ~ #fauxBody
  .all
  .main-container
  .selectItem
  option {
  font-weight: 300;
}

#toggle_nightAndDay:checked ~ #fauxBody .all .main-container .carousel img {
  filter: brightness(0.8) contrast(1.2);
}

#toggle_nightAndDay:checked ~ #fauxBody .all .main-container #game {
  filter: brightness(0.8) contrast(1.2);
}