.show-xs,
.show-sm,
.show-md,
.show-lg,
.show-xl {
  display: none !important;
}

html{
  font-size: 16px;
}

@media (max-width: 1280px) {
  html{
    font-size: 14px;
  }
  .hide-xl {
    display: none !important;
  }
  .show-xl {
    display: block !important;
  }
}

@media (max-width: 960px) {

  html{
    font-size: 14px;
  }
  .hide-lg {
    display: none !important;
  }
  .show-lg {
    display: block !important;
  }
}

@media (max-width: 840px) {

  html{
    font-size: 13px;
  }
  .hide-md {
    display: none !important;
  }
  .show-md {
    display: block !important;
  }
}

@media (max-width: 600px) {
  html{
    font-size: 13px;
  }
  .hide-sm {
    display: none !important;
  }
  .show-sm {
    display: block !important;
  }
}

@media (max-width: 480px) {
  html{
    font-size: 12px;
  }
  .hide-xs {
    display: none !important;
  }
  .show-xs {
    display: block !important;
  }
}