.background-color-black {
  background-color: var(--color-black);
}

.border-color-black {
  border-color: var(--color-black);
}

.color-black {
  color: var(--color-black);
}

.background-color-white {
  background-color: var(--color-white);
}

.border-color-white {
  border-color: var(--color-white);
}

.color-white {
  color: var(--color-white);
}

/* ================================================================================================== 
General 
================================================================================================== */
body {
  color: var(--color-black);
  background: #FFF;
}

a, a:visited {
  color: var(--color-black);
}
@media (hover: hover) {
  a:focus, a:hover, a:visited:focus, a:visited:hover {
    color: var(--color-blue);
  }
}

/* Form elements
------------------------------------------------------------------------ */
input, select, textarea, button {
  color: #000;
}
input:focus, select:focus, textarea:focus, button:focus {
  outline: none;
}

input::placeholder {
  color: #000;
  opacity: 1;
}

textarea::placeholder {
  color: #999999;
  opacity: 1;
}

/* ================================================================================================== 
Reverse 
================================================================================================== */
.background-color-black {
  color: var(--color-white);
  /* Form elements
  ------------------------------------------------------------------------ */
}
.background-color-black a {
  color: var(--color-white);
}
.background-color-black .btn,
.background-color-black a.btn {
  border-color: var(--color-white);
}
.background-color-black .btn i,
.background-color-black a.btn i {
  border-color: var(--color-white);
}
.background-color-black .btn:focus, .background-color-black .btn:hover,
.background-color-black a.btn:focus,
.background-color-black a.btn:hover {
  border-color: var(--color-white);
  background-color: var(--color-white);
  color: var(--color-black);
}
.background-color-black .btn:focus i, .background-color-black .btn:hover i,
.background-color-black a.btn:focus i,
.background-color-black a.btn:hover i {
  background-color: var(--color-white);
}
.background-color-black .btn:focus i:after, .background-color-black .btn:hover i:after,
.background-color-black a.btn:focus i:after,
.background-color-black a.btn:hover i:after {
  filter: invert(0);
}
.background-color-black input, .background-color-black select, .background-color-black textarea, .background-color-black button {
  color: #fff;
}
.background-color-black input:focus, .background-color-black select:focus, .background-color-black textarea:focus, .background-color-black button:focus {
  outline: none;
}
.background-color-black ::placeholder {
  color: #fff;
  opacity: 1;
}