@import 'variable.scss';
/* ==========================================================================
 *
 * File Name:         Align
 * Description:       Classes to align items left or right
 * Editing Details:   Do not change key-value pairs or variables in this file
                      as that may alter the functionality of Berry
 * Use:               Add the appropriate align class to any html element whose
                      alignment you want to change
 *
 ============================================================================ */


.align-left {
  text-align: left;
}

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

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

.align-justify {
  text-align: justify;
}

@each $breakpoint, $size in $breakpoints {
  @media (min-width: #{$size}) {
    .align-left-#{$breakpoint} {
      text-align: left;
    }
    .align-right-#{$breakpoint} {
      text-align: right;
    }
    .align-center-#{$breakpoint} {
      text-align: center;
    }
    .align-justify-#{$breakpoint} {
    text-align: justify;
    }
  }
}


/* Default alignment */
h1, h2, h3, h4, h5, h6, p {
  text-align: left;
}