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


/*

 flex-direction

       .flex-dir-col    --->   column

       .flex-dir-row    --->   row

 */

.flex-dir-col {
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-dir-row {
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row; 
    flex-wrap: wrap;
}




/*

 flex-wrap

       .flex-wrap    --->   wrap

       .flex-wrap-rev    --->   wrap-reverse

 */

.flex-wrap{
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    flex-wrap: wrap;
}

.flex-wrap-rev{
    -webkit-flex-wrap: wrap-reverse;
    -moz-flex-wrap: wrap-reverse;
    flex-wrap: wrap-reverse;
}



/*

 justify-content

      .just-cont-cen    --->   center

      .just-cont-sp-aro    --->   space-around

      .just-cont-sp-bet    --->   space-between

 */
.just-cont-cen{

    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.just-cont-sp-aro{
    -webkit-justify-content: space-around;
    -ms-flex-pack: space-around;
    justify-content: space-around;
}


.just-cont-sp-bet{
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: space-between;
}





/*

 align-items

     .align-items-cen   --->   center

*/

.align-items-cen{
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}