/* ############################################################
	161 - REFERENZEN AUF STARTSEITE
############################################################ */

/* Slider */
.mdl161-slider,
.mdl161-item {
	width: 100%;
	margin: 0;
	padding: 0;
}
.mdl161-item .slick-list {
	margin-left: -10px;
	margin-right: -10px;
}
	.mdl161-item {
		position: relative;
		overflow: hidden;
		margin-left: 10px;
		margin-right: 10px;
	}
	.mdl161-item::before {
		content: "";
		display: block;
		width: 100%;
		padding-bottom: calc((100% / (5 / 3)) + 116px);
	}
@media (min-width: 760px) {
	.mdl161-item .slick-list {
		margin-left: -20px;
		margin-right: -20px;
	}
		.mdl161-item {
			margin-left: 20px;
			margin-right: 20px;
		}
		.mdl161-item::before {
			padding-bottom: calc((100% / (5 / 3)) + 128px);
		}
}


/* Foto */
.mdl161-foto-box {
	position: absolute;
	top: 0;
	bottom: 115px;
	width: 100%;
}
	.mdl161-foto-box > .mdl161-image {
		display: inline-block;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-position: center;
		background-repeat: no-repeat;
		background-size: cover;
		-webkit-filter: grayscale(100%) brightness(80%) sepia(48%); /* Alte Website: brightness(0.78) sepia(1) contrast(0.83) */
		filter: grayscale(100%) brightness(80%) sepia(48%); /* Alte Website: brightness(0.78) sepia(1) contrast(0.83) */
		background-color: #fff;
		background-blend-mode: multiply;
	}
@media (min-width: 760px) {
	.mdl161-foto-box {
		bottom: 128px;
	}
}


/* Zeilenbegrenzung */
.mdl161-text-box h3.projekttitel {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}


/* Text */
.mdl161-text-box {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 116px;
	padding: 17px 20px;
	background-color: #201d17;
	font-size: 0.875rem; /* 14px */
	line-height: 1.428; /* 20px */
	letter-spacing: 0.28px;
	color: #efe0c2;
	-o-transition: height 1s, background 1s;
	-ms-transition: height 1s, background 1s;
	-moz-transition: height 1s, background 1s;
	-webkit-transition: height 1s, background 1s;
	transition: height 1s, background 1s;
}
	.mdl161-text-box > p + p {
		margin-top: 0;
	}
	.mdl161-text-box h3.projekttitel {
		margin-bottom: 0;
		font-size: 0.875rem; /* 14px */
		line-height: 1.428; /* 20px */
		letter-spacing: 0.28px;
		-webkit-line-clamp: 3;
	}
	.mdl161-text-box p.subline {
		-webkit-line-clamp: 1;
	}
@media (min-width: 760px) {
	.mdl161-text-box {
		height: 128px;
		font-size: 1rem; /* 16px */
		line-height: 1.625; /* 26px */
		letter-spacing: 0.32px;
	}
		.mdl161-text-box h3.projekttitel {
			font-size: 1rem; /* 16px */
			line-height: 1.428; /* 20px */
			letter-spacing: 0.32px;
		}
}
@media (min-width: 1020px) {
	.mdl161-item:hover .mdl161-text-box {
		height: 100%;
		/*background-color: #cc0000;*/
	}
		.mdl161-text-box p.leistungen {
			position: absolute;
			left: 20px;
			bottom: 17px;
			width: calc(100% - 40px);
			-webkit-transform: translateY(6px);
			transform: translateY(6px);
			opacity: 0;
			-o-transition: opacity 0.3s, transform 0.3s;
			-ms-transition: opacity 0.3s, transform 0.3s;
			-moz-transition: opacity 0.3s, transform 0.3s;
			-webkit-transition: opacity 0.3s, transform 0.3s;
			transition: opacity 0.3s, transform 0.3s;
			-webkit-transition-delay: 0s;
			-moz-transition-delay: 0s;
			-o-transition-delay: 0s;
			transition-delay: 0s;
		}
		.mdl161-item:hover .mdl161-text-box p.leistungen {
			-webkit-transform: translateY(0);
			-moz-transform: translateY(0);
			-o-transform: translateY(0);
			-ms-transform: translateY(0);
			transform: translateY(0);
			opacity: 1;
			-webkit-transition-delay: 0.9s;
			-moz-transition-delay: 0.9s;
			-o-transition-delay: 0.9s;
			transition-delay: 0.9s;
		}
}


/* Navigation */
.mdl161-navigation {
	margin: 50px auto 0;
}
	.mdl161-navigation-inline {
		display: inline-block;
		margin: 0 auto;
	}
		.mdl161-slick-prev,
		.mdl161-slick-next {
			float: left;
			position: relative;
			display: inline-block;
			width: 50px;
			height: 50px;
			margin: 0;
			padding: 0;
			border: none;
			outline: none;
			background: transparent;
			background-repeat: no-repeat;
			background-position: center;
			background-size: contain;
			-webkit-transition: background 0.3s;
			-moz-transition: background 0.3s;
			-o-transition: background 0.3s;
			-ms-transition: background 0.3s;
			transition: background 0.3s;
		}
		.mdl161-slick-prev,
		.mdl161-slick-next {
			background-image: url("../../martygruppe/Images/Elemente/slider-nav.svg");
		}
			.mdl161-slick-prev:hover,
			.mdl161-slick-next:hover {
				background-image: url("../../martygruppe/Images/Elemente/slider-nav-hover.svg");
			}
		.mdl161-slick-prev {
			margin-right: 20px;
			-o-transform: rotate(180deg);
			-ms-transform: rotate(180deg);
			-moz-transform: rotate(180deg);
			-webkit-transform: rotate(180deg);
			transform: rotate(180deg);
		}
		.mdl161-slick-next {
			margin-left: 20px;
		}
		.mdl161-button-all {
			float: left;
			position: relative;
			display: inline-block;
			background-color: #201d17;
			border-radius: 19px;
			padding: 12px 24px;
			font-size: 0.875rem; /* 14px */
			line-height: 1.25; /* 17.5px */
			letter-spacing: 0.56px;
			color: #efe0c2;
			-o-transition: background 0.3s;
			-ms-transition: background 0.3s;
			-moz-transition: background 0.3s;
			-webkit-transition: background 0.3s;
			transition: background 0.3s;
		}
		.mdl161-button-all:hover {
			background-color: #cc0000;
			color: #efe0c2;
		}
@media (min-width: 760px) {
	.mdl161-navigation {
		margin-top: 120px;
	}
		.mdl161-button-all {
			border-radius: 25px;
			padding: 12px 30px;
			font-size: 1rem; /* 16px */
			line-height: 1.63; /* 26px */
			letter-spacing: 0.64px;
		}
}