/*!*************************
*****     FLEX.css     *****
***************************/

@layer utilities {
  .flex {
    display: flex;
  }

    .flex:where(.flex-row) {
      flex-flow: row nowrap;
    }

    .flex:where(.flex-row-wrap) {
      flex-flow: row wrap;
    }

    .flex:where(.flex-column) {
      flex-flow: column nowrap;
    }

    .flex:where(.flex-column-wrap) {
      flex-flow: column wrap;
    }

    /*
    * justify-content
    */
    .flex:where(.justify-content-normal) {
      justify-content: normal;
    }

    .flex:where(.justify-content-center) {
      justify-content: center;
    }

    .flex:where(.justify-content-start) {
      justify-content: start;
    }

    .flex:where(.justify-content-end) {
      justify-content: end;
    }

    .flex:where(.justify-content-between) {
      justify-content: space-between;
    }

    .flex:where(.justify-content-around) {
      justify-content: space-around;
    }

    .flex:where(.justify-content-evenly) {
      justify-content: space-evenly;
    }

    .flex:where(.justify-content-stretch) {
      justify-content: stretch;
    }

    /*
    * align-items
    */
    .flex:where(.align-items-normal) {
      align-items: normal;
    }

    .flex:where(.align-items-stretch) {
      align-items: stretch;
    }

    .flex:where(.align-items-center) {
      align-items: center;
    }

    .flex:where(.align-items-start) {
      align-items: start;
    }

    .flex:where(.align-items-end) {
      align-items: end;
    }

    /*
    * align-content
    */
    .flex:where(.align-content-normal) {
      align-content: normal;
    }

    .flex:where(.align-content-center) {
      align-content: center;
    }

    .flex:where(.align-content-start) {
      align-content: start;
    }

    .flex:where(.align-content-end) {
      align-content: end;
    }

    .flex:where(.align-content-between) {
      align-content: space-between;
    }

    .flex:where(.align-content-around) {
      align-content: space-around;
    }

    .flex:where(.align-content-evenly) {
      align-content: space-evenly;
    }

    .flex:where(.align-content-stretch) {
      align-content: stretch;
    } /*End of .flex */
}