@charset "UTF-8";
/* CSS Document */

* {
	font-family:Arial, Helvetica, sans-serif;
}

.stoerer {
	width:100px; 
	height:100px; 
	position:absolute; 
	right:5%;
	bottom:8%;
	top:auto; 
	z-index:200;	
}

/* Main Content */
.main-content {
	width:100%;
	margin:0 0 60px 0;
	overflow:hidden;
	position:relative;
	background-color:#ffffff;
}

#start {
	height:100%;
	margin:0;	
}

.main-image {
	background-size:100% auto;
	background-position:center center; 
	background-repeat:no-repeat;
	width:100%; height:320px; 
	display:block; 
	float:left; 
	position:relative;
}

/* Hintergrundbilder */
.start-theme {
	background-image:url(../images/mobile_00.jpg);
	height:100%;
	background-size:100% auto;
	background-position:center 160px;
}

.cat-1-theme {
	background-image:url(../images/mobile_01.jpg); 
}

.cat-2-theme {
	background-image:url(../images/mobile_02.jpg); 
}

.cat-3-theme {
	background-image:url(../images/mobile_03.jpg); 
}

.cat-4-theme {
	background-image:url(../images/mobile_04.jpg); 
}

.cat-5-theme {
	background-image:url(../images/mobile_05.jpg); 
}

.cat-6-theme {
	background-image:url(../images/mobile_06.jpg); 
}

.cat-7-theme {
	background-image:url(../images/mobile_07.jpg); 
}

/* Content */
.main-content .cat {
	position:absolute;
	margin:0 0 0 0;
	padding:30px 0 0 30px;
	font-size:1.4em;
	color:#404142;
	font-weight:normal;
	z-index:18;	
}

.main-content .cat.light {
	color:#CCC;	
}

.main-content .text-area {
	width:84%;
	margin:4% 8% 5% 8%;
	position:relative;
	float:left;
	overflow:visible;
	text-align:center;
	z-index:18;
	padding:0;
	box-sizing:border-box;
}

.main-content .text-area h3 {
	margin-bottom:0;
}

.main-content .introtext-area {
	position:absolute;
	top:10%;
	text-align:left;
	max-height:80%;
}

.main-content .introtext-area > * {
	text-align:left;
}

/* text-area for columns */
.main-content .wide-text-area {
	width:80%;
	margin:4% 10% 5% 10%;
	overflow:auto;
	text-align:center;
	position:relative;	
}

/* 1/3 */
.main-content .wide-text-area .area-33 {
	width:100%;
	overflow:auto;
	float:left;
	padding:0 0 10% 0;
	box-sizing:border-box;
}

.main-content .wide-text-area .area-33 img {
	width:100%;
	height:auto;
	display:block;
}

/* 1/4 */
.main-content .wide-text-area .area-25 {
	width:100%;
	overflow:auto;
	float:left;
	padding:0 0 10% 0;
	box-sizing:border-box;
}

.main-content .wide-text-area .area-25 img {
	width:100%;
	height:auto;
	display:block;
}

.main-content .wide-text-area h3 {
	margin:10px 0 10px 0;
}

@media screen and ( min-width:360px ) {
	
}

@media screen and ( min-width:600px ) {	
	.stoerer {
		width:180px; 
		height:180px; 
		right:8%; bottom:12%; top:auto;	
	}
	
	/* Main Content */
	.main-content {
		min-height:100%;
		height:100%;
		margin:0;
	}
	
	.main-content.vierspalter {
		height:auto;	
	}
	
	.main-content.dreispalter {
		height:auto;	
	}
	
	.main-image {
		background-size:cover;
		position:absolute;
		height:65%;
	}
	
	/* Hintergrundbilder */
	.start-theme {
		background-image:url(../images/medium_00.jpg);
		height:100%;
		background-size:cover;
		background-position:center center;
	}
	
	.cat-1-theme {
		background-image:url(../images/medium_01.jpg); 
	}
	
	.cat-2-theme {
		background-image:url(../images/medium_02.jpg); 
	}
	
	.cat-3-theme {
		background-image:url(../images/medium_03.jpg); 
	}
	
	.cat-4-theme {
		background-image:url(../images/medium_04.jpg); 
	}
	
	.cat-5-theme {
		background-image:url(../images/medium_05.jpg); 
	}
	
	.cat-6-theme {
		background-image:url(../images/medium_06.jpg); 
	}
	
	.cat-7-theme {
		background-image:url(../images/medium_07.jpg);
	}
	
	.main-content .cat {
		margin:0 0 0 8%;
	}
	
	.main-content .text-area {
		top:65%;
		width:84%;
		max-height:40%;
		overflow:auto;
		margin-top:0;
		margin-left:8%;
		padding:30px;
		text-align:left;
		box-sizing:border-box;
	}
	
	.main-content .introtext-area {
		width:80%;
		max-height:80%;
		margin-left:8%;
		position:absolute;
		top:10%;
		text-align:left;
	}
	
	.main-content .wide-text-area {
		padding:30px;
		box-sizing:border-box;
		text-align:left;
		margin:8% 8% 5% 8%;
		width:84%;
	}
	
	.main-content .wide-text-area h3 {
		margin:20px 0 20px 0;
	}
	
	/* 1/3 */
	.main-content .wide-text-area .area-33 {
		width:50%;
		padding:0 3% 5% 0;
	}
	
	/* 1/4 */
	.main-content .wide-text-area .area-25 {
		width:50%;
		padding:0 3% 5% 0;
	}
	
	/* Haupt-Headline im Startinhalt */
	.main-content .introtext-area h2 {
		margin-bottom:10px;
		/*font-size:4.0em;*/
	}
	
	.main-content .introtext-area h1.big {
		margin-bottom:10px;
		/*font-size:4.0em;*/
	}
}


@media screen and ( min-width:800px ) {
	.stoerer {
		right:8%; bottom:10%; top:auto;	
	}
	
	.main-content.vierspalter {
		height:auto;	
	}
	
	.main-content.dreispalter {
		height:auto;	
	}
	
	.main-content .cat {
		margin:0 0 0 11%;
	}
	
	.main-content .cat.light {
		color:#404142;	
	}
	
	/* Hintergrundbilder */
	.main-image {
		 height:100%;
	}
	
	/* Hintergrundbilder */
	.start-theme {
		background-image:url(../images/desktop_00.jpg);
	}
	
	.cat-1-theme {
		background-image:url(../images/desktop_01.jpg); 
	}
	
	.cat-2-theme {
		background-image:url(../images/desktop_02.jpg); 
	}
	
	.cat-3-theme {
		background-image:url(../images/desktop_03.jpg); 
	}
	
	.cat-4-theme {
		background-image:url(../images/desktop_04.jpg); 
	}
	
	.cat-5-theme {
		background-image:url(../images/desktop_05.jpg); 
	}
	
	.cat-6-theme {
		background-image:url(../images/desktop_06.jpg); 
	}
	
	.cat-7-theme {
		background-image:url(../images/desktop_07.jpg); 
	}
	
	.main-content .cat {
		top:2%;	
		margin:0 0 0 11%:
	}
	
	.main-content .text-area {
		top:30%;
		max-height:70%;
		width:35%;
		margin-left:8%;
	}
	
	.main-content .introtext-area {
		top:20%;
		margin-left:8%;
		width:50%;
	}
	
	.main-content .wide-text-area {
		width:85%;
		padding:0 30px 30px 30px;
		position:absolute;
		max-height:90%;
	}
	
	/* 1/3 */
	.main-content .wide-text-area .area-33 {
		width:33%;
		padding:0 3% 0 0;
	}
	
	/* 1/4 */
	.main-content .wide-text-area .area-25 {
		width:25%;
		padding:0 3% 0 0;
	}
	
	.main-content .wide-text-area .area-25 p {
		font-size:1.0em;
	}
}

@media screen and ( min-width:900px ) {
	.main-content .text-area {
		top:35%;
		width:38%;
	}
	
	.main-content .introtext-area {
		top:14%;
		width:51%;
		max-height:85%;
	}
	
	.main-content .introtext-area h2 {
		font-size:2.8em;
	}
	
}

@media screen and ( min-width:1200px ) {
	.stoerer {
		width:220px; height:220px;
		right:10%; bottom:12%;	
	}
	
	.main-content .text-area {
		top:35%;
		width:30%;
	}
	
	.main-content .introtext-area {
		width:49%;
		top:15%;
		max-height:80%;
	}
	
	.main-content .introtext-area h2 {
		font-size:3.2em;
	}
	
	.main-content .wide-text-area {
		width:75%;
		padding:30px;
		margin:8% 0 5% 11%;
	}
	
	.main-content .wide-text-area .area-25 p {
		font-size:1.2em;
	}
}

@media screen and ( min-width:1600px ) {
	.main-image {
		/* for scaling responsive images */
		image-rendering:pixelated;
		image-rendering:-webkit-pixelated;
		image-rendering:-moz-pixelated;
		image-rendering:-ms-pixelated;	
	}
	
	.main-content .wide-text-area {
		width:70%;
	}
	
	.main-content .introtext-area {
		width:39%;
		top:15%;
		max-height:80%;
	}
	
	.main-content .introtext-area h2 {
		font-size:3.4em;
	}
}

@media screen and ( min-width:1800px ) {
	.main-content .introtext-area {
		width:36%;
	}
}

/* landscape */
@media screen 
  and (max-width: 760px)
   and (max-height: 500px) 
   and (orientation: landscape) {
	.stoerer {
		width:100px; 
		height:100px; 
		position:absolute; 
		right:5%;
		top:auto;
		bottom:20px; 
	}
	
	/* Main Content */
	.main-content {
		min-height:100%; height:auto;
		margin:0;
	}
	
	#start {
		height:220%;
		margin:0;	
	}
	
	.main-image {
		position:relative;
		background-size:cover;
		background-position:center -190px; 
		width:100%; height:300px; 
		display:block; 
		float:left; 
	}
	
	.start-theme {
		background-image:url(../images/medium_00.jpg);
		height:100%;
		background-size:100% auto;
		background-position:center -80px;
	}
	
	.cat-1-theme {
		background-image:url(../images/medium_01.jpg); 
	}
	
	.cat-2-theme {
		background-image:url(../images/medium_02.jpg); 
	}
	
	.cat-3-theme {
		background-image:url(../images/medium_03.jpg); 
	}
	
	.cat-4-theme {
		background-image:url(../images/medium_04.jpg); 
	}
	
	.cat-5-theme {
		background-image:url(../images/medium_05.jpg); 
	}
	
	.cat-6-theme {
		background-image:url(../images/medium_06.jpg); 
	}
	
	.cat-7-theme {
		background-image:url(../images/medium_07.jpg);
	}
	
	.main-content .text-area {
		width:84%;
		margin:2% 8% 5% 8%;
		position:relative;
		float:left;
		overflow:visible;
		text-align:center;
	}
	
	.main-content .text-area > * {
		text-align:center;
	}
	
	.main-content .introtext-area {
		position:absolute;
		top:10%;
		margin:2% 4% 4% 4%;
		text-align:left;
		max-height:70%;
		width:80%;
	}
	
	.main-content .introtext-area > * {
		text-align:left;
	}
	
	.main-content .introtext-area h2 {
		font-size:3.0em;
	}
	
	.main-content .introtext-area h1.big {
		font-size:3.0em;
	}
	
	.main-content .wide-text-area h3 {
		margin:10px 0 10px 0;
	}
	
}

/* nur für iPad, wegen fehler bei der browserfenster-höhe, wenn tabs beim herunterscrollen ausgeblendet werden */
@media (orientation:landscape) and (height:672px) {
    .main-content {
        height: 732px !important;
    }
}

@media (orientation:portrait) and (height:928px) {
    .main-content {
        min-height: 988px !important;
    }
}