/***** CONTAINERS *****/

.container-fluid{
	margin-left:  auto;
	margin-right: auto;
	width: 100%;
}

.container{
	margin-left:  auto;
	margin-right: auto;
	width: 100%;
}

.row{
	display: flex;
	flex-wrap: wrap;
}

.col-12{
	flex: 0 0 auto;
	width: 100%;
}

.col-11{
	flex: 0 0 auto;
	width: 91.6666666667%;
}

.col-10{
	flex: 0 0 auto;
	width: 83.3333333333%;
}

.col-9{
	flex: 0 0 auto;
	width: 75%;
}

.col-8{
	flex: 0 0 auto;
	width: 66.6666666667%;
}

.col-7{
	flex: 0 0 auto;
	width: 58.3333333333%;
}

.col-6{
	flex: 0 0 auto;
	width: 50%;
}

.col-5{
	flex: 0 0 auto;
	width: 41.66666667%;
}

.col-4{
	flex: 0 0 auto;
	width: 33.3333333333%;
}

.col-3{
	flex: 0 0 auto;
	width: 25%;
}

.col-2{
	flex: 0 0 auto;
	width: 16.6666666667%;
}

.col-1{
	flex: 0 0 auto;
	width: 8.33333333333%;
}




/* SM > 576px */
@media(min-width: 576px){

	.container{
		max-width:  576px;
	}

	.col-sm-12{
		flex: 0 0 auto;
		width: 100%;
	}

	.col-sm-11{
		flex: 0 0 auto;
		width: 91.6666666667%;
	}

	.col-sm-10{
		flex: 0 0 auto;
		width: 83.3333333333%;
	}

	.col-sm-9{
		flex: 0 0 auto;
		width: 75%;
	}

	.col-sm-8{
		flex: 0 0 auto;
		width: 66.6666666667%;
	}

	.col-sm-7{
		flex: 0 0 auto;
		width: 58.3333333333%;
	}

	.col-sm-6{
		flex: 0 0 auto;
		width: 50%;
	}

	.col-sm-5{
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-sm-4{
		flex: 0 0 auto;
		width: 33.3333333333%;
	}

	.col-sm-3{
		flex: 0 0 auto;
		width: 25%;
	}

	.col-sm-2{
		flex: 0 0 auto;
		width: 16.6666666667%;
	}

	.col-sm-1{
		flex: 0 0 auto;
		width: 8.33333333333%;
	}

}

/* MD > 768px */
@media(min-width: 768px){

	.container{
		max-width:  768px;
	}

	.col-md-12{
		flex: 0 0 auto;
		width: 100%;
	}

	.col-md-11{
		flex: 0 0 auto;
		width: 91.6666666667%;
	}

	.col-md-10{
		flex: 0 0 auto;
		width: 83.3333333333%;
	}

	.col-md-9{
		flex: 0 0 auto;
		width: 75%;
	}

	.col-md-8{
		flex: 0 0 auto;
		width: 66.6666666667%;
	}

	.col-md-7{
		flex: 0 0 auto;
		width: 58.3333333333%;
	}

	.col-md-6{
		flex: 0 0 auto;
		width: 50%;
	}

	.col-md-5{
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-md-4{
		flex: 0 0 auto;
		width: 33.3333333333%;
	}

	.col-md-3{
		flex: 0 0 auto;
		width: 25%;
	}

	.col-md-2{
		flex: 0 0 auto;
		width: 16.6666666667%;
	}

	.col-md-1{
		flex: 0 0 auto;
		width: 8.33333333333%;
	}

}

/* LG > 992px */
@media(min-width: 992px){

	.container{
		max-width:  992px;
	}

	.col-lg-12{
		flex: 0 0 auto;
		width: 100%;
	}

	.col-lg-11{
		flex: 0 0 auto;
		width: 91.6666666667%;
	}

	.col-lg-10{
		flex: 0 0 auto;
		width: 83.3333333333%;
	}

	.col-lg-9{
		flex: 0 0 auto;
		width: 75%;
	}

	.col-lg-8{
		flex: 0 0 auto;
		width: 66.6666666667%;
	}

	.col-lg-7{
		flex: 0 0 auto;
		width: 58.3333333333%;
	}

	.col-lg-6{
		flex: 0 0 auto;
		width: 50%;
	}

	.col-lg-5{
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-lg-4{
		flex: 0 0 auto;
		width: 33.3333333333%;
	}

	.col-lg-3{
		flex: 0 0 auto;
		width: 25%;
	}

	.col-lg-2{
		flex: 0 0 auto;
		width: 16.6666666667%;
	}

	.col-lg-1{
		flex: 0 0 auto;
		width: 8.33333333333%;
	}

}

/* XL > 1200px */
@media(min-width: 1200px){

	.container{
		max-width:  1200px;
	}

	.col-xl-12{
		flex: 0 0 auto;
		width: 100%;
	}

	.col-xl-11{
		flex: 0 0 auto;
		width: 91.6666666667%;
	}

	.col-xl-10{
		flex: 0 0 auto;
		width: 83.3333333333%;
	}

	.col-xl-9{
		flex: 0 0 auto;
		width: 75%;
	}

	.col-xl-8{
		flex: 0 0 auto;
		width: 66.6666666667%;
	}

	.col-xl-7{
		flex: 0 0 auto;
		width: 58.3333333333%;
	}

	.col-xl-6{
		flex: 0 0 auto;
		width: 50%;
	}

	.col-xl-5{
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-xl-4{
		flex: 0 0 auto;
		width: 33.3333333333%;
	}

	.col-xl-3{
		flex: 0 0 auto;
		width: 25%;
	}

	.col-xl-2{
		flex: 0 0 auto;
		width: 16.6666666667%;
	}

	.col-xl-1{
		flex: 0 0 auto;
		width: 8.33333333333%;
	}

}

/* xxL > 1400px */
@media(min-width: 1400px){

	.container{
		max-width:  1400px;
	}

	.col-xxl-12{
		flex: 0 0 auto;
		width: 100%;
	}

	.col-xxl-11{
		flex: 0 0 auto;
		width: 91.6666666667%;
	}

	.col-xxl-10{
		flex: 0 0 auto;
		width: 83.3333333333%;
	}

	.col-xxl-9{
		flex: 0 0 auto;
		width: 75%;
	}

	.col-xxl-8{
		flex: 0 0 auto;
		width: 66.6666666667%;
	}

	.col-xxl-7{
		flex: 0 0 auto;
		width: 58.3333333333%;
	}

	.col-xxl-6{
		flex: 0 0 auto;
		width: 50%;
	}

	.col-xxl-5{
		flex: 0 0 auto;
		width: 41.66666667%;
	}

	.col-xxl-4{
		flex: 0 0 auto;
		width: 33.3333333333%;
	}

	.col-xxl-3{
		flex: 0 0 auto;
		width: 25%;
	}

	.col-xxl-2{
		flex: 0 0 auto;
		width: 16.6666666667%;
	}

	.col-xxl-1{
		flex: 0 0 auto;
		width: 8.33333333333%;
	}

}





