@include xs-screen {
  .not-xs {
    display: none !important;
  }
  .only-xs {
    display: inherit;
  }
}
@include sm-screen {
  .not-xs {
    display: inherit;
  }
  .only-xs {
    display: none !important;
  }
}
@include lg-screen {
  .not-xs {
    display: inherit;
  }
  .only-xs {
    display: none !important;
  }
}

.shadow {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14),
    0 2px 1px -1px rgba(0, 0, 0, 0.12);
}

.theme-wrapper.dark .shadow {
  border: 1px solid #fff3;
}

.font-text {
  @include body-font;
}
.font-title {
  @include title-font;
}
.font-button {
  @include button-font;
}
.poh:hover {
  cursor: pointer;
}
.scribble {
  font-family: 'Permanent marker';
  color: $oc-pink-5;
}