.multicolumn-hero-blocks {

	.section-container {
		@media screen and (max-width: 990px) {
			padding: 0 20px;
		}
	}

	.blocks {

		display: flex;
		flex-wrap: wrap;

		.block {

			width: calc(33.3% - 20px );
			margin: 0 10px 20px;

			@media screen and (max-width: 990px) {

				width: 100%;
				margin: 0 0 20px 0;

			}

			.block--main {

				width: 100%;
				padding-top: 100%;
				position: relative;
				overflow: hidden;

				img {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
					transition: 1s all;
				}

				.block--data {

					position: absolute;
					bottom: 0;
					left: 0;
					width: 100%;
					background: linear-gradient(
					  to top,
					  rgba(0, 0, 0, 0.65) 0%,
					  rgba(0, 0, 0, 0.45) 35%,
					  rgba(0, 0, 0, 0.18) 65%,
					  rgba(0, 0, 0, 0) 100%
					);					
					padding: 20px;
					min-height: 130px;

					* {
						color: #fff;
					}

					.block--title {
						margin:0;
						font-size: 18px;
						text-transform: uppercase;
						letter-spacing: 1px;
					}

					.block--ov {
						margin:0;
						font-size: 14px;
					}

					.block--links {

						margin: 16px 0 0 0;
						font-size: 13px;
						display: flex;
						flex-wrap: wrap;
						gap: 10px;

						a {
							text-transform: uppercase;
							text-decoration: underline;
							letter-spacing: 1px;
						}

					}

				}

			}

			.block--button {

				a {

					display: block;

				}

			}

			&:hover {

				.block--main {

					img {
						transform: scale(1.1);
						transition: 2.5s all;
					}

				}

			}

		}

	}

	&.enable_swiping {

		@media screen and (max-width: 990px) {

			.blocks {

				flex-wrap: nowrap;
				overflow: auto;
				margin: 0 -20px;
				padding-left: 20px;
				-ms-overflow-style: none;
  				scrollbar-width: none;

				&::-webkit-scrollbar {
					display: none;
				}  				

				.block {

					width: 310px;
					min-width: 310px;
					margin: 0 10px 0 0;

				}

			}

		}

	}

}