/* Visibility */

.visibility-hidden    { visibility: hidden; }
.visibility-visible   { visibility: visible; }

@media (--breakpoint-1) {
  .bp1-visibility-hidden    { visibility: hidden; }
  .bp1-visibility-visible   { visibility: visible; }
}

@media (--breakpoint-2) {
  .bp2-visibility-hidden    { visibility: hidden; }
  .bp2-visibility-visible   { visibility: visible; }
}

@media (--breakpoint-3) {
  .bp3-visibility-hidden    { visibility: hidden; }
  .bp3-visibility-visible   { visibility: visible; }
}

@media (--breakpoint-4) {
  .bp4-visibility-hidden    { visibility: hidden; }
  .bp4-visibility-visible   { visibility: visible; }
}