/*FLEXBOX*/
.flex {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    align-items: center;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
/**************************************************************************************************/

/*TEXT ALIGN*/
.al-center {
    text-align: center !important;
}

.al-left {
    text-align: left !important;
}

.al-right {
    text-align: right !important;
}

.al-justify {
    text-align: justify !important;
}

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

/*FLEX BASIS*/
.flex20 {
    flex-basis: 18.4%;
}

.flex25 {
    flex-basis: 23.5%;
}

.flex30 {
    flex-basis: 29%;
}

.flex32 {
    flex-basis: 32%;
}

.flex40 {
    flex-basis: 39%;
}

.flex50 {
    flex-basis: 49%;
    align-items: center;
    padding: 0px;
}

.flex60 {
    flex-basis: 59%;
}

.flex70 {
    flex-basis: 69%;
}

.flex75 {
    flex-basis: 74%;
}

.flex100 {
    flex-basis: 100%;
}
/**************************************************************************************************/

/*FLEX DIRECTION*/
.flex-row {
    flex-direction: row !important;
}

.flex-row-reverse {
    flex-direction: row-reverse !important;
}

.flex-column {
    flex-direction: column !important;
}

.flex-column-reverse {
    flex-direction: column-reverse !important;
}
/**************************************************************************************************/

/*FLEX WRAP*/
.flex-wrap {
    flex-wrap: wrap !important;
}

.flex-nowrap {
    flex-wrap: nowrap !important;
}
/**************************************************************************************************/

/*ALIGN CONTENT*/
.align-center {
    align-content: center !important;
}

.align-stretch {
    align-content: stretch !important;
}

.align-start {
    align-content: flex-start !important;
}

.align-end {
    align-content: flex-end !important;
}

.align-space-between {
    align-content: space-between !important;
}

.align-space-evenly {
    align-content: space-evenly !important;
}
/**************************************************************************************************/

/*JUSTIFY CONTENT*/
.justify-center {
    -webkit-justify-content: center !important;
    justify-content: center !important;
}

.justify-stretch {
    justify-content: stretch !important;
}

.justify-start {
    -webkit-justify-content: flex-start !important;
    justify-content: flex-start !important;
}

.justify-end {
    -webkit-justify-content: flex-end !important;
    justify-content: flex-end !important;
}

.justify-space-between {
    -webkit-justify-content: space-between !important;
    justify-content: space-between !important;
}

.justify-space-evenly {
    -webkit-justify-content: space-evenly !important;
    justify-content: space-evenly !important;
}
/**************************************************************************************************/

/*ALIGN ITEMS*/
.align-items-center {
    align-items: center !important;
}

.align-items-stretch {
    align-items: stretch !important;
}

.align-items-start {
    align-items: flex-start !important;
}

.align-items-end {
    align-items: flex-end !important;
}
/**************************************************************************************************/