.align {
  &-center {
    text-align: center;
  }

  &-left {
    text-align: left;
  }

  &-right {
    text-align: right;
  }
}

.inline-block {
  display: inline-block;
}

.hide-overflow {
  overflow: hidden;
}

.full-width {
  width: 100%;
}

hr.section-break {
  margin: 3em 0;
}

.visually-hidden {
  height: 1px;
  width: 1px;
  padding: 2px;
  display: inline-block;
  overflow: hidden;
  position: absolute;
}

.cursor-pointer:hover {
  cursor: pointer;
}

@include media-breakpoint-only(xxs) { .hidden-xxs { display: none; } }
@include media-breakpoint-only(xs)  { .hidden-xs  { display: none; } }
@include media-breakpoint-only(sm)  { .hidden-sm  { display: none; } }
@include media-breakpoint-only(md)  { .hidden-md  { display: none; } }
@include media-breakpoint-only(lg)  { .hidden-lg  { display: none; } }
@include media-breakpoint-only(xl)  { .hidden-xl  { display: none; } }
@include media-breakpoint-only(xxl) { .hidden-xxl { display: none; } }


// Body classes


.no-breadcrumbs {
  breadcrumb {
    display: none;
  }
}

.bg-gray-lightest {
  background: $gray-lightest;
}

// Sizing
.max-w-1  {  max-width: 1rem; }
.max-w-2  {  max-width: 2rem; }
.max-w-3  {  max-width: 4rem; }
.max-w-4  {  max-width: 8rem; }
.max-w-5  {  max-width: 16rem; }
.max-w-6  {  max-width: 32rem; }
.max-w-7  {  max-width: 48rem; }
.max-w-8  {  max-width: 64rem; }
.max-w-9  {  max-width: 96rem; }

.min-w-1  {  min-width: 1rem; }
.min-w-2  {  min-width: 2rem; }
.min-w-3  {  min-width: 4rem; }
.min-w-4  {  min-width: 8rem; }
.min-w-5  {  min-width: 16rem; }
.min-w-6  {  min-width: 32rem; }
.min-w-7  {  min-width: 48rem; }
.min-w-8  {  min-width: 64rem; }
.min-w-9  {  min-width: 96rem; }

.height-1 { height: 1rem; }
.height-2 { height: 2rem; }
.height-3 { height: 4rem; }
.height-4 { height: 8rem; }
.height-5 { height: 16rem; }
.height-6 { height: 32rem; }
.height-7 { height: 48rem; }
.height-8 { height: 64rem; }

.rounded { border-radius: 6px }

.text-underline { text-decoration: underline; }

.hover--bg-light-gray, .btn-link--hover-bg {
  &:hover {
    background-color: $gray-100 !important;
  }
}
