@charset "utf-8";
/* CSS Document */

/* Google Font */

@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 100;
	src:
		local('Roboto Thin'),
		local('Roboto-Thin'),
		url('font/Roboto_100.woff2') format('woff2');
}
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 300;
	src:
		local('Roboto Light'),
		local('Roboto-Light'),
		url('font/Roboto_300.woff2') format('woff2');
}
@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 100;
	src:
		local('Roboto Thin Italic'),
		local('Roboto-ThinItalic'),
		url('font/Roboto_100italic.woff2') format('woff2');
}
@font-face {
	font-family: 'Roboto';
	font-style: italic;
	font-weight: 300;
	src:
		local('Roboto Light Italic'),
		local('Roboto-LightItalic'),
		url('font/Roboto_300italic.woff2') format('woff2');
}
@font-face {
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	src:
		local('Roboto'),
		local('Roboto-Regular'),
		url('font/Roboto_400.woff2') format('woff2');
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
	}
ul {
	list-style: none;
	}
blockquote, q {
	quotes: none;
	}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}
sub {vertical-align: sub;}
sup {vertical-align: super;}
div, ul, li, p {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}


/************************************************
*	Global										*
************************************************/


body {
	background: #ffffff;
	color: #9D9E9E;
	font-size: 14px; font-weight:300; line-height: 24px;
	font-family: Roboto, Arial, Helvetica, sans-serif;	
	margin: 0px;
	padding: 0px;
	}
	
a:link, a:visited, a:hover  {color:#9D9E9E; text-decoration:none; font-weight:400;}
p {padding:5px 0px;}

#bild_cont {display:block; position:fixed; width:100vw; height:100vh; overflow:hidden;}
.bild_paralax_v {display:block; position:absolute; top:0px; left:0px; width:100vw; height:100vh; overflow:hidden;}
.bild_paralax {display:block; position:absolute; top:0px; left:0px; width:100vw; height:100vh; background-size:cover; background-repeat:no-repeat; background-position:center;}

#pic1 {background-image:url(../img/pic1_m.jpg);}
#pic2 {background-image:url(../img/pic2_m.jpg);}


.content {display:block; position:relative; width:100%; height:auto; float:left;  pointer-events:none;}

.loch {display:block; position:relative; float:left; width:100%; height:70vh; pointer-events:none; overflow:hidden;}
.logo {display:block; position:relative; float:left; width:100%; height:30vh; background-image:url(../img/logo.svg); background-repeat:no-repeat; background-position:center center; background-size:auto 100%;}

#loch1 {
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 50%, rgba(0,0,0,0.3) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 50%,rgba(0,0,0,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */

}

.pageCont {display:block; position:relative; float:left; width:100%; height:auto; margin:0; background-color:#FFF; pointer-events:auto;}
#cont2 {padding:5vh 5vw;}

.titTCC {display:block; position:absolute; width:100%; height:30px; margin-top:-15px; text-align:center; line-height: 30px; }
.titTCC table {width:auto; margin:0 auto;}
.TCC, .TCC2 {width:auto; height:auto; background-color:#ebf1e5; color:#619247; margin:0px auto; padding:0px 20px;}
.TCC2 {background-color:#DFE8F1; color:#74A0D1;}
.TCC a:link, .TCC a:visited, .TCC a:hover  {color:#619247; text-decoration:none; font-weight:300;}
.TCC2 a:link, .TCC2 a:visited, .TCC2 a:hover  {color:#74A0D1; text-decoration:none; font-weight:300;}


.papeLink3, .langeLink3 {display:none;}



.titTM {display:block; position:relative; width:100%; height:auto; text-align:center;}
.TM {display:inline-block; width:auto; height:auto; background-color:#ebf1e5; color:#619247; margin:0px auto 20px auto; padding:10px 30px; text-align:left;}
.TM a:link, .TM a:visited, .TM a:hover  {color:#619247;}
.TM li {display:block; position:relative; width:auto; height:auto; padding:5px 0 5px 25px; background-image:url(../img/pf_li.svg); background-repeat:no-repeat; background-size:12px auto; background-position:0px 12px; min-height:24px;} 

.tema {display:block; position:relative; float:left; width:100%; height:auto; padding:5vh 5vw;}
.tema h1 {display:block; position:relative; float:left; width:100%; height:auto;  text-align:center; color:#619247; padding:5px 0px; font-size:20px; line-height:34px; font-weight:300;}

.table, .tr {display:block; position:relative; float:left; width:100%; height:auto;}
.pape {display:block; position:relative; float:left; width:100%; height:auto; padding:20px; background-color:#ebf1e5; color:#65944e; text-align:right;}

.pape a:link, .pape a:visited, .pape a:hover  {color:#65944e; text-decoration:none; font-weight:400;}

.lange {display:block; position:relative; float:left; width:100%; height:auto; padding:20px; background-color:#e0e7f2; color:#74a0d1;}
.lange a:link, .lange a:visited, .lange a:hover  {color:#74a0d1; text-decoration:none; font-weight:400;}

.pape h1, .lange h1 {font-size:20px; line-height:34px; padding:10px 0px; font-weight:400;  cursor:pointer;}

.pape h2, .lange h2 {font-size:16px; line-height:24px; font-weight:400; padding:5px 0px;}

.txtPL {width:100%; height:auto;}

.jetzt_lange {display:block; position:relative; float:left; width:100%; height:auto; text-align:center; margin:10px 0;}
.jetzt_pape {position:absolute; float:none; width:auto; height:auto; margin:0; left:10px; top:10px;}
.jetzt_pape img, .jetzt_lange img {height:17vh; width:auto;}

.footer {display:block; position:relative; float:left; width:100%; height:auto; background-color:#b0c996; color:#619247; pointer-events:auto;}
.footer a:link, .footer a:visited, .footer a:hover  {color:#619247; text-decoration:underline; font-weight:300;}
.footer a:hover {text-decoration:none;}
.f_logo {display:block; position:relative; float:left; width:100%; height:auto; padding:20px 0px; text-align:center; background-color:#619247;}
.f_logo img {width:30%; height:auto;}
.f_menu {display:block; position:relative; float:left; width:100%; height:auto; padding:20px 0px;}

.table_f, .td_f {display:block; position:relative; float:left; width:100%; height:auto;}
.td_f {padding:0px 40px;}
.td_f h1 {font-size:16px; line-height:24px; font-weight:400; padding:0px; margin:0px; color:#FFF;}



@media only screen and (min-width: 769px) {
	#pic1 {background-image:url(../img/pic1.jpg);}
	#pic2 {background-image:url(../img/pic2.jpg);}
	body {  font-size:16px; line-height:30px;}
	.titTCC {margin-top:-20px; height:40px; font-size:16px; line-height:40px;}
	.TCC, .TCC2 {padding:0px 30px;}
	.tema {padding:10vh 10vw;}
	.tema h1, .pape h1, .lange h1 {font-size:24px; line-height:38px;}
	

	
	#cont2 {padding:10vh 10vw;}
	
	.table {display:table; float:none;}
	.tr {display:table-row; float:none;}
	
	
	
	.pape, .lange {display:table-cell; float:none; width:50%; vertical-align:top; padding:30px; font-size:16px; line-height:30px;}
	.pape h2, .lange h2 {font-size:18px; line-height:30px;}
	.pape {padding-left:10%;}
	.lange {padding-right:10%;}
	
	.jetzt_lange, .jetzt_pape {position:absolute; float:none; width:10vw; height:10vw; top:120px;}
	.jetzt_lange {margin:0 0 0 -16vw; left:100%; }
	.jetzt_pape {left:6vw; margin:0;}
	.jetzt_lange img, .jetzt_pape img { width:100%; height:auto;}
	
	
	
	
	.f_logo, .f_menu {display:table-cell; float:none; width:25%; vertical-align:middle; padding:20px;}
	.f_logo img {width:15vw;}
	.f_menu {width:75%;}
	
	
	
	.table_f {display:table; float:none; width:auto; margin:0px auto;}
	.td_f {display:table-cell; float:none; width:auto; vertical-align:bottom; padding:0px 15px;}
	.td_f h1 {font-size:18px; line-height:24px;}
	
	.TM li {padding:5px 0 5px 30px; background-size:13px auto; background-position:0px 15px; min-height:30px; font-size:16px; line-height:30px;}
}

@media only screen and (min-width: 1200px) {
	p {padding:10px 0px;}
	.titTCC {font-size:18px;}
	body { font-size:18px; line-height:34px;}
	.tema {padding:10vh 20vw;}
	.tema h1, .pape h1, .lange h1 {font-size:30px; line-height:40px; padding:15px 0px;}
	


	
	#cont2 {padding:10vh 20vw;}
	.pape, .lange {padding:40px; font-size:18px; line-height:34px;}
	.pape h2, .lange h2 {font-size:22px; line-height:34px; padding:10px 0px;}
	.pape {padding-left:15%;}
	.lange {padding-right:15%;}
	
	.jetzt_lange  { margin:0 0 0 -24vw; top:150px;}
	.jetzt_pape  { left:14vw; top:150px;  margin:0;}
	
	.td_f {padding:0px 20px;}
	.td_f h1 {font-size:22px; line-height:30px;}
	.TM li {padding:5px 0 5px 35px; background-size:15px auto; background-position:0px 17px; min-height:34px; font-size:18px; line-height:34px;}
	
	
.papeLink3 {display:block; position:fixed; width:5wh; height:5wh; top:68vh; left:10%;}
.langeLink3 {display:block; position:fixed; width:5wh; height:5wh; top:68vh; left:85%;}
.papeLink3 img {width:100%; height:100%;} 
.langeLink3 img {width:100%; height:100%;}
}

@media only screen and (min-width: 1600px) {
	.titTCC {font-size:20px;}
	body { font-size:20px; line-height:38px;}
	.tema {padding:10vh 25vw;}
	.tema h1, .pape h1, .lange h1 {font-size:36px; line-height:44px;  padding:20px 0px;}


	
	#cont2 {padding:10vh 25vw;}
	.pape, .lange {padding:50px; font-size:20px; line-height:38px;}
	.pape {padding-left:20%;}
	.lange {padding-right:20%;}
	.pape h2, .lange h2 {font-size:24px; line-height:38px;}
	.jetzt_lange  {margin:0 0 0 -28vw; top:170px;}
	.jetzt_pape  {left:18vw;  top:170px;}
	
	.f_logo img {width:10vw;}
	.td_f  {padding:0px 30px;}
	.td_f h1 {font-size:24px; line-height:34px;}
	
	.TM li {background-position:0px 19px; min-height:38px; font-size:20px; line-height:38px;}
}