// animation overlays for switching themes
.theme-dark-fade-in:after, .theme-light-fade-in:after {
  content: "";
  display: block;
  position: fixed;
  z-index: 10001;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
.theme-dark-fade-in:after {
  animation: fadeInDark ease-in 1s;
  -webkit-animation: fadeInDark ease-in 1s;
  -moz-animation: fadeInDark ease-in 1s;
  -o-animation: fadeInDark ease-in 1s;
  -ms-animation: fadeInDark ease-in 1s;
  background-color: rgba(#fff, 1.0);
  opacity: 0;
}
.theme-light-fade-in:after {
  animation: fadeInLight ease-in 1s;
  -webkit-animation: fadeInLight ease-in 1s;
  -moz-animation: fadeInLight ease-in 1s;
  -o-animation: fadeInLight ease-in 1s;
  -ms-animation: fadeInLight ease-in 1s;
  background-color: rgba(#000, 1.0);
  opacity: 0;
}
@keyframes fadeInLight {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-moz-keyframes fadeInLight {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-webkit-keyframes fadeInLight {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-o-keyframes fadeInLight {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-ms-keyframes fadeInLight {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@keyframes fadeInDark {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-moz-keyframes fadeInDark {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-webkit-keyframes fadeInDark {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-o-keyframes fadeInDark {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
@-ms-keyframes fadeInDark {
  0% { opacity: 1.0; }
  100% { opacity: 0; }
}
