<style>
.grid .row {
	flex-wrap: nowrap;
}
.grid .col {
	position: relative;
	padding-top: 0;
	padding-bottom: 0;
}
.grid span {
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 20px;
	height: 10000px;
	background-color: red;
	z-index: 10;
	opacity: 0.04;
	pointer-events: none;
	display: none;
}
@media(max-width: 1199px) {
	.grid span {
		margin: 0 15px;
	}
}
@media(max-width: 999px) {
	.grid span {
		margin: 0 10px;
	}
}
</style>
<div class="grid">
	<div class="container">
		<div class="row">
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
			<div class="col"><span></span></div>
		</div>
	</div>
</div>