// Extras!
// extra classes that can help the layout of a page

// Text Alignments
.text-left {
  text-align: left;
}
.text-center {
  text-align: center;
}
.text-right {
  text-align: right;
}

// Center A Column
.col-centered {
  margin: 0 auto;
}

// Column Pushed Right
.col-right {
  margin: 0 0 0 auto;
}

// Allow a Column to Stretch to its siblings
.stretch {
  align-self: stretch;
}

@media screen and (max-width: $medium-breakpoint) {
  // text classes
  .md-text-left {
    text-align: left;
  }
  .md-text-center {
    text-align: center;
  }
  .md-text-right {
    text-align: right;
  }

  // column centering
  .md-col-center {
    margin: 0 auto;
  }
}

@media screen and (max-width: $small-breakpoint) {
  // text classes
  .sm-text-left {
    text-align: left;
  }
  .sm-text-center {
    text-align: center;
  }
  .sm-text-right {
    text-align: right;
  }

  // column centering
  .sm-col-center,
  .sm-col-centered {
    margin: 0 auto;
  }
}