@charset "UTF-8";

@media screen {
body, div, h1, h2, h3, h4, p, ul, li {margin:0; padding:0;}

a {background-color:transparent; cursor:pointer;}
a:active, a:hover {outline:0;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance:button; cursor:pointer;}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0;}
input[type="checkbox"], input[type="radio"] {box-sizing:border-box; padding:0;}
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {height:auto;} 

@import url('https://fonts.googleapis.com/css2?family=Rosarivo&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cantarell:ital,wght@0,400;0,700;1,400&display=swap');

body {
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;
	display:flex;
		-ms-flex-direction:column;
		-webkit-flex-direction:column;
	flex-direction:column;
	overflow-x: hidden;
	box-sizing: border-box;
	font-family: 'Cantarell', sans-serif;
	line-height: 1.3rem;
	font-size:1rem;
	background-color:#555;
	min-width:350px;
	max-width:1000px;
	margin: 0 auto;
}
	
.gesendet {min-height:254px; margin-bottom:100px;}

header {-webkit-order:1;-ms-flex-order:1;order:1;}
nav {-webkit-order:2;-ms-flex-order:2;order:2;}
main {-webkit-order:3;-ms-flex-order:3;order:3;}
footer {-webkit-order:4;-ms-flex-order:4;order:4;}

p {orphans:2; widows:2; margin-bottom:10px; hyphens:auto;}
p:last-child {margin-bottom:0;}

main {
	background-color:rgb(153,0,0);
	color:white;
	z-index:100;
	margin-top:-60px;
	padding-top:20px;
}

main article section {padding:0 40px 0 30px;}

h1 {
	font-family: 'Rosarivo', serif;
	font-size:1.5rem;
	line-height:2rem;
	margin-bottom:30px;
	margin-top:20px;
	padding:50px 40px 0 30px;
}

h1, h2 {
	font-size:1.5rem;
	color:white;
	font-family: 'Rosarivo', serif;
}

.yager section h2, .vita section h2, .hypnose section h2, .kontakt section h2, .termine section h2, .anfahrt section h2, .audio section h2  {margin-bottom:30px; margin-top:30px;}

.termine section h3 {font-weight:bold; font-size:1rem; margin-top:25px; margin-bottom:10px;}
.impressum article h2 {margin-bottom:30px; margin-top:60px; padding:0 40px 0 30px;}
.daten article h2 {margin-bottom:30px; margin-top:60px; padding:0 40px 0 30px;}
.impressum article h3, .daten article h3 {font-weight:bold; font-size:1rem; margin-top:25px; margin-bottom:10px; padding:0 40px 0 30px;}

.vita {background-color: rgb(255,125,0);}
.hypnose {background-color: rgb(212,0,28); padding-top:40px;}
.yager {background-color: rgb(255,72,0);}
.termine {background-color: rgb(255,204,0);}
.kontakt {background-color:#666; padding-top:40px; padding-bottom:20px;}
.audio {padding-top:52px; padding-bottom:20px;}
.anfahrt {background-color:#777; padding-bottom:100px;}
.impressum {background-color:#888; padding-top:60px; padding-bottom:20px;}
.daten {background-color:#999; padding-bottom:100px;}

.file {margin-top:30px;}

.imp {padding:0;}

.yager .schwungtxt, .vita .schwungtxt, .termine .schwungtxt, .hypnose .schwungtxt, .anfahrt .schwungtxt, .daten .schwungtxt {overflow:hidden;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-30px; margin-bottom:0; width:100%; max-width:1000px;}
.anfahrt .schwungtxt img { margin-top:-60px;}

.hypnose section ul {list-style-type:square; margin-bottom:10px;}
.termine section ul {list-style-type:square; margin-bottom:0;}

.hypnose section ul li, .termine section ul li, .daten section ul li {margin-left:15px; break-inside:avoid; margin-top:2px;}
.yager a, .hypnose a, .impressum a, .gesendet a {text-decoration:underline;color:white;}
.yager a:hover, .yager a:focus, .yager a:active,
.hypnose a:hover, .hypnose a:focus, .hypnose a:active,
.impressum a:hover, .impressum a:focus, .impressum a:active,
.gesendet a:hover, .gesendet a:focus, .gesendet a:active {text-decoration:underline; font-weight:bold;}

.termine section section {padding:0;}
.termine {padding-bottom:100px; z-index:300;}

.google {padding-top:20px; padding-bottom:5px;}

.pageheader {
	top: 0;
	width: 100%;
	position:relative;
    z-index:850;
}

.pageheader .schwung {overflow:hidden; padding:0;}

.pageheader .schwung img {
	width:102%;
	margin:-10px auto 0 auto;
	max-width:1000px;
	z-index:800;
	border-top:60px solid white;
}

.pageheader .logo img {
	position:absolute;
	width:100%;
	margin:0 auto;
	top:10px;
	height:45px;
}

.pageheader .deckel {z-index:990;}

.pageheader .deckel2 img {
	position:absolute;
	height:60px;
	width:100%;
	top:5px;
	z-index:999;
}

.navmain .deckel img {display:none;}

.zert {margin: 20px 0 -5px 0;}
.zert p {margin-bottom:1px;}
.zert img {width:80%;}

.abstand {margin-top:60px;}

#kontakt {
	width:100%;
	break-inside:avoid;
	margin-top:15px;
	padding-right:10px;
}

#kontakt fieldset { 
	margin:0;
	padding:0;
	border:0;
}

input[type="text"], input[type="email"], input[type="tel"], select {
	width:100%;
	height:30px;
	margin:3px 0;
	padding:0;
}

#kontakt textarea:focus, input:focus {
	background-color:rgba(255,255,255,0.8);
}

#kontakt textarea {
	width:100%;
	margin:10px 10px 10px 0;
}

.suchen {
	background-color:#666;
	width:25%;
	min-width:115px;	
	height:1.8rem;
	font-size:0.9rem;
	color:white;
	border: 1px solid white;
	margin-top:10px;
}

.suchen:focus, .suchen:hover, .suchen:active {color:rgb(255,204,0); background-color:white;}	
.suchen:active {font-weight:bold;}

.kont {background-color:#666;}
.kont:focus, .kont:hover, .kont:active	{color:#666;}

.vis {display:none;}

footer {z-index:850; margin-top:-30px; position:relative;}
.footschwung {overflow:hidden;}
.footschwung img {width:101%; max-width:1002px; margin:0; position:relative; bottom:-5px; left:-1px; z-index:710;}
.verlauf {overflow:hidden; position:absolute; width:100%; margin:0 auto; z-index:700; opacity:0.3;}
.verlauf img {position:fixed; width:100%; max-width:1000px; margin:0 auto; bottom:-7px; z-index:0;}

#foot {
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;
	display:flex;
		-ms-align-items:center;
		-webkit-align-items:center;
	align-items:center;
		-ms-flex-direction:column;
		-webkit-flex-direction:column;
	flex-direction:column;
	color:white;
	background-color:#555;
	margin-top:-5px;
	padding:0 35px 0 30px;
}

#foot ul {
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;
	display:flex;
		-ms-justify-content:space-between;
		-webkit-justify-content:space-between;
	justify-content:space-between;
	list-style-type:none;
	z-index:800;
	background-color:#555;
	border-bottom:8px solid #555;
	width:100%;
	margin:0 0 0 10px;
	padding:0 35px 0 30px;
	color:white;
}

#foot ul li {color:white;}

footer a {text-decoration:none; color:white;}
footer a:hover, footer a:focus, footer a:active {text-decoration:underline;}

.menudeckel img, .menudeckel2 img {
	position:absolute;
	width:41%;
	height:60px;
	z-index:970;
	bottom:0;
	background-color:transparent;
}

.menudeckel img {left:0;}
.menudeckel2 img {right:0;}

.navmain {
	width: 100%;
	margin:0 auto;
	position:fixed;
	bottom:50px;
	z-index:899;
}

.navmain .menubutton .showmenu img {
	position:absolute;
	width:100%;
	margin:0 auto;
	height:60px;
	z-index:960;
	bottom:0;
}

.navmain .menubutton .hidemenu img {
	position:absolute;
	width:100%;
	margin:0 auto;
	height:60px;
	z-index:950;
	bottom:0;
}

.navmain .navi {
	overflow:hidden; 
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	margin:0;
	z-index:900;
}

.cd-accordion-menu {
	position:fixed;
	bottom:0;
	width:100%;
	margin:0 auto;
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;
	display:flex;
		-ms-flex-direction:column;
		-webkit-flex-direction:column;
	flex-direction:column;
	list-style-type:none;
	max-height:0;
	transition:0.25s;
	z-index:810;
}

#menu:target .cd-accordion-menu {max-height:200rem; border-bottom:120px solid #555;}
#menu:target a.showmenu {display:none;}
#menu:target a.hidemenu {display:block;}

.cd-accordion-menu li {
  		-webkit-user-select: none;
  		-moz-user-select: none;
  		-ms-user-select: none;
  	user-select: none;
  	background:#555;
	width:100%;
	text-align:center;
}

.cd-accordion-menu li:first-child {
	background-color:transparent;
	max-width:1000px;
	width:100%;
	margin:0 auto;
}

.cd-accordion-menu a {
  position: relative;
    display: block;
	color:white;
  text-decoration:none;
  padding: 15px 15px 15px 15px;
}

.f img {width:100%; margin-bottom:-10px;}

.cd-accordion-menu .z a:hover {background:#900;}
.cd-accordion-menu .a a:hover {background:rgb(212,0,28);}
.cd-accordion-menu .g a:hover {background:rgb(255,72,0);}
.cd-accordion-menu .b a:hover {background:rgb(255,125,0);}
.cd-accordion-menu .c a:hover {background:rgb(255,204,0);}
.cd-accordion-menu .d a:hover {background:#777;}
.cd-accordion-menu .e a:hover {background:#888;}

.rubinbox a:hover, .rubinbox a:focus {color:rgb(130,5,5);}

a[href^="tel:"] {text-decoration:none; color:white;}
a[href^="tel:"]:hover {text-decoration:underline; font-weight:bold;}

}

@media screen and (min-width:354px) {.menudeckel img, .menudeckel2 img {width:42%;} .gesendet {min-height:300px;}}
@media screen and (min-width:400px) {.menudeckel img, .menudeckel2 img {width:43%;} .gesendet {min-height:360px;}}
@media screen and (min-width:460px) {.menudeckel img, .menudeckel2 img {width:44%;} .gesendet {min-height:371px;}}
@media screen and (min-width:544px) {.menudeckel img, .menudeckel2 img {width:45%;}}


@media screen and (min-width:471px) {
h1 {padding:60px 50px 0 40px;}
main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding:0 50px 0 40px;}
#foot ul {padding:0 50px 0 45px; margin:0 0 0 5px;}
.zert img {width:70%;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-80px;}
.gesendet {min-height:541px;}
}

@media screen and (min-width:711px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding:0 50px 0 40px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-100px;}

h1 {padding-top:60px;}

.vis {display:inline-block;}
.pageheader .deckel2 img, .menudeckel img, .menudeckel2 img, .f, .z, .d, .e, .menubutton, .verlauf {display:none;}

.navmain .deckel img {
	display:block;
	position:absolute;
	top:5px;
	z-index:999;
	width:293px; 
	height:50px; 
	left:36px;
}

#foot ul {
	margin:0 0 0 5px;
		-ms-justify-content:center;
		-webkit-justify-content:center;
	justify-content:center;
	padding:0;
}

.pageheader .logo img {margin:0 0 0 0; left:40px; width:auto;}

.navmain {position:fixed; top:0; width:100%; height:60px;}
.navmain .navi {position:relative; height:50px;}

.cd-accordion-menu {
	position:absolute;
	max-width:1000px;
	height:20px;	
		-ms-flex-direction:row;
		-webkit-flex-direction:row;
	flex-direction:row;
	top:0;
	margin-top:11px;
		-ms-justify-content:flex-end;
		-webkit-justify-content:flex-end;
	justify-content:flex-end;
}

.cd-accordion-menu li {background-color:transparent; text-align:right; width:80px;}
.cd-accordion-menu .a {width:100px; margin-right:5px;}
.cd-accordion-menu .b, .cd-accordion-menu .g {width:68px;}
.cd-accordion-menu .c {margin-right:35px;}
.cd-accordion-menu a {color:#555;}
.cd-accordion-menu .a a:hover {background-color:transparent; color:rgb(212,0,28);}
.cd-accordion-menu .g a:hover {background-color:transparent; color:rgb(255,72,0);}
.cd-accordion-menu .b a:hover {background-color:transparent; color:rgb(255,125,0);}
.cd-accordion-menu .c a:hover {background-color:transparent; color:rgb(255,204,0);}

.pageheader {position:fixed;}

.pageheader .schwung img {border-top:50px solid white;}

main {padding-top:120px; margin-top:-80px;}
.impressum {padding-top:80px;}

footer {margin-top:-50px;}

.vita section h2, .termine section h2, .impressum article h2, .daten article h2, .anfahrt section h2 {margin-top:50px;}
.hypnose section h2 {margin-top:120px;}
.kontakt section h2 {margin-top:40px;}
.hypnose {margin-top:-78px;}

.zert {
	margin: 40px 0 -5px 0;
		display:-webkit-box;
  		display:-ms-flexbox;
  		display:-webkit-flex;
	display:flex;
		-webkit-flex-flow:row wrap;
	flex-flow:row wrap;	
}

.zert div {	-webkit-flex:1; flex:1;}
.zert img {width:250px; padding:0 10px 10px 0;}
.zert div:last-child {padding-top:5px;}
.gesendet {min-height:620px;}
}

@media screen and (min-width:720px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:60px; padding-left:50px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-120px;}
.zert img {width:270px;}
.gesendet {min-height:640px;}
}

@media screen and (min-width:740px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:70px; padding-left:60px;}
.gesendet {min-height:660px;}
}

@media screen and (min-width:760px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:80px; padding-left:70px;}
.gesendet {min-height:680px;}
}

@media screen and (min-width:780px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:90px; padding-left:80px;}
.gesendet {min-height:700px;}
}

@media screen and (min-width:800px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:100px; padding-left:90px;}
.pageheader .schwung img {border-top:45px solid white;}
.gesendet {min-height:720px;}
}

@media screen and (min-width:820px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:110px; padding-left:100px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-130px;}
.gesendet {min-height:740px;}
}

@media screen and (min-width:840px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:120px; padding-left:110px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-140px;}
.gesendet {min-height:760px;}
}

@media screen and (min-width:860px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:130px; padding-left:120px;}
.gesendet {min-height:780px;}
}

@media screen and (min-width:880px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:140px; padding-left:130px;}
.gesendet {min-height:800px;}
}

@media screen and (min-width:900px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:150px; padding-left:140px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-150px;}
.gesendet {min-height:820px;}
}

@media screen and (min-width:920px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:160px; padding-left:150px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-150px;}
.gesendet {min-height:840px;}
}

@media screen and (min-width:940px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:170px; padding-left:160px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-150px;}
.gesendet {min-height:860px;}
}

@media screen and (min-width:960px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:180px; padding-left:170px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-150px;}
.gesendet {min-height:880px;}
}

@media screen and (min-width:980px) {
h1, main article section, #foot, .impressum article h2, .impressum article h3, .daten article h2, .daten article h3 {padding-right:190px; padding-left:180px;}
.yager .schwungtxt img, .vita .schwungtxt img, .hypnose .schwungtxt img, .termine .schwungtxt img, .anfahrt .schwungtxt img, .daten .schwungtxt img { margin-top:-160px;}
.gesendet {min-height:900px;}
}

