@charset "UTF-8";

/* WEBSITE - DESKTOP */

	body, html {
	height: 100%;
	margin: 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
}

	h1, h2, h3, h4, h5, h6 {
	font-family: 'Oswald', sans-serif;
	color: #2ea3f2;
	line-height: 1.5em;
	font-weight: 200 !important;
}

	h1 {
	font-size: 30px;
	font-weight: 300 !important;
}

	h2 {
	font-size: 26px;
	font-weight: 300 !important;
}

	h3 {
	font-size: 22px;
}

	h4 {
	font-size: 18px;
}

	h5 {
	font-size: 16px;
}

	h6 {
	font-size: 14px;
}

	ul{
	margin:0px;
	padding: 0 0 0 1.5%;
}
	
	a{
		text-decoration: none;
	}
	
	a:hover{
		text-decoration: none;
	}
	
	#wrapper {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

/* HEADER */
	
	#stickymenu-wrapper{
	background-color: #2ea3f2;
	margin: 0;
	padding: 0;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	z-index: 10000;
	font-size: 14px;
	color: #FFFFFF;
	padding-top: 0.5%;
	padding-bottom: 0.5%;
}
	
		#stickymenu {
		margin: 0 20% 0 20%;
	}
			.phone {
			color: #FFFFFF;
			font-family: 'Open Sans', sans-serif;
			font-size: 12px;
		}
	
				#stickymenu .glyphicon{
				margin: 0 0.5% 0 0 !important;
				}
	
			.mail {
			color: #FFFFFF;
			font-family: 'Open Sans', sans-serif; 
			font-size: 12px;
			text-decoration: none;
			}
			
			.fa{
			margin:0 0.5% 0 0;
			}
	
	
	#logo{
		margin: 2.5% 20% 0.5% 20%;
	}
		#logo a{
			font-family: 'Cabin Sketch', cursive;
			color:#cd1719;
			font-weight:bold;
			font-size:4em;
			text-decoration: none;
		}



#header-wrapper{
	background-image: linear-gradient(to right, hsla(0,0%,27%,1) 0%, hsla(0,0%,47%,1) 50%);
	width:100%;
	min-height: 300px;
	background-color: #000;
}

#header{
	width: 60%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	width: 40%;
	float:left;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 2% 7% 0 0;
}

	#headerbereich-1 h1{
		margin:1% 0 1% 0%;
		font-weight: 500 !important;
		font-size: 2.8em !important;
	}
	
	#headerbereich-1 h2{
		margin:0%;
		font-weight: 200 !important;
	}

#headerbereich-2{
	width: 20%;
	float:left;
	margin: 0 4% 0 0;
	padding: 3% 0 0 0;
}

#headerbereich-3{
	width: 23%;
	float:right;
	padding: 3% 0% 0 0;
	margin: 0 1% 0 0;
}
/* CONTENT */
	
#content-wrapper {
		max-width: 100%;
		clear: both;
}	
	#content {
		margin: 2% auto 3% auto;
		max-width: 60%;
	}

		#contentbereich-1 {
		float: left;
		width:60%;
	}
	
				#contentbereich-1 h1{
				margin:0% 0 0% 0%;
			}
			
				#contentbereich-1 h2{
				margin:1% 0 0% 0%;
			}

		#contentbereich-2 {
		float: right;
		width:30%;
	}
		#contentbereich-3{
		clear: both;
	}
	
		button {
		border: solid 2px #2ea3f2;
		border-radius: 2%;
		padding:1% 2% 1% 2%;
		color:#2ea3f2;
		font-size: 20px;
		text-transform: none;
		font-family: 'Open Sans';
		font-weight:500;
		background-color:#fff;
		line-height: 34px;
	}
	
		button:hover {
		border: solid 2px #f2f2f2;
		border-radius: 2%;
		padding:1% 2% 1% 2%;
		color:#2ea3f2;
		max-width: 80%;
		font-size: 20px;
		text-transform: none;
		font-family: 'Open Sans';
		font-weight:500;
		background-color:#f2f2f2;
		line-height: 34px;
	}

/* FOOTER */	

	#wrapper-footer {
	background-color: #2e3c4d;
	width:100%;
	min-height:300px;
}
	
		#footer{
		margin: 0% auto 0% auto;
		max-width: 60%;
		padding: 2% 0 1% 0;
		
	}

			#footerbereich-1{
			width:270px;
			float: left;
			color:#ffffff;
		}
				#footerbereich-1 a{
			text-decoration: none;
			color:#ffffff;
			}
	
			#footerbereich-2{
			width:270px;
			float: left;
			color:#ffffff;
			
		}
	
			#footerbereich-3{
			width:270px;
			float: left;
			color:#ffffff;
			padding: 1.5% 0 0 0;
			
		}
	
			#footerbereich-4{
			width:268px;
			float: right;
			
		}
	
			#footer-menu{
			max-width:1080px;
			clear: both;
			text-transform: uppercase;
			text-decoration: none;
			padding:2% 0 0 0;

		}
				#footer-menu a{
			 	text-decoration: none;
				margin-right:2%;
				font-weight:lighter;
				color:#ffffff;
			}
	
		#footer-bottom{
		background-color:#1f2934;
		width:100%;
		height: 40px;
		}
			#footer-icons{
				max-width:1080px;
				margin: 0 20% 0 20%;
				padding:0.5% 0 0.5% 0;
			}


/* END WEBSITE */






/* DESKTOP AUFLÖSUGEN */

/* DESKTOP AUFLÖSUGEN BIS 1840PX */


@media screen and (min-width: 1506px) and (max-width: 1840px) {
		
#header-wrapper{
	width:100%;
	height: 300px !important;
	background-color: #000;
}

#header{
	width: 60%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 7% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2.2em !important;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	font-size: 1.5em !important;
}

#headerbereich-2{
	margin: 3% 0 0 0;
}

#headerbereich-3{
	margin: 5% 0 0 0;

}	

/* CONTENT */
	
	#content-wrapper{
		width:100%;
	}
	
	#content {
	width: 100%;
	}
		#contentbereich-1 {
		width:70%;
		margin-bottom: 0%;
		}
	
	#contentbereich-1 h1{
		font-size: 2.0em;
	}
	
	#contentbereich-1 h2{
		font-size: 1.5em;
	}
		
		#contentbereich-2 {
		width:30%;
		margin: 0 0% 0% 0%;
			float: right;
			text-align: center;
		}
		
		#contentbereich-3{
		padding:10 0 0 0; 
		clear: both;
		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;
		font-size: 1.2em!important;
		}
	
	
	button{
		font-size: 1.2em;
	}
	
	button:hover {
		font-size: 1.2em;
	}
	
	
	/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		width:25%;
		float: left;
	}
	
	#footerbereich-2{
		width:25%;
		float: left;
	}
	
	#footerbereich-3{
		width:25%;
		float: left;
	}
	
	#footerbereich-4{
		width:25%;
		float: left;
	}
	
	#footer-menu{
		clear: both;
		margin: 0 0 0 0;
	}

}

/* END */


/* DESKTOP AUFLÖSUGEN BIS 1520px */

@media screen and (min-width: 1200px) and (max-width: 1520px) {
		
#header-wrapper{
	width:100%;
	height: 400px !important;
	background-color: #000;
}

#header{
	width: 60%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 7% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2.2em !important;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	font-size: 1.5em !important;
}

#headerbereich-2{
	margin: 3% 0 0 0;
}

#headerbereich-3{
	margin: 5% 0 0 0;

}	

/* CONTENT */
	
	#content-wrapper{
		width:100%;
	}
	
	#content {
	width: 100%;
	}
		#contentbereich-1 {
		width:70%;
		margin-bottom: 0%;
		}
	
	#contentbereich-1 h1{
		font-size: 2.0em;
	}
	
	#contentbereich-1 h2{
		font-size: 1.5em;
	}
		
		#contentbereich-2 {
		width:30%;
		margin: 0 0% 0% 0%;
			float: right;
			text-align: center;
		}
		
		#contentbereich-3{
		padding:10 0 0 0; 
		clear: both;
		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;
		font-size: 1.2em!important;
		}
	
	
	button{
		font-size: 1.2em;
	}
	
	button:hover {
		font-size: 1.2em;
	}
	
	
	/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		width:25%;
		float: left;
	}
	
	#footerbereich-2{
		width:25%;
		float: left;
	}
	
	#footerbereich-3{
		width:25%;
		float: left;
	}
	
	#footerbereich-4{
		width:25%;
		float: left;
	}
	
	#footer-menu{
		clear: both;
		margin: 0 0 0 0;
	}

}

/* END */
/* DESKTOP AUFLÖSUGEN BIS 1200px */

@media screen and (min-width: 938px) and (max-width: 1200px) {

	/* HEADER */
	
	#logo{
		margin: 3% 20% 0.5% 20%;
	}
		#logo a{
			font-family: 'Cabin Sketch', cursive;
			color:#cd1719;
			font-weight:bold;
			font-size:3em;
			text-decoration: none;
		}
	
#header-wrapper{
	width:100%;
	height: 350px !important;
	background-color: #000;
}

#header{
	width: 60%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	width: 35%;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 2% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2em !important;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	font-size: 1em !important;
}

#headerbereich-2{
	width:10%;
	margin: 3% 5% 0 0;
}

#headerbereich-3{
	width:20%;
	margin: 15% 0 0 15%;

}	

/* CONTENT */
	
	#content-wrapper{
		width:100%;
	}
	
	#content {
	width: 100%;
	}
		#contentbereich-1 {
		width:100%;
		margin-bottom: 0%;
		clear: both;
			float: none;
		}
	
	#contentbereich-1 h1{
		font-size: 2.0em;
	}
	
	#contentbereich-1 h2{
		font-size: 1.5em;
	}
		
		#contentbereich-2 {
		width:100% !important;
		max-width: 80%;
		margin: 3% 0% 5% 0%;
		text-align: lef;
		float: none;
		}
		
		#contentbereich-3{
		padding:10 0 0 0; 
		clear: both;
		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;
		font-size: 1.2em!important;
		}
	
	
	button{
		font-size: 1.2em;
	}
	
	button:hover {
		font-size: 1.2em;
	}
	
	
	/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		width:25%;
		float: left;
	}
	
	#footerbereich-2{
		width:25%;
		float: left;
	}
	
	#footerbereich-3{
		width:25%;
		float: left;
	}
	
	#footerbereich-4{
		width:25%;
		float: left;
	}
	
	#footer-menu{
		clear: both;
		margin: 0 0 0 0;
	}

	
	/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		width: 30%;
		margin: 0 3% 0 0;
	}
	
	#footerbereich-2{
		width: 30%;
		margin: 0 3% 0 0;
	}
	
	#footerbereich-3{
		width: 30%;
		margin: 0 0% 0 0;
	}
	
	#footerbereich-4{
		width: 50%;
		text-align: center;
	}
	
	#footer-menu{
		text-align: center;
	}
	
}

/* END */


/* DESKTOP AUFLÖSUGEN BIS 937PX */

@media screen and (min-width: 769px) and (max-width: 937px) {

#logo{
	font-size: 0.9em;	
	margin: 5% 20% 0.5% 20%;
}
	
#header-wrapper{
	width:100%;
	min-height: 850px !important;
	background-color: #000;
}

#header{
	width: 78%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	width: 100%;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 7% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2.2em !important;
	text-align: center;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	text-align: center;
	font-size: 1.5em !important;
}

#headerbereich-2{
	width: 100%;
	margin: 0 4% 0 0;
	padding: 3% 0 0 0;
	text-align: center;
}

#headerbereich-3{
	width: 70%;
	padding: 0% 0% 0 0;
	margin: 0 15% 3% 0;
	text-align: center;
}	
	
	
	/* CONTENT */
	body{
		font-size:14px;
	}
	
	#content-wrapper{
		width:100%;
	}
	
	#content {
	width: 100%;
	}
		#contentbereich-1 {
		width:100%;
		margin-bottom: 5%;
		clear: both;
		}
		
		#contentbereich-2 {
		width:100%;
		clear: both;
		float: none;
		margin: 0 0% 7% 0%;
		}
		
		#contentbereich-3{
		margin: 5% 11% 1% 1%;	
		padding:10 0 0 0; 
		clear: both;
		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;
		font-size: 1.2em!important;
		}
	
	
	button{
		font-size: 1.2em;
	}
	
	button:hover {
		min-width:100% !important;
		font-size: 1.2em;
	}
	

/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		margin:2% 0 0 0;
		clear: both;
	}
	
	#footerbereich-2{
		margin: 0 0 5% 0;
	}
	
	#footerbereich-3{
		margin: 0 auto 3% auto;
	}
	
	#footerbereich-4{
		width:100%;
		margin: 0 0 3% 0;
		text-align: center;
	}
	
	#footer-menu{
		text-align: center;
	}

	#footer-icons{
		display: none;
	}
}


/* END DESKTOP AUFLÖSUGEN BIS 937PX */


/* MOBILE ANSICHT */

/* TABLET BIS 768px */
	
@media screen and (min-width: 580px) and (max-width: 768px) {
/* HEADER */
	#stickymenu {
		margin: 1% 5% 1% 5%;
		text-align: center;
	}
		#stickymenu .glyphicon{
			margin: 0 2% 0 0 !important;
		}
		.fa{
			margin: 0 1% 0 0 !important;
		}
		.facebook{
			display:none;
		}
	
	.phone, .mail {
		font-size: 14px;
	}
	
	#logo {
    margin: 9% 11% 3% 11%;
    font-size: 22px;
}
	
		#logo a{
			font-family: 'Cabin Sketch', cursive;
			color:#cd1719;
			font-weight:bold;
			font-size:2.1em;
			text-decoration: none;
		}
	
	
#header-wrapper{
	width:100%;
	min-height: 850px !important;
	background-color: #000;
}

#header{
	width: 78%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	width: 100%;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 7% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2.2em !important;
	text-align: center;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	text-align: center;
	font-size: 1.5em !important;
}

#headerbereich-2{
	width: 100%;
	margin: 0 4% 0 0;
	padding: 3% 0 0 0;
	text-align: center;
}

#headerbereich-3{
	width: 70%;
	padding: 0% 0% 0 0;
	margin: 0 15% 3% 0;
	text-align: center;
}	
	
	
	/* CONTENT */
	body{
		font-size:15px;
	}
	
	#content-wrapper{
		width:100%;
	}
	
	#content {
	width: 100%;
	}
		#contentbereich-1 {
		width:100%;
		margin-bottom: 5%;
		float: none !important;
		}
		
		#contentbereich-2 {
		width:100%;
		clear: both;
		margin: 0;
		float: none;
		}
		
		#contentbereich-3{
		margin: 5% 11% 1% 1%;	
		padding:10 0 0 0; 
		clear: both;
		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;
		font-size: 1.2em!important;
		}
	
	
	button{
		font-size: 1.2em;
	}
	
	button:hover {
		min-width:100% !important;
		font-size: 1.2em;
	}
	

/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		margin:2% 0 0 0;
		clear: both;
	}
	
	#footerbereich-2{
		margin: 0 0 5% 0;
	}
	
	#footerbereich-3{
		margin: 0 auto 3% auto;
	}
	
	#footerbereich-4{
		width:100%;
		margin: 0 0 3% 0;
		text-align: center;
	}
	
	#footer-menu{
		text-align: center;
	}

	#footer-icons{
		display: none;
	}
}

/* END TABLET */

/* HANDY BIS 580PX */	

@media all and (max-width: 580px) {
/*@media all and (max-width: 480px) {
	/* HEADER */
	#stickymenu {
		margin: 1% 5% 1% 5%;
		text-align: center;
	}
		#stickymenu .glyphicon{
			margin: 0 2% 0 0 !important;
		}
		.fa{
			margin: 0 1% 0 0 !important;
		}
		.facebook{
			display:none;
		}
	
	#logo{
		margin: 13% 11% 4% 11%;
	}
		#logo a{
			font-family: 'Cabin Sketch', cursive;
			color:#cd1719;
			font-weight:bold;
			font-size:2.1em;
			text-decoration: none;
		}
	

#header-wrapper{
	width:100%;
	min-height: 850px !important;
	background-color: #000;
}

#header{
	width: 78%;
	margin: 0 auto 0 auto;
	background-color: #000;
}

#headerbereich-1{
	width: 100%;
	text-shadow: 1px 1px 3px rgba(0,0,0,0.75);
	margin: 5% 7% 5% 0;
}

#headerbereich-1 h1{
	margin:1% 0 1% 0%;
	font-weight: 500 !important;
	font-size: 2.2em !important;
	text-align: center;
}
	
#headerbereich-1 h2{
	margin:2% 0 0 0;
	font-weight: 200 !important;
	text-align: center;
	font-size: 1.5em !important;
}

#headerbereich-2{
	width: 100%;
	margin: 0 4% 0 0;
	padding: 3% 0 0 0;
	text-align: center;
}

#headerbereich-3{
	width: 90%;
	padding: 0% 0% 0 0;
	margin: 0 2% 2% 0;
	text-align: center;
}	
	
	
	
	/* CONTENT */
	body{
		font-size:16px;
	}
	
	#content {
	margin: 10% 11% 10% 11%;
	width: 90%;
	}
		#contentbereich-1 {
		width:100% !important;
		margin-bottom: 5%;
		clear: both;
		font-size: 0.8em !important;

}
		
		#contentbereich-2 {
		width:100% !important;
		clear: both;
		margin: 0 0 7% 0;
		font-size: 0.8em !important;
		text-align: left;
		}
		
		#contentbereich-3{
		margin: 35% 11% 1% 1%;	
		padding:10 0 0 0; 
		clear: both;
		font-size: 0.8em !important;

		}
		
		#contentbereich-3 ul{
		margin: 0% 0% 0% 5%;	
		}
	
	button{
		font-size: 1.4em !important;
	}
	
	button:hover {
		min-width:100% !important;
		font-size: 1.5em;
	}
	
	
	/* FOOTER */
	
	#wrapper-footer{
		width:100% !important;
	}
	
	#footer{
		width:100% !important;
	}
	
	#footerbereich-1{
		margin:2% 0 0 0;
		clear: both;
	}
	
	#footerbereich-2{
		margin: 0 0 5% 0;
	}
	
	#footerbereich-3{
		margin: 0 auto 3% auto;
	}
	
	#footerbereich-4{
		margin: 0 0 3% 0;
	}
	
/*	#footerbereich-3, #footerbereich-2, #footerbereich-1{
			width:100% !important;
		}
	
	#footerbereich-4, #footerbereich-2, #footerbereich-3{
			width:100% !important;
			margin: 10% 0 10% 0;
		}
	
*/	
	#footer-menu{
			text-align: center;
	}

	#footer-bottom{
	background-color:#1f2934;
		width:100%;	
		}
	
			#footer-icons{
				max-width:100%;
				display: none;
			}
	
}


/* END HANDY */












/* END MOBILE ANSICHT */