/*
	FLEXBOX
	FLEX DISPLAY

	https://developer.mozilla.org/fr/docs/Web/CSS/align-content

===============================================================================

	FLEX CONTAINER
	-h = Horizontal
	-v = Vertical
	
-----------------------------------------------------------------------------*/

[class*="flex"]{
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.flex.selfstart {
align-self:flex-start;
}
.flex.selfcenter {
align-self:flex-center;
}
.flex.dirh{
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
justify-content: flex-start
}
.flex.dirv{
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
}
.flex.jcontent{
justify-content: center;
}

/* ============================================================================

	FLEX ITEMS

-----------------------------------------------------------------------------*/

.flex .first {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
min-width: 0;
}
.flex .item.start {
align-self:flex-start;
}
.flex .item.end {
align-self:flex-end;
}
.flex .item.stretch {
align-self: flex-stretch;
}
.flex .item.auto {
align-self: auto;
}
.flex .item.center{
align-self:center;
}

/* ============================================================================

	FLEX ORDER

-----------------------------------------------------------------------------*/

.flex .item.left-box,
.flex .item.ord1 {
-webkit-box-ordinal-group: 0;
-webkit-order: -1;
-ms-flex-order: -1;
order: -1;
}
.flex .item.right-box,
.flex .item.ord2 {
-webkit-box-ordinal-group: 1;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
}
.flex .item.ord3{
-webkit-box-ordinal-group: 2;
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
@media screen and (max-width : 980px) {
	.flex {
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-webkit-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	}
	.flex .item.right-box {
	-webkit-box-ordinal-group: 0;
	-webkit-order: -1;
	-ms-flex-order: -1;
	order: -1;
	}
	.flex .item.left-box {
	-webkit-box-ordinal-group: 1;
	-webkit-order: 0;
	-ms-flex-order: 0;
	order: 0;
	}
	.flex .right-box-none {
	position:absolute;
	left:-9999px;
	}
}