$break-mobile: 480px;
$break-tab: 960px;

.wp-block-guteblock-post-grid {
	display: flex;
	flex-wrap: wrap;

	.wp-block-guteblock-post-grid__single-post h4 {
		margin: 20px 0;
		color: #000000;
		font-size: 23px;

		a {
			color: #000000;
			text-decoration: none;
		}
	}

	.wp-block-guteblock-post-grid__single-post img {
		max-width: 100%;
		height: 230px;
		object-fit: cover;
		width: 100%;
	}

	@for $i from 1 through 6 {
		&.has-#{$i}-columns {
			.wp-block-guteblock-post-grid__single-post {
				width: calc(100% /#{$i});
				padding: 20px;

				@media screen and (max-width: $break-tab) {
					width: 50%;
					margin-bottom: 50px;
				}
				@media screen and (max-width: $break-mobile) {
					width: 100%;
					margin-bottom: 50px;
				}
			}
		}
	}

	&.align-center {
		text-align: center;
	}
	&.align-right {
		text-align: right;
	}
}