.teaser
{
	padding: 100px 0;
}

.teaser-slider
{
	margin: 0 -15px;
}

.teaser-element
{
	margin: 0 15px;
	border-radius: 8px;
	overflow: hidden;
	position: relative;
	height: 500px;
}

.teaser-element h3, .teaser-element p
{
	color: #fff;
}

.teaser-title h3
{
	font-size: 26px;
	letter-spacing: -1px;
	line-height: 30px;
	position: absolute;
	bottom: 0;
	margin-bottom: 2px;
}

.teaser-gradient
{
	transition: all .3s ease -1s;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background: linear-gradient(-180deg,rgba(15,25,65,0) 33%,rgb(15,25,65) 100%);
	cursor: pointer;
	z-index: 2;
	height: 100%;
	display: flex;
	align-items: flex-end;
}

.teaser-element .bt
{
	color: #fff;
	border-color: #fff;
	background: transparent;
}

.teaser-element .bt:hover
{
	color: #0f1941;
	background: #fff;
}

.teaser-text
{
	opacity: 1;
	transition: transform .3s ease .1s;
}

.teaser-element .teaser-bt
{
	opacity: 0;
}

.teaser-element p
{
	font-size: 18px;
	letter-spacing: 0;
	line-height: 30px;
}

.teaser-body
{
	margin-top: auto;
	max-height: 338px;
	transform: translateY(100%);
	transition: transform .3s ease;
}

.teaser-title
{
	height: 100%;
	margin-bottom: 20px;
	height: 60px;
	overflow: hidden;
	position: relative;
}

.teaser-element:hover .teaser-title, .teaser-element:focus .teaser-title
{
	transform: translateY(0%);
}

.teaser-element:hover .teaser-body, .teaser-element:focus .teaser-body
{
	overflow: hidden;
	margin-bottom: 20px;
	transform: translateY(0);
	transition: transform .3s;
}

.teaser-element:hover .teaser-bt, .teaser-element:focus .teaser-bt
{
	opacity: 1;
	transition: all .2s ease-out .1s;
}

.teaser .teaser-shade
{
	background: rgba(15,25,65,.7);
	opacity: 0;
	transition: opacity .3s ease;
	height: 100%;
	width: 100%;
}

.teaser-element:hover .teaser-shade, .teaser-element:focus .teaser-shade
{
	border-radius: 8px;
	opacity: 1;
	position: absolute;
	text-decoration: none;
	transition: opacity .3s ease;
}

.teaser-img
{
	border-radius: 8px;
	height: 100%;
	left: 0;
	-o-object-fit: cover;
	object-fit: cover;
	position: absolute;
	text-decoration: none;
	top: 0;
	width: 100%;
}

.teaser-wrapper
{
	padding: 30px;
	width: 100%;
}

.teaser .slick-arrow.slick-prev, .teaser .slick-arrow.slick-prev:hover
{
	left: -25px;
}

.teaser .slick-arrow.slick-next, .teaser .slick-arrow.slick-next:hover
{
	right: -25px;
}

.teaser h2
{
	font-size: 40px;
	margin-bottom: 50px;
}

.teaser-text p
{
	margin-bottom: 0;
}

.teaser-introduction
{
	margin-bottom: 50px;
}

.teaser-introduction p:last-child
{
	margin-bottom: 0;
}

.slick-disabled
{
	display: none !important;
}

@media only screen and (max-width:768px)
{
	.teaser-slider
	{
		margin: 0;
	}

	.teaser-text, .teaser-bt, .teaser-shade
	{
		display: none;
	}

	.teaser-element .teaser-body, .teaser-element:hover .teaser-body, .teaser-element:focus .teaser-body
	{
		transform: translateY(25%);
		margin-bottom: 0;
		height: calc(100% - 30px);
		overflow: hidden;
	}

	.teaser-arrow
	{
		height: 20px;
		background: url('../img/arrow-link.svg') bottom left no-repeat;
		margin-bottom: 30px;
	}

	.teaser .slick-list
	{
		padding:0 20% 0 0 !important;
	}
}