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

html {
	box-sizing: border-box;
}

@font-face {
  font-family: 'PTSans-Regular';
  src: url(../PTSans-Regular.woff2) format('woff2');
}
@font-face {
  font-family: 'PTSans-Bold';
  src: url(../PTSans-Bold.woff2) format('woff2');
}

html, body {
	margin:0; padding:0; width:100%; height:100%; 
	font-family: "PTSans-Regular", sans-serif;
	font-size: 14px;
	color: #036;
	bgcolor:#FFF;  
}


	a:link{color: #C4247E; text-decoration: none;}
	a:visited{ color: #D21D88; text-decoration: none;}
	a:hover{ color: #D32890;text-decoration: none;}
	a:active {color: #BB2481;	text-decoration: none;}

/** Hack: Internet Explorer 10 und 11 verstehen die font-size-Kalkulation oben nicht,
	darum nur für IEs hier noch mal überschreiben! **/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
   html {
	   font-size: 62.5%;
	}
}

.clearfix {clear:both; }


	
#article {font-size:14px;padding-right: 20%;}
h1{font-size: 18pt;padding-left: 10%;color: #9C0;}
h2{font-size: 3vh;padding-left: 53%;}
h3{font-size: 2vh;padding-left: 60%;a:link color: #C4247E;text-decoration: none;}
h4{font-size: 2em;padding-left: 10%;a:link color: #C4247E;text-decoration: none;}
#impr{font-size: 1.2em;padding-left: 10%;padding-top: 2%;padding-right: 10%;color: #7dac25;}
.impressum{font-size: 1.0em;padding-left: 2%;padding-right: 5%;color: #036;}
.home {font-size: 1em; color: 06C; padding-left: 0%;}
.merle {font-size: 0.7em; color: 06C; padding-left: 2%;}

.andrea{font-size: 4vh;padding-left: 10%;color: #7dac25;}
.remmert{font-size: 4vh;padding-left: 1%;color: #7dac25;font-weight:bolder;}
.therapie{font-size: 1.9vh;padding-left: 42vw;}

/* Hintergrundbilder */
.section {
	background-color: #fff;
	background-attachment: fixed;
	background-position: top center;
	background-size: cover;
	background-repeat: no-repeat;
	width: 100vw;
	height: 100vh;
}

.section-0 {
	background-image: url(../images/blumen.jpg);
	width: 100vw;
	height: 100vh;
} 

.section-1 {
	height: auto;
	padding-bottom: 40vh;
}

.section-2 {
	width: 100vw;
	height: 100vh;
	magin: 0;
	padding: 0;
	background-image: url(../images/froehlich.jpg);
}
.section-3 {
	width: 100vw;
	height: 20vh;

}


#session1{
	background-color:#fff;
	color:#036;	
	padding: 1em 1em 0em 1em;
	width: 100vw;
	height: 18vh;
	float: left;
	margin-top: 28vh;
}

/*Navigation*/
#session2{
	background-color:#fff;
	color:#036;	
	padding: 1em 1em 0em 1em;
	font-size: 14px;
	width: 75vw;
	heigth: auto;
	float: left;
	margin-top: 12vh;
	margin-left: 8vw;
	margin-right: 5vw;
}
#session2 img{width: 25vw;}

/*Telefonische Erreichbarkeit*/
#session3{
	padding: 1em 1em 0em 1em;
	font-size: 12px;
	width: 80vw;
	height: 20vh;
	height: auto;
	float: left;
	margin-top: 0vh;
	margin-left: 20vw;
	margin-right: 5vw;
}

#session4{
	padding: 1em 1em 0em 1em;
	font-size: 14px;
	width: 50vw;
	height: 30vh;
	float: left;
	margin-top: 10vh;
	margin-left: 15vw;
	margin-right: 5vw;
}



#nachoben {font-size:24px; text-align:center; font-weight:bolder; position:fixed;    bottom:0; left:0; right:0; }

nav ul{font-size:17px; }
nav ul li a, {alink:#FF3333; vlink:#CC00FF;}
nav a:visited{color:#CC00FF;text-decoration:none;}
#nav a img {
	height:50%;
	text-align:center;
}



@media only screen and (max-width: 1080px) and (orientation: portrait){
	h1{font-size: 16pt;}
	h2{font-size: 14pt;padding-left: 10vw;}
	h3{font-size: 12pt;padding-left: 10vw;}
	.therapie{font-size: 1.3vh;padding-left: 10vw;}
	article {font-size: 12pt;}
	#session2{ height: auto;margin-top: 5vh; background-color:#fff;}
	#session3{ font-size: 12pt; height: 10vh; width: 80vw;margin-left: 2vw;margin-top: 3vh;}
		.section-1 {height: auto;padding-bottom: 20vh;}
}

@media only screen and (max-width: 1080px) and (orientation: landscape){
	h1{font-size: 16pt;}
	h2{font-size: 14pt;padding-left: 10vw;}
	h3{font-size: 12pt;padding-left: 10vw;}
	
	article {font-size: 12pt;}
	#session2{ height: auto;margin-top: 5vh; background-color:#fff;}
	#session3{ font-size: 12pt; height: 10vh; width: 80vw;margin-left: 2vw;margin-top: 3vh;}
	.section-0 {height: 110vh;}

}

@media only screen and (max-height: 378px) and (orientation: landscape){
	h1{font-size: 14pt;}
	h2{font-size: 14pt;padding-left: 10vw;}
	h3{font-size: 12pt;padding-left: 10vw;}
	.andrea{font-size: 1em;padding-left: 10%;color: #7dac25;}
	.remmert{font-size: 1em;padding-left: 1%;color: #7dac25;font-weight:bolder;}
	.therapie{font-size: 0.9em;padding-left: 40vw;}	
	article {font-size: 12pt;}
	#session2{ height: auto;margin-top: 5vh; background-color:#fff;}
	#session3{ font-size: 12pt; height: 10vh; width: 80vw;margin-left: 2vw;margin-top: 3vh;}
	.section-0 {height: 100vh; }

}


/* ==|== non-semantic helper classes ======================================== */
.ir { display: block; border: 0px none; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0px none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table }
.clearfix:after { clear: both; }
.clearfix { zoom: 1;clear:both; }



/* ==|== print styles ======================================================= */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}