.show,
.showTablet {
  display: none;
}

@media screen and (max-width: 48rem) {
  .hide {
    display: none !important;
  }

  .show {
    display: block !important;
  }

  [class*="Offset"],
  [class*="col"] {
    margin-left: auto;
    margin-right: auto;
    flex: 0 1 100%;
    max-width: 100%;
    min-width: 100%;
  }

  .nav,
  .nav > .cols,
  .nav > .row {
    flex-direction: column;
  }

  .navCenter,
  .navLeft,
  .navRight {
    flex-wrap: wrap;
    justify-content: center;
  }

  .padReset {
    padding: 0 !important;
  }

  .marReset {
    margin: 0 !important;
  }

  .hdg {
    --media-hdg: 0.8;
  }
}

@media screen and (min-width: 48rem) and (max-width: 60rem) {
  .hideTablet {
    display: none !important;
  }

  .showTablet {
    display: block !important;
  }

  .padTabletReset {
    padding: 0 !important;
  }

  .marTabletReset {
    margin: 0 !important;
  }

  .hdgTablet {
    --media-hdg: 0.9;
  }
}