.columncontrols--landingpage {

	.row {
		align-items: stretch;

		> div {
			margin-bottom: $margin-x-general;
		}
	}

	.mod {
		height: 100%;
		width: 100%;
		padding: $alv-box-padding;
		margin-bottom: $margin-x-general;
	}

	&.columncontrols__first {
		.mod {
			background-color: $main-color-gray-100;
			display: inline-block;
			overflow-wrap: break-word;

			@media screen and (min-width: 480px){
				@include alv-border-radius($alv-box-radius);
				box-shadow: $whiteframe-shadow-1dp;
			}

			&.mod-text {

				article {
					height: 100%;
					display: flex;
					flex-direction: column;

					ul, p {
						flex-grow: 1;
					}

					p:last-of-type {
						width: calc(100% - #{$alv-box-padding});
						position: relative;
						margin: 0 auto;

						a:not(.icon--pdf) {
							position: absolute;
							bottom:0;
							left: 0;
							right: 0;
							margin: 0 auto;

							display: block;
							text-align: center;
							width: 50%;
							border: $input-btn-border-width solid transparent;
							@include button-size($input-btn-padding-y, $input-btn-padding-x, $font-size-base, $input-btn-line-height, $btn-border-radius);
							@include transition($btn-transition);
							@include button-variant($brand-primary, $brand-primary);

							&:hover {
								text-decoration: none;
							}
						}
					}
				}
			}

			&.mod-html {
				a[href*='apple.com'] {
					margin: 10px;
				}

				a.icon.icon--external.icon--after {
					display: inline-block;

					&:after {
						content: '';
					}
				}
			}
		}
	}

	// Logo Friedhof?
	&.columncontrols__last {
		.row {
			margin-bottom: 0;
		}
	}


	&.columncontrols__2 {
		.mod-textimage img {
			height: 64px;
		}

		.mod a {
			width: 50%;
			margin: 0 auto;
			border: $input-btn-border-width solid transparent;
			@include button-size($input-btn-padding-y, $input-btn-padding-x, $font-size-base, $input-btn-line-height, $btn-border-radius);
			@include transition($btn-transition);
			@include button-variant($brand-primary, $brand-primary);

			&:hover {
				text-decoration: none;
			}
		}
	}

	&.columncontrols__2,
	&.columncontrols__3 {
		.mod {
			text-align: center;

			> .clearfix {
				height: 100%;

				display: flex;
				flex-direction: column;
				justify-content: space-between;

				&:after {
					content: none;
				}
			}
		}
	}

	&.columncontrols__3 {
		background: $main-color-gray-100;

		.row {
			margin-bottom: 0;
		}
	}

	 &.columncontrols__4 {
		 background: $main-color-gray-dark;

		 .mod {
			 margin-bottom: 0;
		 }

		 .mod-image {
			 text-align: center;

			 figure {
				 margin: 0;
			 }

			 img {
				 margin-top: 32px;
				 max-height: 64px;
			 }
		 }

		 .col-md-3:first-child {

			 .mod-image img {
				 margin-top: 0;
				 max-width: 100%;
				 max-height: 128px;
			 }
		 }

		 ~.clearfix {
			 margin-top: -1rem;
		 }
	 }
}


@media screen and (max-width: 479px){
	.columncontrols--landingpage {
		h2 {
			font-size: $h3-font-size;
		}

		&.columncontrols__first {
			.mod.mod-text {
				article {
					display: block;

					p:last-of-type {
						position: static;

						a:not(.icon--pdf) {
							position: static;
							width: 100%;
						}
					}
				}
			}
		}
		&.columncontrols__2 {
			.mod-textimage figure {
				display: none;
			}

			.mod a {
				width: 100%;
			}
		}

		&.columncontrols__4 {
			display: none;
		}
	}
}

@media screen and (min-width: 480px) and (max-width: 1024px){
	.columncontrols--landingpage {

		h2 {
			font-size: $h3-font-size;
		}

		&.columncontrols__first {
			.col-sm-4 {
				flex: 0 0 50% !important;
				max-width: 50% !important;
			}
		}

		&.columncontrols__2 {
			.mod-textimage figure {
				display: none;
			}

			.mod a {
				width: 100%;
			}
		}

		&.columncontrols__4 {
			.row {
				> div {
					margin-bottom: ($margin-x-general/2);
				}
			}

			.mod-image {
				img {
					margin-top: 16px;
					max-height: 32px;
				}
			}
		}
	}
}