/* Remove Alert Browser - DO NOT TOUCH */
@supports (display: grid) {
  #checkBrowserCompatibility {
    display: none !important;
  }
}

/*-----------------*/
/* GRID STRUCTURE */
/* Media Query : xl, lg, md, sm, xs */
/*-----------------*/

/*Taille des gouttières*/
.undergrid.gutter1 > *, .grid.gutter1,{grid-gap: 1px;}
.undergrid.gutter2 > *, .grid.gutter2{grid-gap: 2px;}
.undergrid.gutter5 > *, .grid.gutter5{grid-gap: 5px;}
.undergrid.gutter10 > *, .grid.gutter10{grid-gap: 10px;}
.undergrid.gutter20 > *, .grid.gutter20{grid-gap: 20px;}
.undergrid.gutter30 > *, .grid.gutter30{grid-gap: 30px;}
.undergrid.gutter40 > *, .grid.gutter40{grid-gap: 40px;}
.undergrid.gutter50 > *, .grid.gutter50{grid-gap: 50px;}
.undergrid.gutter60 > *, .grid.gutter60{grid-gap: 60px;}
.undergrid.gutter70 > *, .grid.gutter70{grid-gap: 70px;}
.undergrid.gutter80 > *, .grid.gutter80{grid-gap: 80px;}
.undergrid.gutter90 > *, .grid.gutter90{grid-gap: 90px;}
.undergrid.gutter100 > *, .grid.gutter100{grid-gap: 100px;}

.undergrid.gutterRow1 > *, .grid.gutterRow1,{grid-row-gap: 1px;}
.undergrid.gutterRow2 > *, .grid.gutterRow2{grid-row-gap: 2px;}
.undergrid.gutterRow5 > *, .grid.gutterRow5{grid-row-gap: 5px;}
.undergrid.gutterRow10 > *, .grid.gutterRow10{grid-row-gap: 10px;}
.undergrid.gutterRow20 > *, .grid.gutterRow20{grid-row-gap: 20px;}
.undergrid.gutterRow30 > *, .grid.gutterRow30{grid-row-gap: 30px;}
.undergrid.gutterRow40 > *, .grid.gutterRow40{grid-row-gap: 40px;}
.undergrid.gutterRow50 > *, .grid.gutterRow50{grid-row-gap: 50px;}
.undergrid.gutterRow60 > *, .grid.gutterRow60{grid-row-gap: 60px;}
.undergrid.gutterRow70 > *, .grid.gutterRow70{grid-row-gap: 70px;}
.undergrid.gutterRow80 > *, .grid.gutterRow80{grid-row-gap: 80px;}
.undergrid.gutterRow90 > *, .grid.gutterRow90{grid-row-gap: 90px;}
.undergrid.gutterRow100 > *, .grid.gutterRow100{grid-row-gap: 100px;}

.undergrid.gutterColumn1 > *, .grid.gutterColumn1,{grid-column-gap: 1px;}
.undergrid.gutterColumn2 > *, .grid.gutterColumn2{grid-column-gap: 2px;}
.undergrid.gutterColumn5 > *, .grid.gutterColumn5{grid-column-gap: 5px;}
.undergrid.gutterColumn10 > *, .grid.gutterColumn10{grid-column-gap: 10px;}
.undergrid.gutterColumn20 > *, .grid.gutterColumn20{grid-column-gap: 20px;}
.undergrid.gutterColumn30 > *, .grid.gutterColumn30{grid-column-gap: 30px;}
.undergrid.gutterColumn40 > *, .grid.gutterColumn40{grid-column-gap: 40px;}
.undergrid.gutterColumn50 > *, .grid.gutterColumn50{grid-column-gap: 50px;}
.undergrid.gutterColumn60 > *, .grid.gutterColumn60{grid-column-gap: 60px;}
.undergrid.gutterColumn70 > *, .grid.gutterColumn70{grid-column-gap: 70px;}
.undergrid.gutterColumn80 > *, .grid.gutterColumn80{grid-column-gap: 80px;}
.undergrid.gutterColumn90 > *, .grid.gutterColumn90{grid-column-gap: 90px;}
.undergrid.gutterColumn100 > *, .grid.gutterColumn100{grid-column-gap: 100px;}

/*Def Grid*/
.undergrid > *, .grid{
	display:grid;
	align-items: start;
	justify-items: stretch;
}

/* Alignement des items du conteneur grid/flex--------*/
/* Mode : vertical */
.undergrid.align-items_start > *, .grid.align-items_start{align-items: start;}
.undergrid.align-items_end > *, .grid.align-items_end{align-items: end;}
.undergrid.align-items_center > *, .grid.align-items_center{align-items: center;}
.undergrid.align-items_stretch > *, .grid.align-items_stretch{align-items: stretch;}
	.underflex.align-items_end > *, .flex.align-items_end{align-items:flex-end;}
	.underflex.align-items_center > *, .flex.align-items_center{align-items:center;}
	.underflex.align-items_start > *, .flex.align-items_start{align-items:flex-start;}
	.underflex.align-items_stretch > *, .flex.align-items_stretch{align-items:stretch;}
/* Mode : horizontal */
.undergrid.justify-items_start > *, .grid.justify-items_start{justify-items: start;}
.undergrid.justify-items_end > *, .grid.justify-items_end{justify-items: end;}
.undergrid.justify-items_center > *, .grid.justify-items_center{justify-items: center;}
.undergrid.justify-items_stretch > *, .grid.justify-items_stretch{justify-items: stretch;}
	.underflex.justify-items_end > *, .flex.justify-items_end{justify-items: flex-end;}
	.underflex.justify-items_start > *, .flex.justify-items_start{justify-items: flex-start;}
	.underflex.justify-items_center > *, .flex.justify-items_center{justify-items: center;}
	.underflex.justify-items_stretch > *, .flex.justify-items_stretch{justify-items: flex-stretch;}

/* Alignement du conteneur grid/flex --------*/
/* Mode : vertical */
.undergrid.align-content_start > *, .grid.align-content_start{align-content: start;}
.undergrid.align-content_end > *, .grid.align-content_end{align-content: end;}
.undergrid.align-content_center > *, .grid.align-content_center{align-content: center;}
.undergrid.align-content_stretch > *, .grid.align-content_stretch{align-content: stretch;}
	.underflex.align-content_start > *, .flex.align-content_start{align-content: flex-start;}
	.underflex.align-content_end > *, .flex.align-content_end{align-content: flex-end;}
	.underflex.align-content_center > *, .flex.align-content_center{align-content: center;}
	.underflex.align-content_stretch > *, .flex.align-content_stretch{align-content: stretch;}
/* Mode : horizontal */
.undergrid.justify-content_start > *, .grid.justify-content_start{justify-content: start;}
.undergrid.justify-content_end > *, .grid.justify-content_end{justify-content: end;}
.undergrid.justify-content_center > *, .grid.justify-content_center{justify-content: center;}
.undergrid.justify-content_stretch > *, .grid.justify-content_stretch{justify-content: stretch;}
.undergrid.justify-content_space-around > *, .grid.justify-content_space-around{justify-content: space-around;}
.undergrid.justify-content_space-between > *, .grid.justify-content_space-between{justify-content: space-between;}
.undergrid.justify-content_space-evenly > *, .grid.justify-content_space-evenly{justify-content: space-evenly;}
	.underflex.justify-content_start > *, .flex.justify-content_start{justify-content: flex-start;}
	.underflex.justify-content_end > *, .flex.justify-content_end{justify-content: flex-end;}
	.underflex.justify-content_center > *, .flex.justify-content_center{justify-content: center;}
	.underflex.justify-content_stretch > *, .flex.justify-content_stretch{justify-content: stretch;}
	.underflex.justify-content_space-around > *, .flex.justify-content_space-around{justify-content: space-around;}
	.underflex.justify-content_space-between > *, .flex.justify-content_space-between{justify-content: space-between;}
	.underflex.justify-content_space-evenly > *, .flex.justify-content_space-evenly{justify-content: space-evenly;}

/* Definition d'une grid en X colomns en largeur fixe */
.undergrid.g1 > *, .grid.g1{grid-template-columns: repeat(1, 1fr);}
.undergrid.g2 > *, .grid.g2{grid-template-columns: repeat(2, 1fr);}
.undergrid.g3 > *, .grid.g3{grid-template-columns: repeat(3, 1fr);}
.undergrid.g4 > *, .grid.g4{grid-template-columns: repeat(4, 1fr);}
.undergrid.g5 > *, .grid.g5{grid-template-columns: repeat(5, 1fr);}
.undergrid.g6 > *, .grid.g6{grid-template-columns: repeat(6, 1fr);}
.undergrid.g7 > *, .grid.g7{grid-template-columns: repeat(7, 1fr);}
.undergrid.g8 > *, .grid.g8{grid-template-columns: repeat(8, 1fr);}
.undergrid.g9 > *, .grid.g9{grid-template-columns: repeat(9, 1fr);}
.undergrid.g10 > *, .grid.g10{grid-template-columns: repeat(10, 1fr);}
.undergrid.g11 > *, .grid.g11{grid-template-columns: repeat(11, 1fr);}
.undergrid.g12 > *, .grid.g12{grid-template-columns: repeat(12, 1fr);}

/* Definition d'une grid en X colomns en largeur variable */
.undergrid.g1auto > *, .grid.g1auto{grid-template-columns: repeat(1, auto);}
.undergrid.g2auto > *, .grid.g2auto{grid-template-columns: repeat(2, auto);}
.undergrid.g3auto > *, .grid.g3auto{grid-template-columns: repeat(3, auto);}
.undergrid.g4auto > *, .grid.g4auto{grid-template-columns: repeat(4, auto);}
.undergrid.g5auto > *, .grid.g5auto{grid-template-columns: repeat(5, auto);}
.undergrid.g6auto > *, .grid.g6auto{grid-template-columns: repeat(6, auto);}
.undergrid.g7auto > *, .grid.g7auto{grid-template-columns: repeat(7, auto);}
.undergrid.g8auto > *, .grid.g8auto{grid-template-columns: repeat(8, auto);}
.undergrid.g9auto > *, .grid.g9auto{grid-template-columns: repeat(9, auto);}
.undergrid.g10auto > *, .grid.g10auto{grid-template-columns: repeat(10, auto);}


/* Définition d'une grid d'un nombre non défini de colones de grid mais dont la taille est de X px */
/* >> auto-fill : DES COLONES SUPPLEMENTAIRES SONT CRÉES AU BESOINS */
.undergrid.auto-fill-10  > *, .grid.auto-fill-10 {grid-template-columns: repeat(auto-fill, 10px);}
.undergrid.auto-fill-10  > *, .grid.auto-fill-10 {grid-template-columns: repeat(auto-fill, 10px);}
.undergrid.auto-fill-20  > *, .grid.auto-fill-20 {grid-template-columns: repeat(auto-fill, 20px);}
.undergrid.auto-fill-30  > *, .grid.auto-fill-30 {grid-template-columns: repeat(auto-fill, 30px);}
.undergrid.auto-fill-40  > *, .grid.auto-fill-40 {grid-template-columns: repeat(auto-fill, 40px);}
.undergrid.auto-fill-50  > *, .grid.auto-fill-50 {grid-template-columns: repeat(auto-fill, 50px);}
.undergrid.auto-fill-60  > *, .grid.auto-fill-60 {grid-template-columns: repeat(auto-fill, 60px);}
.undergrid.auto-fill-80  > *, .grid.auto-fill-80 {grid-template-columns: repeat(auto-fill, 80px);}
.undergrid.auto-fill-100 > *, .grid.auto-fill-100{grid-template-columns: repeat(auto-fill, 100px);}
.undergrid.auto-fill-120 > *, .grid.auto-fill-120{grid-template-columns: repeat(auto-fill, 120px);}
.undergrid.auto-fill-140 > *, .grid.auto-fill-140{grid-template-columns: repeat(auto-fill, 140px);}
.undergrid.auto-fill-160 > *, .grid.auto-fill-160{grid-template-columns: repeat(auto-fill, 160px);}
.undergrid.auto-fill-180 > *, .grid.auto-fill-180{grid-template-columns: repeat(auto-fill, 180px);}
.undergrid.auto-fill-200 > *, .grid.auto-fill-200{grid-template-columns: repeat(auto-fill, 200px);}
.undergrid.auto-fill-225 > *, .grid.auto-fill-225{grid-template-columns: repeat(auto-fill, 225px);}
.undergrid.auto-fill-250 > *, .grid.auto-fill-250{grid-template-columns: repeat(auto-fill, 250px);}
.undergrid.auto-fill-300 > *, .grid.auto-fill-300{grid-template-columns: repeat(auto-fill, 300px);}
.undergrid.auto-fill-350 > *, .grid.auto-fill-350{grid-template-columns: repeat(auto-fill, 350px);}
.undergrid.auto-fill-400 > *, .grid.auto-fill-400{grid-template-columns: repeat(auto-fill, 400px);}

/* >> auto-fit : DES COLONES SUPPLEMENTAIRES NE SONT ALORS PAS CRÉES */
.undergrid.auto-fit-10  > *, .grid.auto-fit-10 {grid-template-columns: repeat(auto-fit, 10px);}
.undergrid.auto-fit-10  > *, .grid.auto-fit-10 {grid-template-columns: repeat(auto-fit, 10px);}
.undergrid.auto-fit-20  > *, .grid.auto-fit-20 {grid-template-columns: repeat(auto-fit, 20px);}
.undergrid.auto-fit-30  > *, .grid.auto-fit-30 {grid-template-columns: repeat(auto-fit, 30px);}
.undergrid.auto-fit-40  > *, .grid.auto-fit-40 {grid-template-columns: repeat(auto-fit, 40px);}
.undergrid.auto-fit-50  > *, .grid.auto-fit-50 {grid-template-columns: repeat(auto-fit, 50px);}
.undergrid.auto-fit-60  > *, .grid.auto-fit-60 {grid-template-columns: repeat(auto-fit, 60px);}
.undergrid.auto-fit-80  > *, .grid.auto-fit-80 {grid-template-columns: repeat(auto-fit, 80px);}
.undergrid.auto-fit-90  > *, .grid.auto-fit-90 {grid-template-columns: repeat(auto-fit, 90px);}
.undergrid.auto-fit-100 > *, .grid.auto-fit-100{grid-template-columns: repeat(auto-fit, 100px);}
.undergrid.auto-fit-120 > *, .grid.auto-fit-120{grid-template-columns: repeat(auto-fit, 120px);}
.undergrid.auto-fit-140 > *, .grid.auto-fit-140{grid-template-columns: repeat(auto-fit, 140px);}
.undergrid.auto-fit-160 > *, .grid.auto-fit-160{grid-template-columns: repeat(auto-fit, 160px);}
.undergrid.auto-fit-180 > *, .grid.auto-fit-180{grid-template-columns: repeat(auto-fit, 180px);}
.undergrid.auto-fit-200 > *, .grid.auto-fit-200{grid-template-columns: repeat(auto-fit, 200px);}
.undergrid.auto-fit-225 > *, .grid.auto-fit-225{grid-template-columns: repeat(auto-fit, 225px);}
.undergrid.auto-fit-250 > *, .grid.auto-fit-250{grid-template-columns: repeat(auto-fit, 250px);}
.undergrid.auto-fit-300 > *, .grid.auto-fit-300{grid-template-columns: repeat(auto-fit, 300px);}
.undergrid.auto-fit-350 > *, .grid.auto-fit-350{grid-template-columns: repeat(auto-fit, 350px);}
.undergrid.auto-fit-400 > *, .grid.auto-fit-400{grid-template-columns: repeat(auto-fit, 400px);}

/* >> (minmax)auto-fill : DES COLONES SUPPLEMENTAIRES SONT CRÉES AU BESOINS d'une taille min de Xpx et max de 1fr */
.undergrid.auto-fill-min10  > *, .grid.auto-fill-min10 {grid-template-columns: repeat(auto-fill, minmax(10px, 1fr));}
.undergrid.auto-fill-min20  > *, .grid.auto-fill-min20 {grid-template-columns: repeat(auto-fill, minmax(20px, 1fr));}
.undergrid.auto-fill-min30  > *, .grid.auto-fill-min30 {grid-template-columns: repeat(auto-fill, minmax(30px, 1fr));}
.undergrid.auto-fill-min40  > *, .grid.auto-fill-min40 {grid-template-columns: repeat(auto-fill, minmax(40px, 1fr));}
.undergrid.auto-fill-min50  > *, .grid.auto-fill-min50 {grid-template-columns: repeat(auto-fill, minmax(50px, 1fr));}
.undergrid.auto-fill-min60  > *, .grid.auto-fill-min60 {grid-template-columns: repeat(auto-fill, minmax(60px, 1fr));}
.undergrid.auto-fill-min80  > *, .grid.auto-fill-min80 {grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));}
.undergrid.auto-fill-min100 > *, .grid.auto-fill-min100{grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));}
.undergrid.auto-fill-min120 > *, .grid.auto-fill-min120{grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));}
.undergrid.auto-fill-min140 > *, .grid.auto-fill-min140{grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));}
.undergrid.auto-fill-min160 > *, .grid.auto-fill-min160{grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));}
.undergrid.auto-fill-min180 > *, .grid.auto-fill-min180{grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));}
.undergrid.auto-fill-min200 > *, .grid.auto-fill-min200{grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));}
.undergrid.auto-fill-min225 > *, .grid.auto-fill-min225{grid-template-columns: repeat(auto-fill, minmax(225px, 1fr));}
.undergrid.auto-fill-min250 > *, .grid.auto-fill-min250{grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));}
.undergrid.auto-fill-min300 > *, .grid.auto-fill-min300{grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));}
.undergrid.auto-fill-min350 > *, .grid.auto-fill-min350{grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));}
.undergrid.auto-fill-min400 > *, .grid.auto-fill-min400{grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));}

/* >> (minmax)auto-fit : DES COLONES SUPPLEMENTAIRES NE SONT ALORS PAS CRÉES d'une taille min de Xpx et max de 1fr */
.undergrid.auto-fit-min10  > *, .grid.auto-fit-min10 {grid-template-columns: repeat(auto-fit, minmax(10px, 1fr));}
.undergrid.auto-fit-min20  > *, .grid.auto-fit-min20 {grid-template-columns: repeat(auto-fit, minmax(20px, 1fr));}
.undergrid.auto-fit-min30  > *, .grid.auto-fit-min30 {grid-template-columns: repeat(auto-fit, minmax(30px, 1fr));}
.undergrid.auto-fit-min40  > *, .grid.auto-fit-min40 {grid-template-columns: repeat(auto-fit, minmax(40px, 1fr));}
.undergrid.auto-fit-min50  > *, .grid.auto-fit-min50 {grid-template-columns: repeat(auto-fit, minmax(50px, 1fr));}
.undergrid.auto-fit-min60  > *, .grid.auto-fit-min60 {grid-template-columns: repeat(auto-fit, minmax(60px, 1fr));}
.undergrid.auto-fit-min80  > *, .grid.auto-fit-min80 {grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));}
.undergrid.auto-fit-min100 > *, .grid.auto-fit-min100{grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));}
.undergrid.auto-fit-min120 > *, .grid.auto-fit-min120{grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));}
.undergrid.auto-fit-min140 > *, .grid.auto-fit-min140{grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));}
.undergrid.auto-fit-min160 > *, .grid.auto-fit-min160{grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));}
.undergrid.auto-fit-min180 > *, .grid.auto-fit-min180{grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));}
.undergrid.auto-fit-min200 > *, .grid.auto-fit-min200{grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));}
.undergrid.auto-fit-min225 > *, .grid.auto-fit-min225{grid-template-columns: repeat(auto-fit, minmax(225px, 1fr));}
.undergrid.auto-fit-min250 > *, .grid.auto-fit-min250{grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));}
.undergrid.auto-fit-min300 > *, .grid.auto-fit-min300{grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));}
.undergrid.auto-fit-min350 > *, .grid.auto-fit-min350{grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));}
.undergrid.auto-fit-min400 > *, .grid.auto-fit-min400{grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));}

/* Colspan for grid */
.grid > .col.c1{grid-column: span 1;}
.grid > .col.c2{grid-column: span 2;}
.grid > .col.c3{grid-column: span 3;}
.grid > .col.c4{grid-column: span 4;}
.grid > .col.c5{grid-column: span 5;}
.grid > .col.c6{grid-column: span 6;}
.grid > .col.c7{grid-column: span 7;}
.grid > .col.c8{grid-column: span 8;}
.grid > .col.c9{grid-column: span 9;}

/* Colspan auto-correct */
.grid.g1>.col.c2, .grid.g1>.col.c3, .grid.g1>.col.c4, .grid.g1>.col.c5, .grid.g1>.col.c6 {grid-column: span 1 !important;}
.grid.g2>.col.c3, .grid.g2>.col.c4, .grid.g2>.col.c5, .grid.g2>.col.c6 {grid-column: span 2 !important;}
.grid.g3>.col.c4, .grid.g3>.col.c5, .grid.g3>.col.c6 {grid-column: span 3 !important;}
.grid.g4>.col.c5, .grid.g4>.col.c6 {grid-column: span 4 !important;}
.grid.g5>.col.c6 {grid-column: span 5 !important;}

/* Rowspan for grid */
.grid > .col.rowspan1{grid-row: span 1;}
.grid > .col.rowspan2{grid-row: span 2;}
.grid > .col.rowspan3{grid-row: span 3;}
.grid > .col.rowspan4{grid-row: span 4;}
.grid > .col.rowspan5{grid-row: span 5;}
.grid > .col.rowspan6{grid-row: span 6;}
.grid > .col.rowspan7{grid-row: span 7;}
.grid > .col.rowspan8{grid-row: span 8;}
.grid > .col.rowspan9{grid-row: span 9;}

/*-----------------*/
/* FLEX STRUCTURE */
/* Media Query : xl, lg, md, sm, xs */
/*-----------------*/

/* Def Flex */
.underflex > *, .flex{
	display: flex;
	align-items: flex-start;
	justify-items: stretch;
}

/* Flex row Direction */
.underflex.row > *, .flex.row {
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.underflex.row.reverse > *, .flex.row.reverse{
	flex-direction: row-reverse;
}

/* Flex col Direction */
.underflex.col > *, .flex.col {
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}

/* Flex wrap */
.underflex.wrap> *, .flex.wrap{flex-wrap: wrap;}

/* Flex predéfinir un nombre de grid en flex */
.underflex.f1 > * > *, .flex.f1 > * {width: 100%;}
.underflex.f2 > * > *, .flex.f2 > * {width: 50%;}
.underflex.f3 > * > *, .flex.f3 > * {width: calc(100% / 3);}
.underflex.f4 > * > *, .flex.f4 > * {width: 25%;}
.underflex.f5 > * > *, .flex.f5 > * {width: 20%;}
.underflex.f6 > * > *, .flex.f6 > * {width: calc(100% / 6);}

.underflex.forcedwidth.f1 > * > *, .flex.forcedwidth.f1 > * {min-width: 100%!important;}
.underflex.forcedwidth.f2 > * > *, .flex.forcedwidth.f2 > * {min-width: 50%!important;}
.underflex.forcedwidth.f3 > * > *, .flex.forcedwidth.f3 > * {min-width: calc(100% / 3)!important;}
.underflex.forcedwidth.f4 > * > *, .flex.forcedwidth.f4 > * {min-width: 25%!important;}
.underflex.forcedwidth.f5 > * > *, .flex.forcedwidth.f5 > * {min-width: 20%!important;}
.underflex.forcedwidth.f6 > * > *, .flex.forcedwidth.f6 > * {min-width: calc(100% / 6)!important;}


/* colspan for flex */
.underflex > * > .col.c1, .flex > .col.c1{ width: calc(100% / 6); }
.underflex > * > .col.c2, .flex > .col.c2{ width: calc(100% / 6 * 2); }
.underflex > * > .col.c3, .flex > .col.c3{ width: calc(100% / 6 * 3); }
.underflex > * > .col.c4, .flex > .col.c4{ width: calc(100% / 6 * 4); }
.underflex > * > .col.c5, .flex > .col.c5{ width: calc(100% / 6 * 5); }
.underflex > * > .col.c6, .flex > .col.c6{ width: 100%; }


/*-----------------*/
/* RESPONSIVE STRUCTURE */
/* Media Query : xl, lg, md, sm, xs */
/*-----------------*/

@media  (max-width:1480px) {
	.undergrid.xl-1 > *, .grid.xl-1{grid-template-columns: repeat(1, 1fr) !important;}
	.undergrid.xl-2 > *, .grid.xl-2{grid-template-columns: repeat(2, 1fr) !important;}
	.undergrid.xl-3 > *, .grid.xl-3{grid-template-columns: repeat(3, 1fr) !important;}
	.undergrid.xl-4 > *, .grid.xl-4{grid-template-columns: repeat(4, 1fr) !important;}
	.undergrid.xl-5 > *, .grid.xl-5{grid-template-columns: repeat(5, 1fr) !important;}
	.undergrid.xl-6 > *, .grid.xl-6{grid-template-columns: repeat(6, 1fr) !important;}

	.grid > .col.xl-1{grid-column: span 1 !important;}
	.grid > .col.xl-2{grid-column: span 2 !important;}
	.grid > .col.xl-3{grid-column: span 3 !important;}
	.grid > .col.xl-4{grid-column: span 4 !important;}
	.grid > .col.xl-5{grid-column: span 5 !important;}
	.grid > .col.xl-6{grid-column: span 6 !important;}

	.grid.xl-1 > .col:not([class*="xl-"]),
	.grid.xl-2 > .col:not([class*="xl-"]),
	.grid.xl-3 > .col:not([class*="xl-"]),
	.grid.xl-4 > .col:not([class*="xl-"]),
	.grid.xl-5 > .col:not([class*="xl-"]),
	.grid.xl-6 > .col:not([class*="xl-"]){grid-column: span 1 !important;}

	.grid.xl-1 > .col.xl-2{grid-column: span 1 !important;}
	.grid.xl-1 > .col.xl-3{grid-column: span 1 !important;}
	.grid.xl-1 > .col.xl-4{grid-column: span 1 !important;}
	.grid.xl-1 > .col.xl-5{grid-column: span 1 !important;}
	.grid.xl-1 > .col.xl-6{grid-column: span 1 !important;}
	.grid.xl-2 > .col.xl-3{grid-column: span 2 !important;}
	.grid.xl-2 > .col.xl-4{grid-column: span 2 !important;}
	.grid.xl-2 > .col.xl-5{grid-column: span 2 !important;}
	.grid.xl-2 > .col.xl-6{grid-column: span 2 !important;}
	.grid.xl-3 > .col.xl-4{grid-column: span 3 !important;}
	.grid.xl-3 > .col.xl-5{grid-column: span 3 !important;}
	.grid.xl-3 > .col.xl-6{grid-column: span 3 !important;}
	.grid.xl-4 > .col.xl-5{grid-column: span 4 !important;}
	.grid.xl-4 > .col.xl-6{grid-column: span 4 !important;}
	.grid.xl-5 > .col.xl-6{grid-column: span 5 !important;}

	.underflex.xl-1 > * > *, .flex.xl-1 > * {width: 100% !important;}
	.underflex.xl-2 > * > *, .flex.xl-2 > * {width: 50% !important;}
	.underflex.xl-3 > * > *, .flex.xl-3 > * {width: calc(100% / 3) !important;}
	.underflex.xl-4 > * > *, .flex.xl-4 > * {width: 25% !important;}
	.underflex.xl-5 > * > *, .flex.xl-5 > * {width: 20% !important;}
	.underflex.xl-6 > * > *, .flex.xl-6 > * {width: calc(100% / 6) !important;}

	.underflex.forcedwidth.xl-1 > * > *, .flex.forcedwidth.xl-1 > * {min-width: 100% !important;}
	.underflex.forcedwidth.xl-2 > * > *, .flex.forcedwidth.xl-2 > * {min-width: 50% !important;}
	.underflex.forcedwidth.xl-3 > * > *, .flex.forcedwidth.xl-3 > * {min-width: calc(100% / 3) !important;}
	.underflex.forcedwidth.xl-4 > * > *, .flex.forcedwidth.xl-4 > * {min-width: 25% !important;}
	.underflex.forcedwidth.xl-5 > * > *, .flex.forcedwidth.xl-5 > * {min-width: 20% !important;}
	.underflex.forcedwidth.xl-6 > * > *, .flex.forcedwidth.xl-6 > * {min-width: calc(100% / 6) !important;}

	.underflex > * > .col.c1, .flex > .col.xl-1{ width: calc(100% / 6); }
	.underflex > * > .col.c2, .flex > .col.xl-2{ width: calc(100% / 6 * 2); }
	.underflex > * > .col.c3, .flex > .col.xl-3{ width: calc(100% / 6 * 3); }
	.underflex > * > .col.c4, .flex > .col.xl-4{ width: calc(100% / 6 * 4); }
	.underflex > * > .col.c5, .flex > .col.xl-5{ width: calc(100% / 6 * 5); }
	.underflex > * > .col.c6, .flex > .col.xl-6{ width: 100%; }


	/* Alignement des items du conteneur grid/flex--------*/
	/* Mode : vertical */
	.undergrid.xl-align-items_start > *, .grid.xl-align-items_start{align-items: start;}
	.undergrid.xl-align-items_end > *, .grid.xl-align-items_end{align-items: end;}
	.undergrid.xl-align-items_center > *, .grid.xl-align-items_center{align-items: center;}
	.undergrid.xl-align-items_stretch > *, .grid.xl-align-items_stretch{align-items: stretch;}
		.underflex.xl-align-items_end > *, .flex.xl-align-items_end{align-items:flex-end;}
		.underflex.xl-align-items_center > *, .flex.xl-align-items_center{align-items:center;}
		.underflex.xl-align-items_start > *, .flex.xl-align-items_start{align-items:flex-start;}
		.underflex.xl-align-items_stretch > *, .flex.xl-align-items_stretch{align-items:stretch;}
	/* Mode : horizontal */
	.undergrid.xl-justify-items_start > *, .grid.xl-justify-items_start{justify-items: start;}
	.undergrid.xl-justify-items_end > *, .grid.xl-justify-items_end{justify-items: end;}
	.undergrid.xl-justify-items_center > *, .grid.xl-justify-items_center{justify-items: center;}
	.undergrid.xl-justify-items_stretch > *, .grid.xl-justify-items_stretch{justify-items: stretch;}
		.underflex.xl-justify-items_end > *, .flex.xl-justify-items_end{justify-items: flex-end;}
		.underflex.xl-justify-items_start > *, .flex.xl-justify-items_start{justify-items: flex-start;}
		.underflex.xl-justify-items_center > *, .flex.xl-justify-items_center{justify-items: center;}
		.underflex.xl-justify-items_stretch > *, .flex.xl-justify-items_stretch{justify-items: flex-stretch;}

	/* Alignement du conteneur grid/flex --------*/
	/* Mode : vertical */
	.undergrid.xl-align-content_start > *, .grid.xl-align-content_start{align-content: start;}
	.undergrid.xl-align-content_end > *, .grid.xl-align-content_end{align-content: end;}
	.undergrid.xl-align-content_center > *, .grid.xl-align-content_center{align-content: center;}
	.undergrid.xl-align-content_stretch > *, .grid.xl-align-content_stretch{align-content: stretch;}
		.underflex.xl-align-content_start > *, .flex.xl-align-content_start{align-content: flex-start;}
		.underflex.xl-align-content_end > *, .flex.xl-align-content_end{align-content: flex-end;}
		.underflex.xl-align-content_center > *, .flex.xl-align-content_center{align-content: center;}
		.underflex.xl-align-content_stretch > *, .flex.xl-align-content_stretch{align-content: stretch;}
	/* Mode : horizontal */
	.undergrid.xl-justify-content_start > *, .grid.xl-justify-content_start{justify-content: start;}
	.undergrid.xl-justify-content_end > *, .grid.xl-justify-content_end{justify-content: end;}
	.undergrid.xl-justify-content_center > *, .grid.xl-justify-content_center{justify-content: center;}
	.undergrid.xl-justify-content_stretch > *, .grid.xl-justify-content_stretch{justify-content: stretch;}
	.undergrid.xl-justify-content_space-around > *, .grid.xl-justify-content_space-around{justify-content: space-around;}
	.undergrid.xl-justify-content_space-between > *, .grid.xl-justify-content_space-between{justify-content: space-between;}
	.undergrid.xl-justify-content_space-evenly > *, .grid.xl-justify-content_space-evenly{justify-content: space-evenly;}
		.underflex.xl-justify-content_start > *, .flex.xl-justify-content_start{justify-content: flex-start;}
		.underflex.xl-justify-content_end > *, .flex.xl-justify-content_end{justify-content: flex-end;}
		.underflex.xl-justify-content_center > *, .flex.xl-justify-content_center{justify-content: center;}
		.underflex.xl-justify-content_stretch > *, .flex.xl-justify-content_stretch{justify-content: stretch;}
		.underflex.xl-justify-content_space-around > *, .flex.xl-justify-content_space-around{justify-content: space-around;}
		.underflex.xl-justify-content_space-between > *, .flex.xl-justify-content_space-between{justify-content: space-between;}
		.underflex.xl-justify-content_space-evenly > *, .flex.xl-justify-content_space-evenly{justify-content: space-evenly;}

}

@media (max-width:1280px) {
	.undergrid.lg-1 > *, .grid.lg-1{grid-template-columns: repeat(1, 1fr) !important;}
	.undergrid.lg-2 > *, .grid.lg-2{grid-template-columns: repeat(2, 1fr) !important;}
	.undergrid.lg-3 > *, .grid.lg-3{grid-template-columns: repeat(3, 1fr) !important;}
	.undergrid.lg-4 > *, .grid.lg-4{grid-template-columns: repeat(4, 1fr) !important;}
	.undergrid.lg-5 > *, .grid.lg-5{grid-template-columns: repeat(5, 1fr) !important;}
	.undergrid.lg-6 > *, .grid.lg-6{grid-template-columns: repeat(6, 1fr) !important;}

	.grid > .col.lg-1{grid-column: span 1 !important;}
	.grid > .col.lg-2{grid-column: span 2 !important;}
	.grid > .col.lg-3{grid-column: span 3 !important;}
	.grid > .col.lg-4{grid-column: span 4 !important;}
	.grid > .col.lg-5{grid-column: span 5 !important;}
	.grid > .col.lg-6{grid-column: span 6 !important;}

	.grid.lg-1 > .col:not([class*="lg-"]),
	.grid.lg-2 > .col:not([class*="lg-"]),
	.grid.lg-3 > .col:not([class*="lg-"]),
	.grid.lg-4 > .col:not([class*="lg-"]),
	.grid.lg-5 > .col:not([class*="lg-"]),
	.grid.lg-6 > .col:not([class*="lg-"]){grid-column: span 1 !important;}

	.grid.lg-1 > .col.lg-2{grid-column: span 1 !important;}
	.grid.lg-1 > .col.lg-3{grid-column: span 1 !important;}
	.grid.lg-1 > .col.lg-4{grid-column: span 1 !important;}
	.grid.lg-1 > .col.lg-5{grid-column: span 1 !important;}
	.grid.lg-1 > .col.lg-6{grid-column: span 1 !important;}
	.grid.lg-2 > .col.lg-3{grid-column: span 2 !important;}
	.grid.lg-2 > .col.lg-4{grid-column: span 2 !important;}
	.grid.lg-2 > .col.lg-5{grid-column: span 2 !important;}
	.grid.lg-2 > .col.lg-6{grid-column: span 2 !important;}
	.grid.lg-3 > .col.lg-4{grid-column: span 3 !important;}
	.grid.lg-3 > .col.lg-5{grid-column: span 3 !important;}
	.grid.lg-3 > .col.lg-6{grid-column: span 3 !important;}
	.grid.lg-4 > .col.lg-5{grid-column: span 4 !important;}
	.grid.lg-4 > .col.lg-6{grid-column: span 4 !important;}
	.grid.lg-5 > .col.lg-6{grid-column: span 5 !important;}

	.underflex.lg-1 > * > *, .flex.lg-1 > * {width: 100% !important;}
	.underflex.lg-2 > * > *, .flex.lg-2 > * {width: 50% !important;}
	.underflex.lg-3 > * > *, .flex.lg-3 > * {width: calc(100% / 3) !important;}
	.underflex.lg-4 > * > *, .flex.lg-4 > * {width: 25% !important;}
	.underflex.lg-5 > * > *, .flex.lg-5 > * {width: 20% !important;}
	.underflex.lg-6 > * > *, .flex.lg-6 > * {width: calc(100% / 6) !important;}

	.underflex.forcedwidth.lg-1 > * > *, .flex.forcedwidth.lg-1 > * {min-width: 100% !important;}
	.underflex.forcedwidth.lg-2 > * > *, .flex.forcedwidth.lg-2 > * {min-width: 50% !important;}
	.underflex.forcedwidth.lg-3 > * > *, .flex.forcedwidth.lg-3 > * {min-width: calc(100% / 3) !important;}
	.underflex.forcedwidth.lg-4 > * > *, .flex.forcedwidth.lg-4 > * {min-width: 25% !important;}
	.underflex.forcedwidth.lg-5 > * > *, .flex.forcedwidth.lg-5 > * {min-width: 20% !important;}
	.underflex.forcedwidth.lg-6 > * > *, .flex.forcedwidth.lg-6 > * {min-width: calc(100% / 6) !important;}

	.underflex > * > .col.c1, .flex > .col.lg-1{ width: calc(100% / 6); }
	.underflex > * > .col.c2, .flex > .col.lg-2{ width: calc(100% / 6 * 2); }
	.underflex > * > .col.c3, .flex > .col.lg-3{ width: calc(100% / 6 * 3); }
	.underflex > * > .col.c4, .flex > .col.lg-4{ width: calc(100% / 6 * 4); }
	.underflex > * > .col.c5, .flex > .col.lg-5{ width: calc(100% / 6 * 5); }
	.underflex > * > .col.c6, .flex > .col.lg-6{ width: 100%; }

	/* Alignement des items du conteneur grid/flex--------*/
	/* Mode : vertical */
	.undergrid.lg-align-items_start > *, .grid.lg-align-items_start{align-items: start;}
	.undergrid.lg-align-items_end > *, .grid.lg-align-items_end{align-items: end;}
	.undergrid.lg-align-items_center > *, .grid.lg-align-items_center{align-items: center;}
	.undergrid.lg-align-items_stretch > *, .grid.lg-align-items_stretch{align-items: stretch;}
		.underflex.lg-align-items_end > *, .flex.lg-align-items_end{align-items:flex-end;}
		.underflex.lg-align-items_center > *, .flex.lg-align-items_center{align-items:center;}
		.underflex.lg-align-items_start > *, .flex.lg-align-items_start{align-items:flex-start;}
		.underflex.lg-align-items_stretch > *, .flex.lg-align-items_stretch{align-items:stretch;}
	/* Mode : horizontal */
	.undergrid.lg-justify-items_start > *, .grid.lg-justify-items_start{justify-items: start;}
	.undergrid.lg-justify-items_end > *, .grid.lg-justify-items_end{justify-items: end;}
	.undergrid.lg-justify-items_center > *, .grid.lg-justify-items_center{justify-items: center;}
	.undergrid.lg-justify-items_stretch > *, .grid.lg-justify-items_stretch{justify-items: stretch;}
		.underflex.lg-justify-items_end > *, .flex.lg-justify-items_end{justify-items: flex-end;}
		.underflex.lg-justify-items_start > *, .flex.lg-justify-items_start{justify-items: flex-start;}
		.underflex.lg-justify-items_center > *, .flex.lg-justify-items_center{justify-items: center;}
		.underflex.lg-justify-items_stretch > *, .flex.lg-justify-items_stretch{justify-items: flex-stretch;}

	/* Alignement du conteneur grid/flex --------*/
	/* Mode : vertical */
	.undergrid.lg-align-content_start > *, .grid.lg-align-content_start{align-content: start;}
	.undergrid.lg-align-content_end > *, .grid.lg-align-content_end{align-content: end;}
	.undergrid.lg-align-content_center > *, .grid.lg-align-content_center{align-content: center;}
	.undergrid.lg-align-content_stretch > *, .grid.lg-align-content_stretch{align-content: stretch;}
		.underflex.lg-align-content_start > *, .flex.lg-align-content_start{align-content: flex-start;}
		.underflex.lg-align-content_end > *, .flex.lg-align-content_end{align-content: flex-end;}
		.underflex.lg-align-content_center > *, .flex.lg-align-content_center{align-content: center;}
		.underflex.lg-align-content_stretch > *, .flex.lg-align-content_stretch{align-content: stretch;}
	/* Mode : horizontal */
	.undergrid.lg-justify-content_start > *, .grid.lg-justify-content_start{justify-content: start;}
	.undergrid.lg-justify-content_end > *, .grid.lg-justify-content_end{justify-content: end;}
	.undergrid.lg-justify-content_center > *, .grid.lg-justify-content_center{justify-content: center;}
	.undergrid.lg-justify-content_stretch > *, .grid.lg-justify-content_stretch{justify-content: stretch;}
	.undergrid.lg-justify-content_space-around > *, .grid.lg-justify-content_space-around{justify-content: space-around;}
	.undergrid.lg-justify-content_space-between > *, .grid.lg-justify-content_space-between{justify-content: space-between;}
	.undergrid.lg-justify-content_space-evenly > *, .grid.lg-justify-content_space-evenly{justify-content: space-evenly;}
		.underflex.lg-justify-content_start > *, .flex.lg-justify-content_start{justify-content: flex-start;}
		.underflex.lg-justify-content_end > *, .flex.lg-justify-content_end{justify-content: flex-end;}
		.underflex.lg-justify-content_center > *, .flex.lg-justify-content_center{justify-content: center;}
		.underflex.lg-justify-content_stretch > *, .flex.lg-justify-content_stretch{justify-content: stretch;}
		.underflex.lg-justify-content_space-around > *, .flex.lg-justify-content_space-around{justify-content: space-around;}
		.underflex.lg-justify-content_space-between > *, .flex.lg-justify-content_space-between{justify-content: space-between;}
		.underflex.lg-justify-content_space-evenly > *, .flex.lg-justify-content_space-evenly{justify-content: space-evenly;}
}

@media (max-width:1024px) {
	.undergrid.md-1 > *, .grid.md-1{grid-template-columns: repeat(1, 1fr) !important;}
	.undergrid.md-2 > *, .grid.md-2{grid-template-columns: repeat(2, 1fr) !important;}
	.undergrid.md-3 > *, .grid.md-3{grid-template-columns: repeat(3, 1fr) !important;}
	.undergrid.md-4 > *, .grid.md-4{grid-template-columns: repeat(4, 1fr) !important;}
	.undergrid.md-5 > *, .grid.md-5{grid-template-columns: repeat(5, 1fr) !important;}
	.undergrid.md-6 > *, .grid.md-6{grid-template-columns: repeat(6, 1fr) !important;}

	.grid > .col.md-1{grid-column: span 1 !important;}
	.grid > .col.md-2{grid-column: span 2 !important;}
	.grid > .col.md-3{grid-column: span 3 !important;}
	.grid > .col.md-4{grid-column: span 4 !important;}
	.grid > .col.md-5{grid-column: span 5 !important;}
	.grid > .col.md-6{grid-column: span 6 !important;}

	.grid.md-1 > .col:not([class*="md-"]),
	.grid.md-2 > .col:not([class*="md-"]),
	.grid.md-3 > .col:not([class*="md-"]),
	.grid.md-4 > .col:not([class*="md-"]),
	.grid.md-5 > .col:not([class*="md-"]),
	.grid.md-6 > .col:not([class*="md-"]){grid-column: span 1 !important;}

	.grid.md-1 > .col.md-2{grid-column: span 1 !important;}
	.grid.md-1 > .col.md-3{grid-column: span 1 !important;}
	.grid.md-1 > .col.md-4{grid-column: span 1 !important;}
	.grid.md-1 > .col.md-5{grid-column: span 1 !important;}
	.grid.md-1 > .col.md-6{grid-column: span 1 !important;}
	.grid.md-2 > .col.md-3{grid-column: span 2 !important;}
	.grid.md-2 > .col.md-4{grid-column: span 2 !important;}
	.grid.md-2 > .col.md-5{grid-column: span 2 !important;}
	.grid.md-2 > .col.md-6{grid-column: span 2 !important;}
	.grid.md-3 > .col.md-4{grid-column: span 3 !important;}
	.grid.md-3 > .col.md-5{grid-column: span 3 !important;}
	.grid.md-3 > .col.md-6{grid-column: span 3 !important;}
	.grid.md-4 > .col.md-5{grid-column: span 4 !important;}
	.grid.md-4 > .col.md-6{grid-column: span 4 !important;}
	.grid.md-5 > .col.md-6{grid-column: span 5 !important;}

	.underflex.md-1 > * > *, .flex.md-1 > * {width: 100% !important;}
	.underflex.md-2 > * > *, .flex.md-2 > * {width: 50% !important;}
	.underflex.md-3 > * > *, .flex.md-3 > * {width: calc(100% / 3) !important;}
	.underflex.md-4 > * > *, .flex.md-4 > * {width: 25% !important;}
	.underflex.md-5 > * > *, .flex.md-5 > * {width: 20% !important;}
	.underflex.md-6 > * > *, .flex.md-6 > * {width: calc(100% / 6) !important;}

	.underflex.forcedwidth.md-1 > * > *, .flex.forcedwidth.md-1 > * {min-width: 100% !important;}
	.underflex.forcedwidth.md-2 > * > *, .flex.forcedwidth.md-2 > * {min-width: 50% !important;}
	.underflex.forcedwidth.md-3 > * > *, .flex.forcedwidth.md-3 > * {min-width: calc(100% / 3) !important;}
	.underflex.forcedwidth.md-4 > * > *, .flex.forcedwidth.md-4 > * {min-width: 25% !important;}
	.underflex.forcedwidth.md-5 > * > *, .flex.forcedwidth.md-5 > * {min-width: 20% !important;}
	.underflex.forcedwidth.md-6 > * > *, .flex.forcedwidth.md-6 > * {min-width: calc(100% / 6) !important;}

	.underflex > * > .col.c1, .flex > .col.md-1{ width: calc(100% / 6); }
	.underflex > * > .col.c2, .flex > .col.md-2{ width: calc(100% / 6 * 2); }
	.underflex > * > .col.c3, .flex > .col.md-3{ width: calc(100% / 6 * 3); }
	.underflex > * > .col.c4, .flex > .col.md-4{ width: calc(100% / 6 * 4); }
	.underflex > * > .col.c5, .flex > .col.md-5{ width: calc(100% / 6 * 5); }
	.underflex > * > .col.c6, .flex > .col.md-6{ width: 100%; }

	/* Alignement des items du conteneur grid/flex--------*/
	/* Mode : vertical */
	.undergrid.md-align-items_start > *, .grid.md-align-items_start{align-items: start;}
	.undergrid.md-align-items_end > *, .grid.md-align-items_end{align-items: end;}
	.undergrid.md-align-items_center > *, .grid.md-align-items_center{align-items: center;}
	.undergrid.md-align-items_stretch > *, .grid.md-align-items_stretch{align-items: stretch;}
		.underflex.md-align-items_end > *, .flex.md-align-items_end{align-items:flex-end;}
		.underflex.md-align-items_center > *, .flex.md-align-items_center{align-items:center;}
		.underflex.md-align-items_start > *, .flex.md-align-items_start{align-items:flex-start;}
		.underflex.md-align-items_stretch > *, .flex.md-align-items_stretch{align-items:stretch;}
	/* Mode : horizontal */
	.undergrid.md-justify-items_start > *, .grid.md-justify-items_start{justify-items: start;}
	.undergrid.md-justify-items_end > *, .grid.md-justify-items_end{justify-items: end;}
	.undergrid.md-justify-items_center > *, .grid.md-justify-items_center{justify-items: center;}
	.undergrid.md-justify-items_stretch > *, .grid.md-justify-items_stretch{justify-items: stretch;}
		.underflex.md-justify-items_end > *, .flex.md-justify-items_end{justify-items: flex-end;}
		.underflex.md-justify-items_start > *, .flex.md-justify-items_start{justify-items: flex-start;}
		.underflex.md-justify-items_center > *, .flex.md-justify-items_center{justify-items: center;}
		.underflex.md-justify-items_stretch > *, .flex.md-justify-items_stretch{justify-items: flex-stretch;}

	/* Alignement du conteneur grid/flex --------*/
	/* Mode : vertical */
	.undergrid.md-align-content_start > *, .grid.md-align-content_start{align-content: start;}
	.undergrid.md-align-content_end > *, .grid.md-align-content_end{align-content: end;}
	.undergrid.md-align-content_center > *, .grid.md-align-content_center{align-content: center;}
	.undergrid.md-align-content_stretch > *, .grid.md-align-content_stretch{align-content: stretch;}
		.underflex.md-align-content_start > *, .flex.md-align-content_start{align-content: flex-start;}
		.underflex.md-align-content_end > *, .flex.md-align-content_end{align-content: flex-end;}
		.underflex.md-align-content_center > *, .flex.md-align-content_center{align-content: center;}
		.underflex.md-align-content_stretch > *, .flex.md-align-content_stretch{align-content: stretch;}
	/* Mode : horizontal */
	.undergrid.md-justify-content_start > *, .grid.md-justify-content_start{justify-content: start;}
	.undergrid.md-justify-content_end > *, .grid.md-justify-content_end{justify-content: end;}
	.undergrid.md-justify-content_center > *, .grid.md-justify-content_center{justify-content: center;}
	.undergrid.md-justify-content_stretch > *, .grid.md-justify-content_stretch{justify-content: stretch;}
	.undergrid.md-justify-content_space-around > *, .grid.md-justify-content_space-around{justify-content: space-around;}
	.undergrid.md-justify-content_space-between > *, .grid.md-justify-content_space-between{justify-content: space-between;}
	.undergrid.md-justify-content_space-evenly > *, .grid.md-justify-content_space-evenly{justify-content: space-evenly;}
		.underflex.md-justify-content_start > *, .flex.md-justify-content_start{justify-content: flex-start;}
		.underflex.md-justify-content_end > *, .flex.md-justify-content_end{justify-content: flex-end;}
		.underflex.md-justify-content_center > *, .flex.md-justify-content_center{justify-content: center;}
		.underflex.md-justify-content_stretch > *, .flex.md-justify-content_stretch{justify-content: stretch;}
		.underflex.md-justify-content_space-around > *, .flex.md-justify-content_space-around{justify-content: space-around;}
		.underflex.md-justify-content_space-between > *, .flex.md-justify-content_space-between{justify-content: space-between;}
		.underflex.md-justify-content_space-evenly > *, .flex.md-justify-content_space-evenly{justify-content: space-evenly;}
}

@media (max-width:767px) {
	.undergrid.sm-1 > *, .grid.sm-1{grid-template-columns: repeat(1, 1fr) !important;}
	.undergrid.sm-2 > *, .grid.sm-2{grid-template-columns: repeat(2, 1fr) !important;}
	.undergrid.sm-3 > *, .grid.sm-3{grid-template-columns: repeat(3, 1fr) !important;}
	.undergrid.sm-4 > *, .grid.sm-4{grid-template-columns: repeat(4, 1fr) !important;}
	.undergrid.sm-5 > *, .grid.sm-5{grid-template-columns: repeat(5, 1fr) !important;}
	.undergrid.sm-6 > *, .grid.sm-6{grid-template-columns: repeat(6, 1fr) !important;}

	.grid > .col.sm-1{grid-column: span 1 !important;}
	.grid > .col.sm-2{grid-column: span 2 !important;}
	.grid > .col.sm-3{grid-column: span 3 !important;}
	.grid > .col.sm-4{grid-column: span 4 !important;}
	.grid > .col.sm-5{grid-column: span 5 !important;}
	.grid > .col.sm-6{grid-column: span 6 !important;}

	.grid.sm-1 > .col:not([class*="sm-"]),
	.grid.sm-2 > .col:not([class*="sm-"]),
	.grid.sm-3 > .col:not([class*="sm-"]),
	.grid.sm-4 > .col:not([class*="sm-"]),
	.grid.sm-5 > .col:not([class*="sm-"]),
	.grid.sm-6 > .col:not([class*="sm-"]){grid-column: span 1 !important;}

	.grid.sm-1 > .col.sm-2{grid-column: span 1 !important;}
	.grid.sm-1 > .col.sm-3{grid-column: span 1 !important;}
	.grid.sm-1 > .col.sm-4{grid-column: span 1 !important;}
	.grid.sm-1 > .col.sm-5{grid-column: span 1 !important;}
	.grid.sm-1 > .col.sm-6{grid-column: span 1 !important;}
	.grid.sm-2 > .col.sm-3{grid-column: span 2 !important;}
	.grid.sm-2 > .col.sm-4{grid-column: span 2 !important;}
	.grid.sm-2 > .col.sm-5{grid-column: span 2 !important;}
	.grid.sm-2 > .col.sm-6{grid-column: span 2 !important;}
	.grid.sm-3 > .col.sm-4{grid-column: span 3 !important;}
	.grid.sm-3 > .col.sm-5{grid-column: span 3 !important;}
	.grid.sm-3 > .col.sm-6{grid-column: span 3 !important;}
	.grid.sm-4 > .col.sm-5{grid-column: span 4 !important;}
	.grid.sm-4 > .col.sm-6{grid-column: span 4 !important;}
	.grid.sm-5 > .col.sm-6{grid-column: span 5 !important;}

	.underflex.sm-1 > * > *, .flex.sm-1 > * {width: 100% !important;}
	.underflex.sm-2 > * > *, .flex.sm-2 > * {width: 50% !important;}
	.underflex.sm-3 > * > *, .flex.sm-3 > * {width: calc(100% / 3) !important;}
	.underflex.sm-4 > * > *, .flex.sm-4 > * {width: 25% !important;}
	.underflex.sm-5 > * > *, .flex.sm-5 > * {width: 20% !important;}
	.underflex.sm-6 > * > *, .flex.sm-6 > * {width: calc(100% / 6) !important;}

	.underflex.forcedwidth.sm-1 > * > *, .flex.forcedwidth.sm-1 > * {min-width: 100% !important;}
	.underflex.forcedwidth.sm-2 > * > *, .flex.forcedwidth.sm-2 > * {min-width: 50% !important;}
	.underflex.forcedwidth.sm-3 > * > *, .flex.forcedwidth.sm-3 > * {min-width: calc(100% / 3) !important;}
	.underflex.forcedwidth.sm-4 > * > *, .flex.forcedwidth.sm-4 > * {min-width: 25% !important;}
	.underflex.forcedwidth.sm-5 > * > *, .flex.forcedwidth.sm-5 > * {min-width: 20% !important;}
	.underflex.forcedwidth.sm-6 > * > *, .flex.forcedwidth.sm-6 > * {min-width: calc(100% / 6) !important;}

	.underflex > * > .col.c1, .flex > .col.sm-1{ width: calc(100% / 6); }
	.underflex > * > .col.c2, .flex > .col.sm-2{ width: calc(100% / 6 * 2); }
	.underflex > * > .col.c3, .flex > .col.sm-3{ width: calc(100% / 6 * 3); }
	.underflex > * > .col.c4, .flex > .col.sm-4{ width: calc(100% / 6 * 4); }
	.underflex > * > .col.c5, .flex > .col.sm-5{ width: calc(100% / 6 * 5); }
	.underflex > * > .col.c6, .flex > .col.sm-6{ width: 100%; }

	/* Alignement des items du conteneur grid/flex--------*/
	/* Mode : vertical */
	.undergrid.sm-align-items_start > *, .grid.sm-align-items_start{align-items: start;}
	.undergrid.sm-align-items_end > *, .grid.sm-align-items_end{align-items: end;}
	.undergrid.sm-align-items_center > *, .grid.sm-align-items_center{align-items: center;}
	.undergrid.sm-align-items_stretch > *, .grid.sm-align-items_stretch{align-items: stretch;}
		.underflex.sm-align-items_end > *, .flex.sm-align-items_end{align-items:flex-end;}
		.underflex.sm-align-items_center > *, .flex.sm-align-items_center{align-items:center;}
		.underflex.sm-align-items_start > *, .flex.sm-align-items_start{align-items:flex-start;}
		.underflex.sm-align-items_stretch > *, .flex.sm-align-items_stretch{align-items:stretch;}
	/* Mode : horizontal */
	.undergrid.sm-justify-items_start > *, .grid.sm-justify-items_start{justify-items: start;}
	.undergrid.sm-justify-items_end > *, .grid.sm-justify-items_end{justify-items: end;}
	.undergrid.sm-justify-items_center > *, .grid.sm-justify-items_center{justify-items: center;}
	.undergrid.sm-justify-items_stretch > *, .grid.sm-justify-items_stretch{justify-items: stretch;}
		.underflex.sm-justify-items_end > *, .flex.sm-justify-items_end{justify-items: flex-end;}
		.underflex.sm-justify-items_start > *, .flex.sm-justify-items_start{justify-items: flex-start;}
		.underflex.sm-justify-items_center > *, .flex.sm-justify-items_center{justify-items: center;}
		.underflex.sm-justify-items_stretch > *, .flex.sm-justify-items_stretch{justify-items: flex-stretch;}

	/* Alignement du conteneur grid/flex --------*/
	/* Mode : vertical */
	.undergrid.sm-align-content_start > *, .grid.sm-align-content_start{align-content: start;}
	.undergrid.sm-align-content_end > *, .grid.sm-align-content_end{align-content: end;}
	.undergrid.sm-align-content_center > *, .grid.sm-align-content_center{align-content: center;}
	.undergrid.sm-align-content_stretch > *, .grid.sm-align-content_stretch{align-content: stretch;}
		.underflex.sm-align-content_start > *, .flex.sm-align-content_start{align-content: flex-start;}
		.underflex.sm-align-content_end > *, .flex.sm-align-content_end{align-content: flex-end;}
		.underflex.sm-align-content_center > *, .flex.sm-align-content_center{align-content: center;}
		.underflex.sm-align-content_stretch > *, .flex.sm-align-content_stretch{align-content: stretch;}
	/* Mode : horizontal */
	.undergrid.sm-justify-content_start > *, .grid.sm-justify-content_start{justify-content: start;}
	.undergrid.sm-justify-content_end > *, .grid.sm-justify-content_end{justify-content: end;}
	.undergrid.sm-justify-content_center > *, .grid.sm-justify-content_center{justify-content: center;}
	.undergrid.sm-justify-content_stretch > *, .grid.sm-justify-content_stretch{justify-content: stretch;}
	.undergrid.sm-justify-content_space-around > *, .grid.sm-justify-content_space-around{justify-content: space-around;}
	.undergrid.sm-justify-content_space-between > *, .grid.sm-justify-content_space-between{justify-content: space-between;}
	.undergrid.sm-justify-content_space-evenly > *, .grid.sm-justify-content_space-evenly{justify-content: space-evenly;}
		.underflex.sm-justify-content_start > *, .flex.sm-justify-content_start{justify-content: flex-start;}
		.underflex.sm-justify-content_end > *, .flex.sm-justify-content_end{justify-content: flex-end;}
		.underflex.sm-justify-content_center > *, .flex.sm-justify-content_center{justify-content: center;}
		.underflex.sm-justify-content_stretch > *, .flex.sm-justify-content_stretch{justify-content: stretch;}
		.underflex.sm-justify-content_space-around > *, .flex.sm-justify-content_space-around{justify-content: space-around;}
		.underflex.sm-justify-content_space-between > *, .flex.sm-justify-content_space-between{justify-content: space-between;}
		.underflex.sm-justify-content_space-evenly > *, .flex.sm-justify-content_space-evenly{justify-content: space-evenly;}
}

@media(max-width: 480px) {
	.undergrid.xs-1 > *, .grid.xs-1{grid-template-columns: repeat(1, 1fr) !important;}
	.undergrid.xs-2 > *, .grid.xs-2{grid-template-columns: repeat(2, 1fr) !important;}
	.undergrid.xs-3 > *, .grid.xs-3{grid-template-columns: repeat(3, 1fr) !important;}
	.undergrid.xs-4 > *, .grid.xs-4{grid-template-columns: repeat(4, 1fr) !important;}
	.undergrid.xs-5 > *, .grid.xs-5{grid-template-columns: repeat(5, 1fr) !important;}
	.undergrid.xs-6 > *, .grid.xs-6{grid-template-columns: repeat(6, 1fr) !important;}

	.grid > .col.xs-1{grid-column: span 1 !important;}
	.grid > .col.xs-2{grid-column: span 2 !important;}
	.grid > .col.xs-3{grid-column: span 3 !important;}
	.grid > .col.xs-4{grid-column: span 4 !important;}
	.grid > .col.xs-5{grid-column: span 5 !important;}
	.grid > .col.xs-6{grid-column: span 6 !important;}

	.grid.xs-1 > .col:not([class*="xs-"]),
	.grid.xs-2 > .col:not([class*="xs-"]),
	.grid.xs-3 > .col:not([class*="xs-"]),
	.grid.xs-4 > .col:not([class*="xs-"]),
	.grid.xs-5 > .col:not([class*="xs-"]),
	.grid.xs-6 > .col:not([class*="xs-"]){grid-column: span 1 !important;}

	.grid.xs-1 > .col.xs-2{grid-column: span 1 !important;}
	.grid.xs-1 > .col.xs-3{grid-column: span 1 !important;}
	.grid.xs-1 > .col.xs-4{grid-column: span 1 !important;}
	.grid.xs-1 > .col.xs-5{grid-column: span 1 !important;}
	.grid.xs-1 > .col.xs-6{grid-column: span 1 !important;}
	.grid.xs-2 > .col.xs-3{grid-column: span 2 !important;}
	.grid.xs-2 > .col.xs-4{grid-column: span 2 !important;}
	.grid.xs-2 > .col.xs-5{grid-column: span 2 !important;}
	.grid.xs-2 > .col.xs-6{grid-column: span 2 !important;}
	.grid.xs-3 > .col.xs-4{grid-column: span 3 !important;}
	.grid.xs-3 > .col.xs-5{grid-column: span 3 !important;}
	.grid.xs-3 > .col.xs-6{grid-column: span 3 !important;}
	.grid.xs-4 > .col.xs-5{grid-column: span 4 !important;}
	.grid.xs-4 > .col.xs-6{grid-column: span 4 !important;}
	.grid.xs-5 > .col.xs-6{grid-column: span 5 !important;}

	.underflex.xs-1 > * > *, .flex.xs-1 > * {width: 100% !important;}
	.underflex.xs-2 > * > *, .flex.xs-2 > * {width: 50% !important;}
	.underflex.xs-3 > * > *, .flex.xs-3 > * {width: calc(100% / 3) !important;}
	.underflex.xs-4 > * > *, .flex.xs-4 > * {width: 25% !important;}
	.underflex.xs-5 > * > *, .flex.xs-5 > * {width: 20% !important;}
	.underflex.xs-6 > * > *, .flex.xs-6 > * {width: calc(100% / 6) !important;}

	.underflex.forcedwidth.xs-1 > * > *, .flex.forcedwidth.xs-1 > * {min-width: 100% !important;}
	.underflex.forcedwidth.xs-2 > * > *, .flex.forcedwidth.xs-2 > * {min-width: 50% !important;}
	.underflex.forcedwidth.xs-3 > * > *, .flex.forcedwidth.xs-3 > * {min-width: calc(100% / 3) !important;}
	.underflex.forcedwidth.xs-4 > * > *, .flex.forcedwidth.xs-4 > * {min-width: 25% !important;}
	.underflex.forcedwidth.xs-5 > * > *, .flex.forcedwidth.xs-5 > * {min-width: 20% !important;}
	.underflex.forcedwidth.xs-6 > * > *, .flex.forcedwidth.xs-6 > * {min-width: calc(100% / 6) !important;}

	.underflex > * > .col.c1, .flex > .col.xs-1{ width: calc(100% / 6); }
	.underflex > * > .col.c2, .flex > .col.xs-2{ width: calc(100% / 6 * 2); }
	.underflex > * > .col.c3, .flex > .col.xs-3{ width: calc(100% / 6 * 3); }
	.underflex > * > .col.c4, .flex > .col.xs-4{ width: calc(100% / 6 * 4); }
	.underflex > * > .col.c5, .flex > .col.xs-5{ width: calc(100% / 6 * 5); }
	.underflex > * > .col.c6, .flex > .col.xs-6{ width: 100%; }

	/* Alignement des items du conteneur grid/flex--------*/
	/* Mode : vertical */
	.undergrid.xs-align-items_start > *, .grid.xs-align-items_start{align-items: start;}
	.undergrid.xs-align-items_end > *, .grid.xs-align-items_end{align-items: end;}
	.undergrid.xs-align-items_center > *, .grid.xs-align-items_center{align-items: center;}
	.undergrid.xs-align-items_stretch > *, .grid.xs-align-items_stretch{align-items: stretch;}
		.underflex.xs-align-items_end > *, .flex.xs-align-items_end{align-items:flex-end;}
		.underflex.xs-align-items_center > *, .flex.xs-align-items_center{align-items:center;}
		.underflex.xs-align-items_start > *, .flex.xs-align-items_start{align-items:flex-start;}
		.underflex.xs-align-items_stretch > *, .flex.xs-align-items_stretch{align-items:stretch;}
	/* Mode : horizontal */
	.undergrid.xs-justify-items_start > *, .grid.xs-justify-items_start{justify-items: start;}
	.undergrid.xs-justify-items_end > *, .grid.xs-justify-items_end{justify-items: end;}
	.undergrid.xs-justify-items_center > *, .grid.xs-justify-items_center{justify-items: center;}
	.undergrid.xs-justify-items_stretch > *, .grid.xs-justify-items_stretch{justify-items: stretch;}
		.underflex.xs-justify-items_end > *, .flex.xs-justify-items_end{justify-items: flex-end;}
		.underflex.xs-justify-items_start > *, .flex.xs-justify-items_start{justify-items: flex-start;}
		.underflex.xs-justify-items_center > *, .flex.xs-justify-items_center{justify-items: center;}
		.underflex.xs-justify-items_stretch > *, .flex.xs-justify-items_stretch{justify-items: flex-stretch;}

	/* Alignement du conteneur grid/flex --------*/
	/* Mode : vertical */
	.undergrid.xs-align-content_start > *, .grid.xs-align-content_start{align-content: start;}
	.undergrid.xs-align-content_end > *, .grid.xs-align-content_end{align-content: end;}
	.undergrid.xs-align-content_center > *, .grid.xs-align-content_center{align-content: center;}
	.undergrid.xs-align-content_stretch > *, .grid.xs-align-content_stretch{align-content: stretch;}
		.underflex.xs-align-content_start > *, .flex.xs-align-content_start{align-content: flex-start;}
		.underflex.xs-align-content_end > *, .flex.xs-align-content_end{align-content: flex-end;}
		.underflex.xs-align-content_center > *, .flex.xs-align-content_center{align-content: center;}
		.underflex.xs-align-content_stretch > *, .flex.xs-align-content_stretch{align-content: stretch;}
	/* Mode : horizontal */
	.undergrid.xs-justify-content_start > *, .grid.xs-justify-content_start{justify-content: start;}
	.undergrid.xs-justify-content_end > *, .grid.xs-justify-content_end{justify-content: end;}
	.undergrid.xs-justify-content_center > *, .grid.xs-justify-content_center{justify-content: center;}
	.undergrid.xs-justify-content_stretch > *, .grid.xs-justify-content_stretch{justify-content: stretch;}
	.undergrid.xs-justify-content_space-around > *, .grid.xs-justify-content_space-around{justify-content: space-around;}
	.undergrid.xs-justify-content_space-between > *, .grid.xs-justify-content_space-between{justify-content: space-between;}
	.undergrid.xs-justify-content_space-evenly > *, .grid.xs-justify-content_space-evenly{justify-content: space-evenly;}
		.underflex.xs-justify-content_start > *, .flex.xs-justify-content_start{justify-content: flex-start;}
		.underflex.xs-justify-content_end > *, .flex.xs-justify-content_end{justify-content: flex-end;}
		.underflex.xs-justify-content_center > *, .flex.xs-justify-content_center{justify-content: center;}
		.underflex.xs-justify-content_stretch > *, .flex.xs-justify-content_stretch{justify-content: stretch;}
		.underflex.xs-justify-content_space-around > *, .flex.xs-justify-content_space-around{justify-content: space-around;}
		.underflex.xs-justify-content_space-between > *, .flex.xs-justify-content_space-between{justify-content: space-between;}
		.underflex.xs-justify-content_space-evenly > *, .flex.xs-justify-content_space-evenly{justify-content: space-evenly;}
}