/* Screen-CSS - Lenk Webservice UG */

/* FONT PATH ------------------------------------------------------------------ */
@font-face {
	font-family: 'OpenSansRegular';
	src: url('../fonts/OpenSans-Regular.eot');
	src: url('../fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/OpenSans-Regular.woff2') format('woff2'),
		 url('../fonts/OpenSans-Regular.woff') format('woff'),
		 url('../fonts/OpenSans-Regular.svg#OpenSansRegular') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'FontAwesome';
	src: url('../css/font_awesome/fonts/fontawesome-webfont.eot?v=4.4.0');
	src: url('../css/font_awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'), url('../css/font_awesome/fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../css/font_awesome/fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'), url('../css/font_awesome/fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'), url('../css/font_awesome/fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal;
}

#preload_font1 {font-family: 'OpenSansRegular';}	
#preload_fontawesome {font-family: 'FontAwesome';}   


/* Allgemeine Definitionen und Resets ----------------------------------------- */
body {
	margin: 0px;
	padding: 0px;
	width: 100%;
	display: table;
	background-color: #FFFFFF;
}

figure, section, header, nav, footer, p, h1, h2, h3, h4, ul, li, a, td, th, label, input, textarea, div {
	margin: 0px;
	padding: 0px;
	font-family: 'OpenSansRegular', Arial;
	font-size: 15px;
	font-weight: normal;
	font-style: normal;
	letter-spacing: 0.02em;
	color: #646566;
}

img {border: none; display: inline;}

ul {list-style-type: none;}

section, header, nav, footer, ul, li, a, div, h1, h2, h3, p {background-repeat: no-repeat;}

a {cursor: pointer; text-decoration: none;}

table td {vertical-align: top;}

img {border: none;}

em, em a {font-style: italic;}


/* Panel ---------------------------------------------------------------------- */
#panel {
	margin: 0 auto;
	width: 100%;
}

/* Telefon Button ------------------------------------------------------------- */
.phone_button {
	display: inline-block;
	z-index: 300;
	position: fixed;
	top: 30px;
	right: 20px;
	width: 220px;
	height: 46px;
	padding: 0px 0px 0px 0px;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	overflow: hidden;
	border-radius: 7px;
	background-color: #C73E23;
}

	.phone_button:hover {background-color: #D07325;}

	.phone_button .icon {
		position: relative;
		top: 5px;
		left: -4px;
		font-size: 22px;
	}

		a.phone_button span.icon {
			animation-duration:1s;
			animation-iteration-count:infinite;
			animation-name:fa-icon-pulse;
			animation-timing-function:linear;
		}
		
		@keyframes fa-icon-pulse {25%{transform:scale(1.1);}75%{transform:scale(0.9);}}

	.phone_button .first,
	.phone_button .second {
		display: block;
		padding: 0px 20px 0px 20px;
		color: #ffffff;
		line-height: 46px;
		transition: margin .4s;
		background-color: transparent;
	}
	
		.phone_button:hover .first {margin-top: -46px;}


/* Navigation ----------------------------------------------------------------- */
nav#mainnavi {
	z-index: 300;
	position: fixed;
	top: 50%;
	right: 20px;
	width: 24px;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
}

	ul#nav {
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		list-style: none;
	}

		ul#nav li {margin-bottom: 10px;}

		ul#nav a {
			display: block;
			width: 24px;
			height: 24px;
			padding: 0px;
			border-radius: 2px;
			background-color: #B7B7B7;
			-webkit-transition: background-color 275ms linear, color 275ms linear;
			-moz-transition: background-color 275ms linear, color 275ms linear;
			-ms-transition: background-color 275ms linear, color 275ms linear;
			-o-transition: background-color 275ms linear, color 275ms linear;
			transition: background-color 275ms linear, color 275ms linear;			
		}

			ul#nav a:hover,
			ul#nav li.current a {background: #C73E23;}

			ul#nav a span {
				opacity: 0;
				float:right;
				position: relative;
				top: 0px;
				right: 30px;
				padding: 2px 10px 2px 10px;
				font-size: 14px;
				color: transparent;
				text-decoration: none;
				text-transform: none;
				border-radius: 3px;
				background-color: #4E8EB1;
				-webkit-transition: all 0.4s ease-in-out 0.15s;
				-moz-transition: all 0.4s ease-in-out 0.15s;
				-ms-transition: all 0.4s ease-in-out 0.15s;
				-o-transition: all 0.4s ease-in-out 0.15s;
				transition: all 0.4s ease-in-out 0.15s;				
			}		

			ul#nav a:hover span {opacity: 1; background-color: #C73E23; color: #FFFFFF;}	
			
			ul#nav li.current a span {
				opacity: 1;
				float:right;
				position: relative;
				top: 0px;
				right: 30px;
				padding: 2px 10px 2px 10px;
				font-size: 14px;
				color: #FFFFFF;
				text-decoration: none;
				text-transform: none;
				border-radius: 3px;				
				background-color: #4E8EB1;				
				-webkit-transition: all 0.4s ease-in-out 0.15s;
				-moz-transition: all 0.4s ease-in-out 0.15s;
				-ms-transition: all 0.4s ease-in-out 0.15s;
				-o-transition: all 0.4s ease-in-out 0.15s;
				transition: all 0.4s ease-in-out 0.15s;				
			}
			
		
/* Logo ----------------------------------------------------------------------- */
div#logo {
	width: 100%;
	margin-top: 30px;
	margin-bottom: 70px;
	line-height: 0px;
	text-align: center;
}

	div#logo img {
		width: 80%;
		height: auto;
	}		
		

/* Sections ------------------------------------------------------------------- */
section {
	float: left;
	width: 100%;
	min-height: 100vh;
	padding: 0px 0px 0px 0px;
	background-color: #ffffff;
}

	section#sectionLast {float: left; border-top: 1px solid #DDDDDD; background-color: #f5f5f5;}

	section div.left {
		float: left;
		width:-moz-calc(50% - 0px); width:-webkit-calc(50% - 0px); width:calc(50% - 0px);
		min-height: 100vh;
		padding: 0px 0px 0px 0px;
	}

		section div.left div.content {
			display: table-cell;
			width:-moz-calc(50% - 0px); width:-webkit-calc(50% - 0px); width:calc(50% - 0px);
			height:-moz-calc(100vh - 120px); height:-webkit-calc(100vh - 120px); height:calc(100vh - 120px);
			padding: 60px 60px 60px 60px;
			vertical-align: middle;
		}	
		
		section div.left div.content.image,
		section div.right div.content.image {width: 100vh; padding: 0px 0px 0px 0px;}

	section div.right {
		float: left;
		width:-moz-calc(50% - 0px); width:-webkit-calc(50% - 0px); width:calc(50% - 0px);
		min-height: 100vh;
		padding: 0px 0px 0px 0px;
	}
		
		section div.right div.content {
			display: table-cell;
			width:-moz-calc(50% - 0px); width:-webkit-calc(50% - 0px); width:calc(50% - 0px);
			height:-moz-calc(100vh - 120px); height:-webkit-calc(100vh - 120px); height:calc(100vh - 120px);
			padding: 60px 60px 60px 60px;
			vertical-align: middle;
		}

	section .complete {
		float: left;
		width:-moz-calc(100% - 0px); width:-webkit-calc(100% - 0px); width:calc(100% - 0px);
		min-height: 100vh;
		padding: 0px 0px 0px 0px;
	}
		
		section .complete div.content {
			display: table-cell;
			width:-moz-calc(100% - 0px); width:-webkit-calc(100% - 0px); width:calc(100% - 0px);
			min-height: 100vh;
			padding: 60px 60px 60px 60px;
			vertical-align: middle;
		}
	
	div.image_bg	{
		height: 100vh;
		background-repeat: no-repeat;
		background-position: left 50% top 50%;			
		background-size: cover;
	}

			
/* Content Formatierung ------------------------------------------------------- */
.content h1, .content h1 a {
	margin: 0px 0px 14px 0px;
	padding: 0px 0px 0px 0px;
	font-size: 29px;
	font-weight: normal;
	font-style: normal;
	line-height: 35px;
	text-align: left;
	text-transform: none;
	letter-spacing: 0.0em;
	color: #666666;
	}

.content h2, .content h2 a {
	margin: 0px 0px 8px 0px;
	font-size: 24px;
	font-weight: normal;
	font-style: normal;
	line-height: 30px;
	text-transform: none;
	letter-spacing: 0.01em;
	color: #666666;
	}

.content h3, .content h3 a {
	margin: 0px 0px 8px 0px;
	font-size: 20px;
	font-weight: normal;
	font-style: normal;
	line-height: 26px;
	letter-spacing: 0.01em;
	color: #666666;
	}

.content h4, .content h4 a {
	margin: 0px 0px 8px 0px;
	font-size: 17px;
	font-weight: normal;
	font-style: normal;
	line-height: 23px;
	letter-spacing: 0.01em;
	color: #666666;
	}
	
.content p {margin: 0px 0px 20px 0px; line-height: 21px;}

	
/* allgemeine Tabellenformatierungen */
.content table {margin-top: 10px; margin-bottom: 20px; border-collapse: collapse;}
	.content table th {border: none; padding: 5px 10px 5px 0px; background-color: #990000; color: #FFFFFF; text-align: left;}
	.content table td {border: none; padding: 5px 10px 5px 0px;}    
		.content table td h2 {margin: 0px 0px 2px 0px;}
		.content table td h3 {margin: 0px 0px 13px 0px;}
		.content table td p {}
			.content table td p a {line-height: 19px;}
			.content table td ul {margin-left: 5px; margin-bottom: 0px;}
			.content table td ul li {
				display: block;
				margin: 0px;
				padding: 0px 20px 4px 12px;
				line-height: 20px;
				background-image: url(../upload/design/content_listenpunkt.png);
				background-position: 0px 9px;
			}

/* Tabelle mit Rahmen */
.content table.tabelle-mit-rahmen th {border: 1px solid #AAAAAA; padding: 5px 10px 5px 10px;}
	.content table.tabelle-mit-rahmen th p {margin: 0px; padding: 5px 0px 5px 0px;}
.content table.tabelle-mit-rahmen td {border: 1px solid #AAAAAA; margin: 0px 10px 0px 10px; padding: 5px 10px 5px 10px;}
	.content table.tabelle-mit-rahmen td p {margin: 0px; padding: 5px 0px 5px 0px;}


/* Listen */
.content ul {
	margin-left: 20px; 
	margin-bottom: 30px;
	padding: 0px;
	list-style-type: none;
	}
        
/* Listen ohne links */
    .content ul li {
        display: block;
        margin: 0px;
        padding: 0px 0px 4px 12px;
		line-height: 20px;
        background-image: url(../upload/design/content_listenpunkt.png);
        background-position: 0px 9px;
        }
    
    .content ul li p {line-height: 20px; padding: 0px; margin: 0px;}
       
/* Liste in einem Listenpunkt */
        .content ul li ul  {margin: 1px 0px 3px 0px;}
        .content ul li ul li {
            display: block;
            margin: 0px 0px 2px 5px;
            padding: 3px 0px 0px 12px;
			line-height: 20px;
            background-image: url(../upload/design/content_listenpunkt.png);
            background-position: 0px 11px;
            }
			
    .content ol {
        margin: 0px 0px 20px 0px;
        padding: 0px 0px 0px 30px;
        }
        
/* listen ohne links */
        .content ol li {
            margin: 0px;
            padding: 0px 20px 0px 0px;
            }
        
        .content ol li ul {
            margin: 1px 0px 3px 0px;
            list-style-type: none;
            }
        
            .content ol li ul li {
                display: block;
                margin: 0 0 2px 5px;
                padding: 3px 20px 4px 12px;
				line-height: 20px;
                background-image: url(../upload/design/content_listenpunkt.png);
                background-position: 0px 11px;
                }

		
/* Font Awesome Standard-Formatierung */		
.fa:before {
    display: inline-block;
    font-family: 'FontAwesome';
    font-feature-settings: normal;
    font-kerning: auto;
    font-language-override: normal;
    font-size: 130%;
    font-size-adjust: none;
    font-stretch: normal;
    font-style: normal;
    font-synthesis: weight style;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    text-rendering: auto;
    padding-left: 0px;
    padding-right: 6px;
    text-decoration: none;
	color: #ffffff;
    }
	
                
/* fett */
.fett {font-weight: bold;}

/* farbig */
.farbig {color: #990000;}

/* fett und farbig */
.fett-farbig {font-weight: bold; color: #C73E23;}

/* rot */
.rot {color: red;}
.anker {text-decoration: none; line-height: 0px; margin: 0px; padding: 0px; font-size: 0px;}

/* Schrift */
.schrift-klein {font-size: 12px;}

/* Bilder */
.bild-rechts {float: left; margin: 0px 20px 20px 0px;}
.bild-links {float: left; margin: 0px 20px 20px 0px;}

            
/* Abstandsklassen */
.abstand-unten-0 {padding-bottom: 0px; margin-bottom: 0px;}
.abstand-unten-1 {padding-bottom: 10px;}
.abstand-unten-2 {padding-bottom: 20px;}
.abstand-unten-3 {padding-bottom: 30px;}
.abstand-unten-5 {padding-bottom: 40px;}
.abstand-unten-7 {padding-bottom: 70px;}
.abstand-unten-10 {padding-bottom: 220px;}

.abstand-oben-0 {padding-top: 0px; margin-top: 0px;}
.abstand-oben-1 {padding-top: 10px;}
.abstand-oben-2 {padding-top: 20px;}
.abstand-oben-3 {padding-top: 30px;}
.abstand-oben-5 {padding-top: 40px;}
.abstand-oben-7 {padding-top: 70px;}
.abstand-oben-8 {padding-top: 130px;}
.abstand-oben-10 {padding-top: 220px;}


/* Links im Content */
.content a {font-weight: normal; text-decoration: underline; color: #6F6F70;}

	.content a:hover {
		font-weight: normal;
		text-decoration: none;
		color:#6F6F70;
		-webkit-transition: color 175ms linear;
		-moz-transition: color 175ms linear;
		-ms-transition: color 175ms linear;
		-o-transition: color 175ms linear;
		transition: color 175ms linear;								
	}
	
.content a.link_button {
	display: inline-block;
	margin: 0px 0px 20px 0px;
	padding: 5px 15px 5px 15px;
	font-weight: normal;
	text-align: center;
	text-transform: none;
	text-decoration: none;
	color:#ffffff;
	overflow: hidden;
	border-radius: 7px;
	background-color: #4E8EB1;	
	text-decoration: none;
}

	.content a.link_button:hover {
		font-weight: normal;
		text-decoration: none;
		color:#ffffff;
		-webkit-transition: color 175ms linear;
		-moz-transition: color 175ms linear;
		-ms-transition: color 175ms linear;
		-o-transition: color 175ms linear;
		transition: color 175ms linear;								
	}