/* Grid 4 column */
.grid-container {}

.grid-container > .inner {
	display: flex;
	justify-content: flex-start;
	align-items: inherit;
	flex-wrap: wrap;
}

.grid-container > .inner > .item {
	width: 100%;
	padding: 10px 5px;
}
.grid-container > .inner > .item.-text-center {
	text-align: center;
}
.grid-container > .inner > .item.-text-right {
	text-align: right;
}
.grid-container.-no-padding > .inner > .item {
	width: 100%;
	padding: 10px 0;
}

.grid-container > .inner.-column-2-mobile > .item {
	width: calc(50% - 10px);
}
.grid-container.-no-padding > .inner.-column-2-mobile > .item {
	width: 50%;
}
.grid-container > .inner.-column-2-mobile > .item.-full {
	width: calc(100% - 10px);
}
.grid-container.-no-padding > .inner.-column-2-mobile > .item.-full {
	width: 100%;
}

.grid-container > .inner.-column-3-mobile > .item {
	width: calc(33.3% - 10px);
}
.grid-container.-no-padding > .inner.-column-3-mobile > .item {
	width: 33.3%;
}
.grid-container > .inner.-column-3-mobile > .item.-full {
	width: calc(100% - 10px);
}
.grid-container.-no-padding > .inner.-column-3-mobile > .item.-full {
	width: 100%;
}

.grid-container > .inner.-column-4-mobile > .item {
	width: calc(25% - 10px);
}
.grid-container.-no-padding > .inner.-column-4-mobile > .item {
	width: 25%;
}
.grid-container > .inner.-column-4-mobile > .item.-full {
	width: calc(100% - 10px);
}
.grid-container.-no-padding > .inner.-column-4-mobile > .item.-full {
	width: 100%;
}

/* Extra small devices (phones, 600px and down) "Custom style" */
@media only screen and (max-width: 600px) {
	
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
	
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
	.grid-container > .inner > .item {
		width: calc(50% - 10px);
	}
	.grid-container.-no-padding > .inner > .item {
		width: 50%;
	}

	.grid-container > .inner > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner > .item.-full {
		width: 100%;
	}
	
	.grid-container > .inner.-column-1-tablet > .item {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-1-tablet > .item {
		width: 100%;
	}

	.grid-container > .inner.-column-2-tablet > .item {
		width: calc(50% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-tablet > .item {
		width: 50%;
	}
	.grid-container > .inner.-column-2-tablet > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-tablet > .item.-full {
		width: 100%;
	}
	
	.grid-container > .inner.-column-3-tablet > .item {
		width: calc(33.3% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-tablet > .item {
		width: 33.3%;
	}
	.grid-container > .inner.-column-3-tablet > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-tablet > .item.-full {
		width: 100%;
	}

	.grid-container > .inner.-column-4-tablet > .item {
		width: calc(25% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-tablet > .item {
		width: 25%;
	}
	.grid-container > .inner.-column-4-tablet > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-tablet > .item.-full {
		width: 100%;
	}
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
	.grid-container > .inner > .item {
		width: calc(33.3% - 10px);
	}
	.grid-container.-no-padding > .inner > .item {
		width: 33.3%;
	}

	.grid-container > .inner > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner > .item.-full {
		width: 100%;
	}

	.grid-container > .inner.-column-1-desktop > .item {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-1-desktop > .item {
		width: 100%;
	}

	.grid-container > .inner.-column-2-desktop > .item {
		width: calc(50% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-desktop > .item {
		width: 50%;
	}
	.grid-container > .inner.-column-2-desktop > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-desktop > .item.-full {
		width: 100%;
	}
	
	.grid-container > .inner.-column-3-desktop > .item {
		width: calc(33.3% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-desktop > .item {
		width: 33.3%;
	}
	.grid-container > .inner.-column-3-desktop > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-desktop > .item.-full {
		width: 100%;
	}

	.grid-container > .inner.-column-4-desktop > .item {
		width: calc(25% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-desktop > .item {
		width: 25%;
	}
	.grid-container > .inner.-column-4-desktop > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-desktop > .item.-full {
		width: 100%;
	}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
	.grid-container > .inner > .item {
		width: calc(25% - 10px);
	}
	.grid-container.-no-padding > .inner > .item {
		width: 25%;
	}

	.grid-container > .inner > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner > .item.-full {
		width: 100%;
	}

	.grid-container > .inner.-column-1-desktop-large > .item {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-1-desktop-large > .item {
		width: 100%;
	}

	.grid-container > .inner.-column-2-desktop-large > .item {
		width: calc(50% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-desktop-large > .item {
		width: 50%;
	}
	.grid-container > .inner.-column-2-desktop-large > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-2-desktop-large > .item.-full {
		width: 100%;
	}
	
	.grid-container > .inner.-column-3-desktop-large > .item {
		width: calc(33.3% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-desktop-large > .item {
		width: 33.3%;
	}
	.grid-container > .inner.-column-3-desktop-large > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-3-desktop-large > .item.-full {
		width: 100%;
	}

	.grid-container > .inner.-column-4-desktop-large > .item {
		width: calc(25% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-desktop-large > .item {
		width: 25%;
	}
	.grid-container > .inner.-column-4-desktop-large > .item.-full {
		width: calc(100% - 10px);
	}
	.grid-container.-no-padding > .inner.-column-4-desktop-large > .item.-full {
		width: 100%;
	}
}