// Background Color
// --------------------------------------------------------------------------

@each $name, $value in $color-values {
  .backgroundColor-#{$name} {
    background-color: $value;
  }
}

.backgroundColor-none,
.backgroundColor-transparent {
  background-color: transparent;
}

// Background Image
// --------------------------------------------------------------------------

.backgroundImage-none {
  background-image: none;
}

// Background Position
// --------------------------------------------------------------------------

.backgroundPosition-leftTop {
  background-position: 0 0;
}

.backgroundPosition-leftCenter {
  background-position: 0;
}

.backgroundPosition-leftBottom {
  background-position: 0 100%;
}

.backgroundPosition-rightTop {
  background-position: 100% 0;
}

.backgroundPosition-rightCenter {
  background-position: 100%;
}

.backgroundPosition-rightBottom {
  background-position: 100% 100%;
}

.backgroundPosition-centerTop {
  background-position: top;
}

.backgroundPosition-centerCenter {
  background-position: 50%;
}

.backgroundPosition-centerBottom {
  background-position: bottom;
}

// Background Repeat
// --------------------------------------------------------------------------

.backgroundRepeat-repeat {
  background-repeat: repeat;
}

.backgroundRepeat-repeatX {
  background-repeat: repeat-x;
}

.backgroundRepeat-repeatY {
  background-repeat: repeat-y;
}

.backgroundRepeat-noRepeat {
  background-repeat: no-repeat;
}

// Background Size
// --------------------------------------------------------------------------

.backgroundSize-cover {
  background-size: cover;
}

.backgroundSize-contain {
  background-size: contain;
}

.backgroundSize-auto {
  background-size: auto;
}