/* teaserbild styles */
* {
	transition: all;
}
.tagline {
    width: 100%;
}
.slider-text {
	position: relative;
	margin: 0px auto
}
.flex-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
}
.flex-buttons a, .flex-buttons button {
    background: #52b4b6;
    padding: 1em 2em;
    margin: 1em;
    color: #ffffff;
	line-height:1.5em !important;
	text-transform:uppercase;
}
img#jetzt-starten {
    margin-right: 7px;
}
.teaserbild {
	z-index: 3;
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto !important;
}
a.button-green {
    background: #1ab5b7;
    color: #ffffff;
    padding: 1em 2em;
    margin: 1em;
    border-radius: 2px;
	transition: all 0.5s ease-out;
}
a.button-green:hover {
	background:#179DB0;
	text-decoration:none;
}
a.bild-text-link-info::before {
	font: 100%/1 "RockSolid Icons";
	content:'\e009';
	margin-right: 7px;
}
a.bild-text-link-kaufen::before {
	font: 100%/1 "RockSolid Icons";
	content:'\e039';
	margin-right: 7px;
}

.bild-text-heading {
	margin: 0.5rem 0rem 0.5rem 0rem;
	font-size: 1.75em;
}
.bild-text {
	margin: 0.5rem 0rem 2.5rem 0rem;
	font-size: 1.5em;
}

.bild-text-bg {
    text-align: center;
    background: rgba(255, 255, 255, 0.85);
    padding: 2em;
}
a.bild-text-link, a.btn {
	cursor:pointer;
	text-decoration:none;
}

a.bild-text-link:hover, a.btn:hover {
	background: #27b563;
	color:#ffffff !important;
	text-decoration:none;
}




@media (max-width:320px)
{
	.header_outside, .custom {
		height:80px !important;
	}
	
	.mod_rocksolid_slider {
		height: 33vh;
		min-height:400px;
		max-height:800px;
	}
	.teaserbild {
		top: -22vh;
		width:85%;
	}
	@media (max-height:750px)
	{
		.teaserbild {
			top: -50vh;
		}
		
		
	}
	p.bild-text-heading {
		font-size: 1.5em;
		margin-bottom: 1.25em;
	}
	p.bild-text-desc {
		font-size:0.85em;
	}
	a.button-green {
		margin:0.25em;
		padding: 1.25em;
	}
}

/* up to 576px*/
@media (max-width:576px)
{
	.header_outside, .custom {
		height:80px !important;
	}
	
	.mod_rocksolid_slider {
		height: 33vh;
		min-height:400px;
		max-height:800px;
	}
	.teaserbild {
		top: -38vh;
		width:85%;
	}
	.bild-text-heading {
		margin: 0.5rem 0rem 0.5rem 0rem;
		font-size: 1em;
	}
	.bild-text {
		margin: 0.5rem 0 0 0;
		font-size: 0.85em;
	}
	.flex-buttons {
		flex-wrap: wrap;
	}
	.flex-buttons a, .flex-buttons button {
		padding: 0.5em 1em;
		margin: 1em;
		line-height: 1.5em !important;
		font-size: 0.8em;
		width: 100%;
	}
	@media (max-height:750px)
	{
		.teaserbild {
			top: -50vh;
		}
		
	}
	p.bild-text-heading {
		font-size: 1.5em;
		margin-bottom: 1.25em;
	}
	p.bild-text-desc {
		font-size:0.85em;
	}
	a.button-green {
		margin:0.25em;
		padding: 1.25em;
	}
}
/* up to 576px*/

@media (min-width:577px) and (max-width:767px)
{
	.mod_rocksolid_slider {
		height: 33vh;
		min-height:400px;
		max-height:800px;
	}
	.teaserbild {
		top: -38vh;
		width:85%;
	}
	.bild-text-heading {
		margin: 0.5rem 0rem 0.5rem 0rem;
		font-size: 1.25em;
	}
	@media (max-height:750px)
	{
		.teaserbild {
			top: -50vh;
		}
		
	}
	.flex-buttons a, .flex-buttons button {
		padding: 0.5em 1em;
		margin: 1em;
		line-height: 1.5em !important;
		font-size: 0.8em;
		width: 100%;
	}
	p.bild-text-heading {
		font-size: 1.5em;
		margin-bottom: 0.75em;
	}
	p.bild-text-desc {
		font-size:1em;
	}
}

/* from 768px to 991px*/
@media (min-width:768px) and (max-width:991px)
{
	.mod_rocksolid_slider {
		height: 50vh;
		min-height:400px;
		max-height:800px;
	}
	.teaserbild {
		top: -38vh;
		width:75%;
		max-width:600px;
	}
	.flex-buttons a, .flex-buttons button {
		padding: 0.5em 1em;
		margin: 0 0.5em;
		line-height:1.25em !important;
		max-width: 270px;
	}
	@media (max-height:750px)
	{
		.teaserbild {
			top: -50vh;
		}
		
	}
	p.bild-text-heading {
		font-size: 2em;
		margin-bottom: 0.75em;
	}
	p.bild-text-desc {
		font-size:1em;
	}
}


/* from 992px to 1440px*/
@media (min-width:992px) and (max-width:1440px)
{
	.mod_rocksolid_slider {
		height: 10vh;
		min-height:600px;
		max-height:800px;
	}
	.teaserbild {
		top:-36vh;
		max-width:800px;
		margin:0 auto;
	}
	.flex-buttons a, .flex-buttons button {
		min-width: 300px;
	}
	@media (max-height:750px) {
		.teaserbild {
			top: -50vh;
		}
	}
	p.bild-text-heading {
		font-size: 2.75em;
		margin-bottom: 0.75em;
	}
	p.bild-text-desc {
		font-size:1em;
	}
}

@media (min-width: 1441px)
{
	.mod_rocksolid_slider {
		height: calc(100vh - 70px);
	}
	.teaserbild {
		top: -66vh;
		max-width:950px;
		margin:0 auto;
	}
	h1.bild-text-heading {
		margin: 0.5rem 0rem 0.5rem 0rem;
		font-size: 1.75em;
	}
	p.bild-text-desc {
		font-size:1em;
	}
}