{% highlight 'css' %}
.sm-show, .md-show, .lg-show {
  display: none !important
}
@media (--breakpoint-sm) {
  .sm-show { display: block !important }
}
@media (--breakpoint-md) {
  .md-show { display: block !important }
}
@media (--breakpoint-lg) {
  .lg-show { display: block !important }
}
@media (--breakpoint-sm) {
  .sm-hide { display: none !important }
}
@media (--breakpoint-md) {
  .md-hide { display: none !important }
}
@media (--breakpoint-lg) {
  .lg-hide { display: none !important }
}
.display-none { display: none !important }
.hide {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
{% endhighlight %}