@font-face{font-family:Parisienne;font-style:normal;font-weight:400;src:url(../fonts/parisienne-v7-latin-regular.eot);src:local('Parisienne'),local('Parisienne-Regular'),url(../fonts/parisienne-v7-latin-regular.eot?#iefix) format('embedded-opentype'),url(../fonts/parisienne-v7-latin-regular.woff2) format('woff2'),url(../fonts/parisienne-v7-latin-regular.woff) format('woff'),url(../fonts/parisienne-v7-latin-regular.ttf) format('truetype'),url(../fonts/parisienne-v7-latin-regular.svg#Parisienne) format('svg');font-display:swap}@font-face{font-family:'Open Sans';font-style:normal;font-weight:300;src:url(../fonts/open-sans-v17-latin-300.eot);src:local('Open Sans Light'),local('OpenSans-Light'),url(../fonts/open-sans-v17-latin-300.eot?#iefix) format('embedded-opentype'),url(../fonts/open-sans-v17-latin-300.woff2) format('woff2'),url(../fonts/open-sans-v17-latin-300.woff) format('woff'),url(../fonts/open-sans-v17-latin-300.ttf) format('truetype'),url(../fonts/open-sans-v17-latin-300.svg#OpenSans) format('svg');font-display:swap}@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;src:url(../fonts/open-sans-v17-latin-regular.eot);src:local('Open Sans Regular'),local('OpenSans-Regular'),url(../fonts/open-sans-v17-latin-regular.eot?#iefix) format('embedded-opentype'),url(../fonts/open-sans-v17-latin-regular.woff2) format('woff2'),url(../fonts/open-sans-v17-latin-regular.woff) format('woff'),url(../fonts/open-sans-v17-latin-regular.ttf) format('truetype'),url(../fonts/open-sans-v17-latin-regular.svg#OpenSans) format('svg');font-display:swap}@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;src:url(../fonts/open-sans-v17-latin-700.eot);src:local('Open Sans Bold'),local('OpenSans-Bold'),url(../fonts/open-sans-v17-latin-700.eot?#iefix) format('embedded-opentype'),url(../fonts/open-sans-v17-latin-700.woff2) format('woff2'),url(../fonts/open-sans-v17-latin-700.woff) format('woff'),url(../fonts/open-sans-v17-latin-700.ttf) format('truetype'),url(../fonts/open-sans-v17-latin-700.svg#OpenSans) format('svg');font-display:swap}

.clear{clear:both}
body{font:normal 400 16px/1.61 'Open Sans',arial,sans-serif}

/* === Typo === */
h1, h2 {font-family: 'Parisienne', cursive; color: #fe893f;font-size: 40px;margin: 0 0 30px 0;}
.slogan {font-family: 'Parisienne', cursive; color: #fff;font-size: 50px;text-shadow:2px 2px 15px #000;z-index: 1; position: absolute; left: 10%; bottom: 35%;width: 80%;}
h3 {font-family: 'Open Sans', sans-serif; color: #fe893f; font-size: 22px; margin: 0 0 20px 0;}
p {max-width: 600px; width: 100%;}
.firmierung {font-family: 'Open Sans', sans-serif; color: #edb748;}
.beate-mazur {font-family: 'Parisienne', cursive; color: #2b2b2b;font-size: 50px;line-height: 1.2;}
a, .hyperlink {color: #fe893f; text-decoration: underline;}
a:hover, .hyperlink:hover {text-decoration: none;}
ul, ol {margin:0 0 40px 30px;}
li {list-style: disc;}
ol li {list-style: decimal;}
button {font:normal 400 16px/1.61 'Open Sans',arial,sans-serif}
b {font-weight: 700;}
.small-text {font-size: 12px;}

/* === Header === */
header {min-height: 100vh;background: url(../images/hilfe-aus-dem-unterbewussten.jpg) top center/cover no-repeat ; background-attachment: fixed;}
.main-nav {width: 100%;text-align: right;display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; align-content: center;}
.main-nav a, .dropbtn {color: #2b2b2b; text-decoration: none; padding: 5px 15px;margin: 2px;}
.main-nav a:hover { color: #fff;background: #fe893f;}
.dropdown{position:relative;display:inline-block}
.dropdown-content{display:none;position:absolute;background-color:#fff;min-width:160px;box-shadow:0 8px 16px 0 rgba(0,0,0,.2);z-index:1}
.dropdown-content a{color: #2b2b2b;padding:12px 16px;text-decoration:none;display:block}
.dropdown-content a:hover{background-color:#fe893f}
.dropdown:hover .dropdown-content{display:block}
.dropdown:hover .dropbtn{background-color:#fe893f; color: #fff;}
.header-wrapper {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: center; padding: 20px 5%; align-items: center;background: #fff;display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-content: center;height: 150px;position: fixed;width: 90%; z-index: 1000;}
.header-wrapper-scrolled {height: 50px;transition: 1s;}
.logo-firmierung-wrapper {display: flex; flex-direction: row; align-items: center;}
.logo {margin: 0 20px 0 0; width: 111px;}
.logo-scrolled {width: 70px; transition: 1s;}
.beate-mazur-scrolled {font-size: 34px;}
.burger{position: fixed; right: 20px; top: 47px; display: none;cursor: pointer;}
.burger-line{width:35px;height:5px;background-color:black;margin:6px 6px}
.sidenav{height:100%;width:0;position:fixed;z-index:1;top:0;right:0;background-color:#ffcf6d;overflow-x: scroll;padding-top:0;transition:0.5s}
.sidenav a{padding: 10px 2%;text-decoration:none;font-size: 18px;color:#2b2b2b;display:block;text-align: center;}
.sidenav a:hover{background: #fff;}
.sidenav.closebtn{position:absolute;top:0;right:25px;font-size:36px;margin-left:50px}
#main{transition:margin-left.5s;padding:20px}
@media screen and (max-height:450px){.sidenav{padding-top:15px}.sidenav a{font-size:18px}}
.back-to-index {text-decoration: none; cursor: pointer;}


.eyecatcher-info {
  position: absolute;
  top: 71vh;
  right: 0;
  z-index: 200;
  background: #fe893f;
  padding: 10px 20px;
  color: #fff;
  text-decoration: none;
  font-size: 16px;
  border-radius: 30px 0 0 30px;
}

.eyecatcher-info a {
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}

.eyecatcher-info p {
  color: #fff;
}


/* === Icon Navigation === */
.icon-nav {display: flex; flex-direction: row; flex-wrap: wrap;}
.nav-box {width: 18%; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; padding: 50px 2%;flex-grow: 1;background: #f7f7f7;}
.nav-box:hover {background: #fef3db; transition: .6s;}
.nav-box p {text-align: center; margin:40px 20px; color: #686868;}
.nav-box:hover p {color: #2b2b2b; transition: .6s;}
.nav-box p span {font-family: 'Parisienne', cursive; font-size: 30px;}
.nav-box a {background: #c4c4c4; color: #fff; padding: 5px 15px;cursor: pointer;text-decoration: none;}
.nav-box:hover a {background: #fe893f; color: #fff; padding: 5px 15px; transition: .6s}
.nav-box-icon {filter: grayscale(100%); min-height: 214px;}
.nav-box:hover .nav-box-icon {filter:none; transition: .6s}
.reiki-icon {max-width: 132px;width: 100%;}
.eyecon {max-width: 233px;width: 100%;}
.tightrope-icon {max-width: 214px;width: 100%;}
.photo-icon {max-width: 143px;width: 100%;}

/* === Über Mich === */
#ueber-mich {display: flex; flex-direction: row; flex-wrap: wrap;}
.um-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5% ;}
.ueber-mich-image {background: url(../images/heilpraktikerin-beate-mazur.jpg) right top/cover no-repeat;}
.ueber-mich-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}
.ueber-mich-modal-buttons { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-content: center; }


/* === Praxis === */
#praxis {display: flex; flex-direction: row; flex-wrap: wrap;}
.praxis-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5% ;}
.praxis-image {background: url(../images/praxis.jpg) right top/cover no-repeat;}
.praxis-content {background: url(../images/mandala-right.png) right top/40% no-repeat;}


/*NEWSFEED*/






/* === Modal boxen === */
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:1;padding:20px;box-sizing:border-box;background-color:#000;background-color:rgba(0,0,0,0.75);text-align:center; z-index: 1009;}
.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-0.05em}
.blocker.behind{background-color:transparent}
.modal{display:none;vertical-align:middle;position:relative;z-index:2;max-width:800px;box-sizing:border-box;width:90%;background:#fff;padding:30px 20px;-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:8px;-webkit-box-shadow:0 0 10px #000;-moz-box-shadow:0 0 10px #000;-o-box-shadow:0 0 10px #000;-ms-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;text-align:left; z-index: 1010 !important;}
.modal a.close-modal{position:absolute;top:5px;right:15px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-repeat:no-repeat;background-position:center center;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==')}
.fenster-schließen {background-color: #2b2b2b; color: #fff; text-decoration: none; margin: 20px 0; padding: 10px; border-radius: 30px;}
.fenster-schließen-wrapper {height: 50px;}
.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}
.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}
.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.modal-spinner .rect3{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}
.modal-spinner .rect4{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}@-webkit-keyframes sk-stretchdelay{0%,40%,100%{-webkit-transform:scaleY(0.5)}20%{-webkit-transform:scaleY(1.0)}}@keyframes sk-stretchdelay{0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}}
.modal-button {background: #fe893f; color: #fff; padding: 5px 15px;cursor: pointer;text-decoration: none;margin: 5px 10px;}
.modal-button:hover {background: #edb748; color: #fff; }
.modal-button:active, .modal-button:focus {background: #ffcf6d; color: #fff; }

blockquote{border-radius:3px;position:relative;font-style:italic;padding:1rem 1.2rem;width:80%;color:#4a4a4a;margin:1rem auto 2rem;color:#4a4a4a;background:#e8e8e8}
blockquote:after,blockquote:before{font-family:FontAwesome;position:absolute;top:13px;color:#e8e8e8;font-size:34px}
blockquote:before{content:"\f10d";margin-right:13px;right:100%}
blockquote:after{content:"\f10e";margin-left:13px;left:100%;top:auto;bottom:13px}

/* === Reikibehandlung === */
#reikibehandlung {display: flex; flex-direction: row; flex-wrap: wrap;}
.reikibehandlung-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5%; background: #fef3db;}
.reiki-images {display: flex; flex-direction: column; padding: 0; width: 40%;}
.reiki-images div {height: 40%; align-content: stretch; flex-grow: 1;}
.reikibehandlung-image1 {background: url(../images/reiki-zentrum-logo.svg) center/contain no-repeat;}
.reikibehandlung-image2 {background: url(../images/reiki-behandlung.jpg) center/cover no-repeat;}
.reikibehandlung-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}

/* === Hypnosetherapie === */
#hypnosetherapie {display: flex; flex-direction: row; flex-wrap: wrap;}
.hypnosetherapie-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5% ;}
.hypnosetherapie-image {background: #fef3db; display: flex;justify-content: center; align-content: center;}
.hypno-img {max-width: 708px; width: 100%;}
.hypnosetherapie-content {background: url(../images/mandala-right.png) right top/40% no-repeat;}
.tab{overflow:hidden;border: 2px solid #fe893f;display: flex;justify-content: space-evenly;flex-direction: row;flex-wrap: wrap;min-height: 56px;}
.tab button{background-color:inherit;float:left;border:none;outline:0;cursor:pointer;padding:14px 16px;}
.tab button:hover, .tab button.active {color: #fe893f;}
.tab button:hover:before, .tab button:hover:after {content: url(../images/blume.png);}
.tab button.active:after, .tab button.active:before {content: url(../images/blume.png);}
.tabcontent{display:none;padding: 6px 12px;margin: 10px 0 0 0;border: 2px solid #fe893f;}

/* === Time Weaver === */
#time-waver {display: flex; flex-direction: row; flex-wrap: wrap;}
.tw-box {width: 30%;flex-grow: 1; min-height: 500px;padding: 100px 5%;}
.time-waver-image {background: url(../images/time-waver-atmende-frau.jpg) right center/cover no-repeat;}
.time-waver-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}

/* === Lichtfeldspektralanalyse === */
#lichtfeldspektralanalyse {display: flex; flex-direction: row; flex-wrap: wrap;}
.lichtfeldspektralanalyse-box {width: 30%;flex-grow: 1; min-height: 500px;padding: 100px 5%;}
.lichtfeldspektralanalyse-image {background: url(../images/mandala.jpg) center/cover no-repeat; display: flex; justify-content: center; align-content: center; align-items: center;}
.lichtfeldspektralanalyse-content {background: url(../images/mandala-right.png) right top/40% no-repeat;}
.licht-foto {box-shadow: 10px 10px 28px #333;width: 80%;}

/* === Veranstaltungen === */
#veranstaltungen {display: flex; flex-direction: row; flex-wrap: wrap;}
.veranstaltungen-box {width: 30%;flex-grow: 1; min-height: 500px;padding: 100px 5%;}
.veranstaltungen-box a {color: #2b2b2b;}
.veranstaltungen-image {background: url(../images/veranstaltungen-stuehle.jpg) center/cover no-repeat;}
.veranstaltungen-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}

/* === Termine === */
#termine {display: flex; flex-direction: row; flex-wrap: wrap;}
.termine-box {width: 30%;flex-grow: 1; min-height: 500px;padding: 100px 5%;}
.termine-image {background: url(../images/wald.jpg) center/cover no-repeat; display: flex; justify-content: center; align-content: center; align-items: center;}
.termine-content {background: url(../images/mandala-right.png) right top/40% no-repeat;}
.box-termin {border: 2px solid #fe893f; padding: 15px 10px; margin: 20px 0;}


/* === Ausbildungen === */
#ausbildungen-hypnosetherapie {display: flex; flex-direction: row; flex-wrap: wrap;}
.ausbildungen-hypnosetherapie-box {width: 30%;flex-grow: 1; min-height: 500px;padding: 100px 5%;}
.ausbildungen-hypnosetherapie-box a {color: #2b2b2b;}
.ausbildungen-hypnosetherapie-image {background: url(../images/hypnosetherapie-anwendung.jpg) center/cover no-repeat;}
.ausbildungen-hypnosetherapie-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}


/* === Kontakt === */
#kontakt {display: flex; flex-direction: row; flex-wrap: wrap;}
.kontakt-box {width: 30%; flex-grow: 1; min-height: 500px; padding: 100px 5%;}
.kontakt-box a {color: #fe893f;}
.kontakt-content {background: url(../images/mandala-right.png) right top/40% no-repeat; padding-right: 10%;}
.kontakt-image {padding: 0; width: 40%;}

/* Optional: Besserer Textabstand im Kontakt */
.kontakt-content h2,
.kontakt-content p {
    max-width: 80%;
    margin-right: 5%;
}




.daten-impress-nav {background: #fe893f; padding: 5px 15px;position: fixed;left: 5%; bottom: 0; z-index: 1200;color: #fff;}
.daten-impress-nav a {color: #fff; text-decoration: none;}

/* === Impressum === */
#impressum {display: flex; flex-direction: row; flex-wrap: wrap; border-bottom: 3px solid #fe893f;}
.impressum-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5%;}
.impressum-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}
.impressum-content h2 { font: normal 400 18px/1.61 'Open Sans',arial,sans-serif; margin: 50px 0 20px 0;}

/* === landingpage-box1 === */
#landingpage-box1 {display: flex; flex-direction: row; flex-wrap: wrap;}
.landingpage-box1-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5% ;}
.landingpage-box1-image {background: url(../images/hypnosetherapie-anwendung.jpg) center top/cover no-repeat;}
.landingpage-box1-content {background: url(../images/mandala-left.png) left top/40% no-repeat;}
.landingpage-box1-content h2 { font: normal 400 22px/1.61 'Open Sans',arial,sans-serif; margin: 50px 0 20px 0;}



/* === landingpage-box2 === */
#landingpage-box2 {display: flex; flex-direction: row; flex-wrap: wrap;}
.landingpage-box2-box {width: 30%;flex-grow: 1; min-height: 500px; padding: 100px 5% ;}
.landingpage-box2-image {background: url(../images/hypnose-illustration.svg) center/70% no-repeat, #fef3db}
.landingpage-box2-content {background: url(../images/mandala-right.png) right top/40% no-repeat;}
.landingpage-box2-content h2 { font: normal 400 22px/1.61 'Open Sans',arial,sans-serif; margin: 50px 0 20px 0;}

.hypnose-frankfurt-img1 {background: url(../images/hypnose-frankfurt.jpg) center top/cover no-repeat;}
.hypnose-frankfurt-img2 {background: url(../images/frankfurt.jpg) center right/cover no-repeat; }

.landing-links {width: 96%; padding: 20px 2%; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: center; background: #fef3db; color: #fe893f; align-items: center;}
.landing-links a { margin: 10px;}

.direktanruf {position: fixed; top: 220px; right: 0; z-index: 200;}
.direktanruf-scrolled {top: 120px;transition: 1s;}

/* === EDMR Button === */
.edmr-button {position: absolute; top: 300px;right: 0; z-index: 200; background: #fe893f; padding: 10px 20px; color: #fff; text-decoration: none;font-size: 30px; border-radius: 30px 0 0 30px;}
.edmr-button:hover {font-size: 38px; transition: .5s;}



/*---------------------------------------
MEDIA Queries | Tablet | Phone
---------------------------------------*/
@media screen and (max-width: 1500px) {
 .main-nav {max-width: 500px;}
}

@media screen and (max-width: 1200px) {
 .main-nav {max-width: 440px;justify-content: flex-start;}
 .nav-box {justify-content: flex-start;}
 .ueber-mich-image {background: url(../images/heilpraktikerin-beate-mazur.jpg) right 28% top/cover no-repeat;}
 .landingpage-box1-image {background: url(../images/heilpraktikerin-beate-mazur.jpg) right 28% top/cover no-repeat;}
 header {background: url(../images/hilfe-aus-dem-unterbewussten.jpg) top right 10%/cover no-repeat;}
 .praxis-image {background: url(../images/praxis.jpg) left 47% top/cover no-repeat;}
 .landingpage-box2-image {background: url(../images/praxis.jpg) left 47% top/cover no-repeat;}
 .time-waver-image {background: url(../images/time-waver-atmende-frau.jpg) right 22% center/cover no-repeat;}
 .nav-box p span {hyphens: auto;}
 .um-box, .landingpage-box1-box, .praxis-box, .landingpage-box2, .reikibehandlung-content, .hypnosetherapie-box, .tw-box, .lichtfeldspektralanalyse-box, .veranstaltungen-box, .ausbildungen-box, .termine-box, .kontakt-content {padding: 50px 2%;}
 .kontakt-image, .reiki-images {width: 34%;}
 .nav-box p {min-height: 210px;}

}

@media screen and (max-width: 900px) {
 .beate-mazur {font-size: 35px;}
 .burger {display: block;}
 .burger-scrolled {top: 29px; transition: 1s;}
 .main-nav {display: none;}
 .header-wrapper {padding: 20px 2%; width: 96%;height: 100px;}
 .header-wrapper-scrolled {height: 50px;}
 header {background: url(../images/hilfe-aus-dem-unterbewussten.jpg) top right -300px/cover no-repeat;}
 .nav-box {width: 40%;background: #fef3db; border: .5px solid #fff;}
 .nav-box p {text-align: center; margin:40px 20px; color: #2b2b2b;min-height: 126px;}
 .nav-box p span {font-family: 'Parisienne', cursive; font-size: 30px;}
 .nav-box a {background: #fe893f; color: #fff; padding: 5px 15px;cursor: pointer;text-decoration: none;}
 .nav-box-icon {filter: none; min-height: 214px;}
 .um-box, .landingpage-box1-box, .praxis-box, .hypnosetherapie-box, .tw-box, .lichtfeldspektralanalyse-box, .veranstaltungen-box, .ausbildungen-box, .termine-box, .kontakt-box, .reikibehandlung-box {width: 96%; padding:100px  2% 50px 2%;}
 .impressum-box {width: 96%; padding: 150px 2% 100px 2%;}
 .reiki-images, .kontakt-image {height: 100vh;width: 96%;}
 #ueber-mich, #landingpage-box1, #impressum, #reikibehandlung, #hypnosetherapie, #time-waver, #veranstaltungen, #ausbildungen, #kontakt {flex-direction: column;}
 #praxis, #landingpage-box2, #hypnosetherapie, #termine, #lichtfeldspektralanalyse { flex-direction: column-reverse;}
 p {max-width: 600px; width: 100%;}
 .kontakt-content, .termine-content, .veranstaltungen-content, .ausbildungen-content, .lichtfeldspektralanalyse-content, .praxis-content, .landingpage-box2-content, .ueber-mich-content, .time-waver-content, .hypnosetherapie-content {min-height: unset;}
}

@media screen and (max-width: 768px) {
 .nav-box p span {font-size: 24px;}
 .nav-box p, .nav-box a {font-size: 14px;margin: 20px 2%;}
 .nav-box p{min-height: 130px;}
 .nav-box-icon {min-height: 163px;}
 .tab {justify-content: flex-start;}
 .reiki-icon {max-width: 100px;}
 .eyecon {max-width: 177px;}
 .tightrope-icon {max-width: 163px;}
 .photo-icon {max-width: 109px}
 .icon-nav {min-height: 70vh; }

 .eyecatcher-info {
   max-width: 90%;
   padding: 10px 20px;
   font-size: 14px;
   border-radius: 30px 0 0 30px;
 }
}

@media screen and (max-width: 480px) {
 header {min-height: 100vh;background: url(../images/hilfe-aus-dem-unterbewussten-mobil.jpg) top center/cover no-repeat ;}
 p, a, li {font-size: 14px;}
 h1, h2 {font-size: 30px;}
 h3 {font-size: 18px;}
 .icon-nav {flex-direction: column;}
 .nav-box {border:none ;border-bottom: 2px solid #fff; width: 96%;padding: 10px 2%;}
 .nav-box p {min-height: unset;}
 .modal {width: 96%; height: 85vh; overflow-x: scroll;}
 .beate-mazur {font-size: 29px;}
 .logo {width: 70px;-webkit-width: 70px;}
 .slogan {bottom: 10%; font-size: 40px;}
}

@media screen and (max-width: 320px) {
 .header-wrapper-scrolled {height: 10px;}
 .logo {width: 40px;}
 .burger-scrolled {top: 5px;right: 5px;}
 .firmierung {color: #2b2b2b; font-size: 12px;}
 .beate-mazur-scrolled {font-size: 20px;}
 header {background: url(../images/hilfe-aus-dem-unterbewussten-mobil.jpg) top right/cover no-repeat;}
 .hypnosetherapie-image {min-height: unset;}
 .direktanruf-scrolled {top: 60px;}

}