/* source-sans-pro-300 - latin */
@font-face {
	font-family: 'Source Sans Pro';
	font-style: normal;
	font-weight: 300;
	src: url('fonts/source-sans-pro-v11-latin-300.eot'); /* IE9 Compat Modes */
	src: local('Source Sans Pro Light'), local('SourceSansPro-Light'),
		 url('fonts/source-sans-pro-v11-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/source-sans-pro-v11-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-300.woff') format('woff'), /* Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/source-sans-pro-v11-latin-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-regular - latin */
  @font-face {
	font-family: 'Source Sans Pro';
	font-style: normal;
	font-weight: 400;
	src: url('fonts/source-sans-pro-v11-latin-regular.eot'); /* IE9 Compat Modes */
	src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'),
		 url('fonts/source-sans-pro-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/source-sans-pro-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/source-sans-pro-v11-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }
  /* source-sans-pro-700 - latin */
  @font-face {
	font-family: 'Source Sans Pro';
	font-style: normal;
	font-weight: 700;
	src: url('fonts/source-sans-pro-v11-latin-700.eot'); /* IE9 Compat Modes */
	src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'),
		 url('fonts/source-sans-pro-v11-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('fonts/source-sans-pro-v11-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-700.woff') format('woff'), /* Modern Browsers */
		 url('fonts/source-sans-pro-v11-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('fonts/source-sans-pro-v11-latin-700.svg#SourceSansPro') format('svg'); /* Legacy iOS */
  }

HTML, BODY {
	height: 100%;
}

HTML {
	overflow: hidden;
}

BODY {
	overflow: auto;
}

.ce_text {
	margin-bottom: 48px;
}

#wrapper {
	position: relative;
	min-height: 100%;
	min-width: 480px;
	padding-bottom: 50px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#main {
	width: auto;
	margin: 0 24px 48px;
}

BODY {
	background: #191919;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	color: #FFF;
	line-height: 1.38em;
}

A {
	color: #14d1ca;
	text-decoration: none;
}

H2 {
	font-size: 35px;
	margin-top: 0;
	color: #14d1ca;
	font-weight: 300;
	line-height: 1.4em;
}

#header .inside {
	margin-bottom: 48px;
}

/* --------- */
/* HEADERNAV */
/* --------- */

#headernav {
	max-width: 1400px;
	padding: 0 24px;
	margin: 0 auto;
	text-align: center;
	line-height: 1px;
}

#logo {
	float: left;
	margin-top: 25px;
	width: 276px;
	height: 25px;
	background: transparent url('/files/schirk-medien/logo.png') no-repeat 0 0;
	max-width: 75%;
	background-size: contain;
}

#logo A {
	display: block;
	width: 276px;
	height: 25px;
}

#logo SPAN {
	display: none;
}

#phone {
	float: right;
	background: #323232;
	color: #14d1ca;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 700;
	line-height: 75px;
	padding: 0 24px;
	font-size: 18px;
}

#phone I {
	font-size: 1.6em;
	margin-right: 6px;
	vertical-align: middle;
}

#headernav UL {
	display: inline-block;
	list-style-type: none;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	width: 80%;
}

#headernav LI {
	display: inline-block;
	line-height: 75px;
	overflow: auto;
	font-size: 14px;
	padding: 0 5%;
	text-transform: uppercase;
}

#headernav LI:first-child {
	padding-left: 0;
}

#headernav LI A {
	text-decoration: none;
	color: #FFF;
}

#headernav LI A:hover {
	color: #14d1ca;
}

#headernav LI SPAN {
	color: #14d1ca;
	display: inline-block;
	position: relative;
}

#headernav LI SPAN:before {
	display: block;
	content: ' ';
	background: #FFF;
	width: 21px;
	height: 3px;
	position: absolute;
	left: 0;
	top: 52px;
}

/* ----------------- */
/* MOBILE NAVIGATION */
/* ----------------- */

#mobilenavigation {
	display: none;	
}

#mobilenavigation UL {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: 75%;
	z-index: 2;
	background: #111;
	padding: 0;
	margin: 0;
	display: none;
}

#mobilenavigation A,
#mobilenavigation SPAN {
	font-size: 24px;
	background: #222;
	color: #CCC;
	display: block;
	padding: 12px 24px;
	border-bottom: 1px solid #161616;
	border-top: 1px solid #292929;
}

#mobilenavigation SPAN.active {
	background: #2c2c2c;
}

#mobilenavigation I.fa {
	position: absolute;
	top: 24px;
	left: 24px;
	font-size: 24px;
}

/* ------ */
/* SLIDER */
/* ------ */

#slider {
	width: 100%;
	white-space: nowrap;
	position: relative;
	overflow: hidden;
	line-height: 90px;
}

#slider DIV {
	width: 100%;
	height: 550px;
	display: inline-block;
	background-size: cover;
	color: #FFF;
	overflow: hidden;
}

#slider H2 {
	opacity: 0;
	max-width: 1100px;
	margin: 260px auto 0;
	font-weight: 300;
	font-size: 90px;
	color: #FFF;
	line-height: 1em;
}

#slider H2 SPAN {
	display: block;
	text-align: center;
	font-weight: 700;
	opacity: 0;
}

#slider1 {
	background: transparent url('/files/schirk-medien/slider/slider1.jpg') no-repeat center center;
}

#slider2 {
	background: transparent url('/files/schirk-medien/slider/slider2.jpg') no-repeat center center;
}

#slider3 {
	background: transparent url('/files/schirk-medien/slider/slider3.jpg') no-repeat center center;
}

#slider I {
	position: absolute;
	top: 0;
	color: #FFF;
	font-size: 64px;
	line-height: 550px;
	text-align: center;
	width: 10%;
	cursor: pointer;
	opacity: 0.8;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

#slider I:hover {
	font-size: 80px;
	opacity: 1;
}

#slider I.fa-arrow-circle-left {
	left: 0;
}

#slider I.fa-arrow-circle-right {
	right: 0;
}

/* ---- */
/* MAIN */
/* ---- */

#container {
	width: 1448px;
	margin: 0 auto;
}

/* ------ */
/* TEASER */
/* ------ */

#teaser {
	margin-bottom: 3em;
}

#teaser > DIV {
	width: 454px;
	margin-left: 19px;
	float: left;
}

#teaser > DIV:first-child {
	margin-left: 0;
}

#teaser H2 {
	font-size: 35px;
	margin: 0 0 0.5em;
	width: 454px;
	height: 250px;
	line-height: 250px;
	text-align: center;
	position: relative;
	border-bottom: 5px solid #14d1ca;
}

#teaser H2:hover {
	border-color: #FFF;
}

#teaser H2:before {
	position: absolute;
	content: ' ';
	bottom: 0;
	left: 0;
	right: 0;
	height: 0;
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

#teaser H2:hover:before {
	height: 250px;
}

#teaser H2 A {
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	color: #FFF;
	text-decoration: none;
	text-shadow: 0 0 24px #000;
	font-weight: 300;
}

#teaser1 H2 {
	background: transparent url('/files/schirk-medien/teaser/teaser1.png') no-repeat center center;
}

#teaser1 H2:before {
	background: transparent url('/files/schirk-medien/teaser/teaser1hover.png') no-repeat center bottom;
}

#teaser2 H2 {
	background: transparent url('/files/schirk-medien/teaser/teaser2.png') no-repeat center center;
}

#teaser2 H2:before {
	background: transparent url('/files/schirk-medien/teaser/teaser2hover.png') no-repeat center bottom;
}

#teaser3 H2 {
	background: transparent url('/files/schirk-medien/teaser/teaser3.png') no-repeat center center;
}

#teaser3 H2:before {
	background: transparent url('/files/schirk-medien/teaser/teaser3hover.png') no-repeat center bottom;
}

#teaser P {
	margin: 0;
}

#teaser A {
	white-space: nowrap;
}

/* ----- */
/* ICONS */
/* ----- */

#Bottom {
	background: #323232;
}

#Bottom IFRAME {
	width: 100%;
	height: 600px;
}

#icons {
	max-width: 1400px;
	margin: 0 auto;
}

#icons {
	text-align: center;
	height: 125px;
	font-size: 48px;
}

#icons DIV,
#icons A {
	margin-top: 32px;
	color: #14d1ca;
	padding-left: 5%;
	position: relative;
	text-align: left;
	display: inline-block;
	width: 15%;
}

#icons DIV:before,
#icons A:before {
	position: absolute;
	left: 0;
}

#icons P,
#icons SPAN {
	display: block;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 16px;
	line-height: 21px;
	margin: 3px 0;
	color: #FFF;
}

/* ------ */
/* FOOTER */
/* ------ */

#footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: #14d1ca;
	color: #000;
}

#footer DIV.inside {
	max-width: 1400px;
	margin: 0 auto;
	line-height: 50px;
	font-size: 13px;
	font-weight: 700;
	padding: 0 24px;
}

#footer NAV {
	float: right;	
}

#footer UL {
	margin: 0;
	padding: 0;
}

#footer LI {
	padding: 0;
	display: inline-block;
}

#footer LI:before {
	content: ' / ';
}

#footer LI:first-child:before {
	content: '';
}

#footer A {
	color: #000;
}

#copyright {
	float: left;
}

#facebook {
	float: right;
	font-size: 2em;
	margin-left: 21px;	
}

#facebook SPAN {
	display: none;
}

#facebook A {
	color: #282828;
}

.pdf {
	overflow: auto;
}

.pdf .preview A {
	border: 0;
}

.pdf .preview {
	position: relative;
	float: left;
	margin-right: 24px;
	line-height: 1px;
	overflow: hidden;
}

.pdf .preview A:before {
	content: ' ';
	width: 32px;
	height: 32px;
	position: absolute;
	background: transparent url('Adobe_PDF_file_icon_32x32.png') no-repeat 0 0;
	bottom: 3px;
	right: 3px;
}

.pdf H3 {
	margin-top: 4px;
}

#main {
	float: none;
}

/* ------ */
/* HEADER */
/* ------ */

#unternehmen-header {
	height: 450px;
	background: transparent url('/files/schirk-medien/slider/slider2.jpg') no-repeat center center;
	background-size: cover;
	margin-bottom: 32px;
}

#leistungen-header {
	height: 450px;
	background: transparent url('/files/schirk-medien/slider/slider3.jpg') no-repeat center center;
	background-size: cover;
	margin-bottom: 32px;
}

#unternehmen-header H1,
#leistungen-header H1 {
	font-size: 75px;
	margin: 0;
	line-height: 450px;
	max-width: 1400px;
	margin: 0 auto;
	font-weight: 300;
	text-shadow: 0 0 24px #000;
	padding: 0 48px;
}

/* ------- */
/* SPALTEN */
/* ------- */

.linke-spalte {
	float: left;
	width: 46%;
	margin-bottom: 48px;
}

.rechte-spalte {
	float: right;
	width: 46%;
	margin-bottom: 48px;
}

.linke-spalte-drittel {
	float: left;
	width: 32%;
}

.mittlere-spalte-drittel {
	float: left;
	width: 32%;
	margin-left: 2%;
}

.rechte-spalte-drittel {
	float: right;
	width: 32%;
}

DIV.mehrspaltig {
	column-count: 2;
	-webkit-column-count: 2;
	-moz-column-count: 2;
	column-gap: 128px;
	-webkit-column-gap: 128px;
	-moz-column-gap: 128px;
}

DIV.mehrspaltig P {
	margin-top: 0;
}

/* -------- */
/* TIMELINE */
/* -------- */

#timeline UL {
	list-style-type: none;
	padding-left: 68px;
	margin-bottom: 64px;
}

#timeline LI {
	position: relative;
	padding-left: 34px;
	padding-bottom: 64px;
	opacity: 0.2;
	transition:opacity 500ms ease-out;
}

#timeline LI.visible {
	opacity: 1;
}

#timeline LI STRONG {
	position: absolute;
	display: inline-block;
	right: 100%;
	margin-right: 32px;
	color: #14d1ca;
}

#timeline LI STRONG:before {
	content: ' ';
	width: 12px;
	height: 12px;
	background: #FFF;
	border-radius: 50%;
	position: absolute;
	right: -42px;
	top: 0;
	border: 2px solid #191919;
}

#timeline LI:before {
	content: ' ';
	width: 4px;
	background: #14d1ca;
	height: 0;
	display: block;
	position: absolute;
	left: 0;
	top: 10px;
}

#timeline LI.visible:before {
	height: 100%;
	animation-name: timeline;
	animation-duration: 1s;
}

#timeline LI:last-child:before {
	display: none;
}

@keyframes timeline {
    0% {height: 0;}
    20% {height: 0;}
    100% {height: 100%;}
}

/* ---------------- */
/* RUNDGANG STARTEN */
/* ---------------- */

#unternehmen-rechte-spalte {
	overflow: visible;
}

#rundgang-starten {
	position: relative;
	overflow: visible;
	text-align: right;
	padding-top: 90px;
}

#rundgang-starten A {
	color: #FFF;
	display: inline-block;
	line-height: 35px;
}

#rundgang-starten .fa {
	font-size: 2em;
	color: #14d1ca;
	float: left;
	margin-right: 12px;
}

#rundgang-starten IMG {
	position: absolute;
	border-radius: 50%;
	box-shadow: 0 0 12px #191919;
}

#rundgang-starten IMG.heute {
	bottom: 60px;
	right: 50px;
}

#rundgang-starten IMG.damals {
	top: -80px;
	left: 50px;
}

/* --- */
/* BOX */
/* --- */

.box-grau {
	background: #646464;
	padding: 21px;
	border-bottom: 5px solid #14d1ca;
	margin-bottom: 20px;
}

.box-weiss {
	background: #FFF;
	padding: 21px;
	color: #000;
	border-bottom: 5px solid #14d1ca;
	margin-bottom: 20px;
}

.box-grau H2 {
	color: #14d1ca;
	line-height: 1.2em;
	font-weight: 300;
}

.box-weiss H2 {
	color: #FFF;
	line-height: 1.2em;
	font-weight: 300;
	color: #000;
}

.box-grau H3 {
	color: #14d1ca;
	font-weight: 300;
}

.box-grau UL {
	padding-left: 16px;
}

/* --------------- */
/* ANSPRECHPARTNER */
/* --------------- */

#ansprechpartner {
	overflow: visible;
	margin-bottom: 48px;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

#ansprechpartner h2 {
	width: 100%;
}

#ansprechpartner .ce_text {
	width: 30%;
	margin-left: 5%;
	white-space: nowrap;
	overflow: visible;
	text-align: center;
	margin-top: 20px;
}

#ansprechpartner h2 + .ce_text {
		margin-left: 0;
}

#ansprechpartner IMG {
	border-radius: 50%;
	margin-bottom: -9px;
}

#ansprechpartner H3 {
	color: #14d1ca;
	margin-bottom: 0;
}

#ansprechpartner P {
	margin-top: 0;
}

/* -------- */
/* FORMULAR */
/* -------- */

.widget-text {
	height: 39px;
	margin-bottom: 18px;
}

.widget-text LABEL {
	display: inline-block;
	line-height: 39px;
	width: 100px;
}

.widget-text INPUT {
	border: 0;
	margin: 0;
	padding: 0 12px;
	line-height: 39px;
	height: 39px;
	width: 50%;
}

.widget-textarea LABEL {
	display: block;
	line-height: 39px;
}

.widget-textarea TEXTAREA {
	width: 100%;
	padding: 12px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.widget-checkbox FIELDSET {
	border: 0;
	padding-left: 0;
}

.widget-checkbox INPUT {
	line-height: 2em;
	padding: 0 0.5em;
}

.widget-checkbox span input[type="checkbox"] {
	-webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background-color: #FFF;
    margin: 0;
	float: left;
	outline: none;
}

.widget-checkbox input[type="checkbox"]:checked {
	background-image: url(schirk-medien/check.png);
    background-size: contain;
}

.widget-checkbox {
	margin-top: 10px;
}

.widget-checkbox {
	margin-top: 10px;
}

.widget-checkbox .checkbox_container label {
	display: block;
    margin-left: 30px;
}

.widget-checkbox .checkbox_container label .ce_text {
	margin-bottom: 0;
}

.widget-checkbox .checkbox_container label .ce_text p {
	margin-top: 0;
}

.submit {
	margin-top: 24px;
	background: #14d1ca;
	color: #000;
	line-height: 50px;
	padding: 0 45px;
	border: 0;
	font-family: 'Droid Sans', sans-serif;
	font-weight: 700;
}

/* ----------------- */
/* max-width: 1464px */
/* ----------------- */

@media screen and (max-width: 1464px) {
	
	#container {
		width: 100%;
	}
	
	#main {
		width: 97%;
		margin: 0 auto 48px;
		float: none;
	}
		
	#slider H2 {
		max-width: 76%;
		font-size: 6.2vw;
		margin-top: 18%;
		margin-bottom: 7.5%;
	}
	
	#slider DIV {
		height: 100%;
	}
	
	#slider I.fa-arrow-circle-right,
	#slider I.fa-arrow-circle-right:hover,
	#slider I.fa-arrow-circle-left,
	#slider I.fa-arrow-circle-left:hover {
		font-size: 4.4vw;
		line-height: 8.5em;
		transition-property: none;
	}
	
	/* ------ */
	/* TEASER */
	/* ------ */

	#teaser > DIV {
		width: 32.4%;
		margin-left: 1.4%;
	}
	
	#teaser > DIV:fist-child {
		margin-left: 0;
	}

	#teaser H2 {
		width: 100%;
		background-size: cover;
		background-position: center bottom;
	}

	#teaser H2:hover:before,
	#teaser H2:before {
		transition-property: none;
		-moz-transition-property: none;
		-webkit-transition-property: none;
		position: relative;
		display: block;
		padding-top: 55%;
		height: 0;
		background: none;
	}
	
	#teaser H2,
	#teaser H2:hover {
		height: auto;
		border-bottom: 3px solid #14d1ca;
	}
	
	.widget H2,
	.ce_text H2,
	#teaser H2 A {
		top: 43%;
		font-size: 2.4vw;
		line-height: 1em;
	}
	
	.widget P,
	.ce_text P,
	#teaser P,
	#icons P,
	#icons SPAN,
	#timeline LI {
		font-size: 1.1vw;
		line-height: 1.4em;
	}
	
	#icons DIV:before,
	#icons A:before {
		font-size: 3.5vw;
	}
		
}

@media screen and (max-width: 1300px) {

	#unternehmen-header,
	#leistungen-header	{
		height: auto;
		padding: 0;
	}
	
	#unternehmen-header .ce_text,
	#leistungen-header .ce_text {
		margin: 0;
	}
	
	#leistungen-header H1,
	#unternehmen-header H1 {
		font-size: 5.77vw;
		line-height: 6em;
		white-space: nowrap;
	}
	
	#kontakt-header #unternehmen-header H1,
	#agb-header #unternehmen-header H1 {
		font-size: 4vw;
		line-height: 8.6em;
	}
	
	#rundgang-starten {
	}
	
	#rundgang-starten .heute {
		width: 67%;
	}

	#rundgang-starten .damals {
		width: 42%;
	}

	#teaser P,
	.widget p,
	LABEL,
	#icons P,
	#icons SPAN,
	.ce_text P,
	.ce_text LI,
	#timeline LI {
		font-size: 14px;
	}

	#icons DIV:before,
	#icons A:before {
		font-size: 40px;
	}
		
}

@media screen and (max-width: 1000px) {

	#ansprechpartner {
		overflow: auto;
		margin-bottom: 48px;		
	}

	#ansprechpartner .blank {
		display: none;
	}

	#ansprechpartner .ce_text {
		width: 46%;
		margin-bottom: 12px;
	}

	#ansprechpartner .cleared {
		margin-left: 0;
		clear: both;
	}
	
	#ansprechpartner .first {
		width: 100%;
	}

	#phone {
		display: none;
	}

}

@media screen and (max-width: 900px) {
	
		DIV.mehrspaltig {
			column-count: 1;
			-webkit-column-count: 1;
			-moz-column-count: 1;
		}

		#rundgang-starten {
			text-align: center;
			padding-left: 25%;
		}
	
		#rundgang-starten IMG.heute {
			width: 30%;
			right: auto;
			left: 30%;
		}

		#rundgang-starten IMG.damals {
			top: auto;
			bottom: 5%;
			width: 30%;
		}
		
		#teaser > DIV {
			width: 100%;
			margin-left: 0;
		}

		#teaser H2,
		#teaser H2:hover {
			border-bottom: 2px solid #14d1ca;
		}
		
		#teaser H2:hover:before,
		#teaser H2:before {
			height: 120px;
			padding: 0;
		}

		.ce_text H2,
		.widget H2,
		#teaser H2 A {
			top: 40%;
			font-size: 21px;
		}
		
		#headernav {
			height: 50px;
		}
		
		#headernav NAV {
			display: none;
		}
		
		#logo {
			float: none;
			margin: 24px auto 0;
			background-position: center center;
		}
				
		#mobilenavigation {
			display: block;
		}
		
		.mobilenavigation-opened #mobilenavigation UL {
			display: block;
			box-shadow: 0 0 64px #000;		
			animation-name: open-mobile-navigation;
			animation-duration: 0.5s;
			overflow: hidden;
		}
		
		.mobilenavigation-opened {
			margin: 0 -50% 0 50%;
			animation-name: move-background;
			animation-duration: 0.5s;
		}
		
		@keyframes open-mobile-navigation {
			from {width: 0;}
			to {width: 75%;}
		}

		@keyframes move-background {
			from {margin: 0;}
			to {margin:  0 -50% 0 50%;}
		}
		
		.linke-spalte,
		.rechte-spalte,
		.linke-spalte-drittel,
		.mittlere-spalte-drittel,
		.rechte-spalte-drittel {
			width: 100%;
			margin: 0 0 48px;
		}
		
		#timeline UL {
			margin-bottom: 0;
		}
		
		.widget-text {
			height: auto;
		}
		
		#icons {
			height: 240px;
		}
		
		#icons DIV,
		#icons A {
			width: 30%;
			padding-left: 10%;
		}
		
		#icons .ce_text {
			margin-bottom: 0;
		}
		
}

@media screen and (max-width: 500px) {
	
	#ansprechpartner .ce_text {
		margin-left: 0;
		width: 100%;
	}
	
}