@mixin backgroundContainCenter {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}

@mixin backgroundCoverCenter {
  background-size: cover;
  background-position: center center;
}

@mixin clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

@mixin maxCentered ($widthPx) {
  max-width: $widthPx + px;
  margin: 0 auto;
}

@mixin absolutely {
  position: absolute;
  left: 0;
  top: 0;
}

@mixin absolutelyCenter {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

@mixin absolutelyCenterHT($top) {
  position: absolute;
  left: 0;
  right: 0;
  top: $top;
  margin: 0 auto;
}

@mixin absolutelyCenterHB {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
}

@mixin absolutelyFull {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

@mixin limitText($lines, $lineHeight) {
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: $lines;
   line-height: $lineHeight;
   max-height: $lineHeight * $lines + 'px';
}

@mixin gradientText($gradient, $color) {
  background: $gradient;
  -ms-background: none;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: $color;
  -ms-background-size: 10px;
}