/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v8.4.14,
* Autoprefixer: v10.4.7
* Browsers: last 4 version
*/

/* Atomic Styles */

/* ///////////////////// */


/****** COLORS */

/* --- Font Colors */

.color--black {
  color: var(--black);
}

.color--beige {
  color: var(--color_beige);
}

.color--green {
  color: var(--color_green);
}

.color--darkgreen {
  color: var(--color_darkgreen);
}

.color--lightgreen {
  color: var(--color_lightgreen);
}

.color--orange {
  color: var(--color_orange);
}

.color--red {
  color: var(--color_red);
}

.color--grey {
  color: var(--color_grey);
}

/* --- Fill Colors */

.fill--darkgreen {
  fill: var(--color_darkgreen);
}

.fill--orange {
  fill: var(--color_orange);
}


/**** Backgrounds */

.bg--blue {
  background-color: var(--blue);
}

.bg--green {
  background-color: var(--color_green);
}

.bg--white {
  background-color: var(--color_white);
}

/**** Position */

.pos-rel {
  position: relative;
}

/****** Spacing Reinforcer */

a.mt-lg-2 {
  display: inline-block;
}

.p.title.mt-lg-2 {
  display: inline-block;
}

/****** Max Widths */

.max-w--slim {
  max-width: 40rem;
}

.max-w--middle {
  max-width: 50rem;
}

/****** Border Radiuses */

.brad--small {
  border-radius: 0.5rem;
}

.brad--medium {
  border-radius: 1rem;
}

/****** Text Wrapping */

.nowrap {
  white-space: nowrap;
}

/**** Flex container */

.flex-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.flex-wrap.wrap {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.flex-wrap.gap-lg-1 {
  gap: 1rem;
}

.flex-wrap.gap-lg-2 {
  gap: 2rem;
}

.flex-wrap.dir-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.flex-wrap.center-lg {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.flex-wrap.middle-lg {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* TABLET //////////////////////////////////////////////////////////////// */
/*
01. Inner Content
*/

@media only screen and (max-width: 55em) {

  .flex-wrap.gap-md-05 {
    gap: 0.5rem;
  }

}