.col-row {
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
	margin-right: -10px;
	&.disable-cols-gap {
		div[class*="col-desk"] {
			padding-left: 0;
			padding-right: 0;
		}
	}
	&.disable-rows-gap {
		div[class*="col-desk"] {
			padding-top: 0;
			padding-bottom: 0;
		}
	}
}

.col-desk-1, .col-desk-2, .col-desk-3, .col-desk-4, .col-desk-5, .col-desk-6, .col-tab-1, .col-tab-2, .col-tab-3, .col-tab-4, .col-tab-5, .col-tab-6, .col-mob-1, .col-mob-2, .col-mob-3, .col-mob-4, .col-mob-5, .col-mob-6 {
	position: relative;
	min-height: 1px;
	padding: 10px;
	box-sizing: border-box;
	width: 100%;
}

.col-mob-1 {
	flex: 0 0 100%;
	max-width: 100%;
}
.col-mob-2 {
	flex: 0 0 50%;
	max-width: 50%;
}
.col-mob-3 {
	flex: 0 0 33.33333%;
	max-width: 33.33333%;
}
.col-mob-4 {
	flex: 0 0 25%;
	max-width: 25%;
}
.col-mob-5 {
	flex: 0 0 20%;
	max-width: 20%;
}
.col-mob-6 {
	flex: 0 0 16.66666%;
	max-width: 16.66666%;
}

@media ( min-width: 768px ) {
	.col-tab-1 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.col-tab-2 {
		flex: 0 0 50%;
		max-width: 50%;
	}
	.col-tab-3 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%;
	}
	.col-tab-4 {
		flex: 0 0 25%;
		max-width: 25%;
	}
	.col-tab-5 {
		flex: 0 0 20%;
		max-width: 20%;
	}
	.col-tab-6 {
		flex: 0 0 16.66666%;
		max-width: 16.66666%;
	}
}

@media ( min-width: 1025px ) {
	.col-desk-1 {
		flex: 0 0 100%;
		max-width: 100%;
	}
	.col-desk-2 {
		flex: 0 0 50%;
		max-width: 50%;
	}
	.col-desk-3 {
		flex: 0 0 33.33333%;
		max-width: 33.33333%;
	}
	.col-desk-4 {
		flex: 0 0 25%;
		max-width: 25%;
	}
	.col-desk-5 {
		flex: 0 0 20%;
		max-width: 20%;
	}
	.col-desk-6 {
		flex: 0 0 16.66666%;
		max-width: 16.66666%;
	}
}