/* CSS Document */
@charset "utf-8";
@font-face {font-family:'Alice'; src:url('../fonts/Alice-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Italic.ttf') format('truetype'); font-weight:400; font-style:italic; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Bold.ttf') format('truetype'); font-weight:600; font-style:normal; font-display:swap;}

html {scroll-behavior:smooth;}
html, body {margin:0;padding:0; height:100%; font-size:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
html, body, button, input, select, textarea {font-family:'Roboto', 'Arial', sans-serif; font-size:14px; line-height:20px; font-weight:400; color:#467;}
body {padding-top:120px;}

audio, canvas, video {display:block; *zoom:1;}
audio:not([controls]){display:none}
[hidden]{display:none}

article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,main,summary{display:block;}
div, img {position:relative; display:block; box-sizing:border-box;}
*, *::before, *::after {box-sizing:border-box;}

a {color:#0be; text-decoration:none;}
a:focus{color:inherit; outline:none}
a:hover,a:active{color:inherit; outline:0}

p {padding:0; margin:0 0 24px;}
li {margin-bottom:12px;}

hr {widt:100%; height:1px; border:0 none; margin-bottom:48px; border-bottom:1px solid #cef; clear:both;}
strong {font-weight:600;}
.heil {color:#0be;}

table {padding:0; margin:0 0 32px; border-collapse:collapse;}
td {padding:8px 8px 8px 0; margin:0; vertical-align:top; border-bottom:1px dotted #0be; text-align:left;}
td.tag {width:100px; font-weight:600;}

h1, h2, h3, h4 {font-family:'Alice', 'Times', 'Times New Roman', serif; font-weight:400; display:block; box-sizing:border-box;}
h1 {padding:80px 100px 100px; margin:0; font-size:48px; line-height:56px; color:#fff;}
h2 {padding:120px 100px 200px; margin:0; font-size:48px; line-height:56px; color:#fff;}
h3 {padding:0; margin:24px 0; font-size:20px; line-height:24px; color:#0be;}
h4 {padding:24px 0; margin:40px 0 40px; font-size:20px; line-height:24px; text-align:center;  color:#0be;
border-top:1px solid #cef; border-bottom:1px solid #cef;}
h5 {padding:0; margin:0; font-size:18px; line-height:26px; font-weight:600;}
h6 {padding:0; margin:0; font-size:14px; line-height:22px; font-weight:600;}
.minitext {font-size:32px; line-height:40px; padding:20px 0 0; display:block;}

#datenschutz h1, h2, h3, h4 {color:#0be;}

.header {position:fixed; top:0px; width:100%; height:120px; margin:0; padding:0; text-align:center; font-size:16px; line-height:28px;
background:#fff; box-shadow:0 0 15px rgba(0,0,0,0.08); z-index:100;}

.topinfo {position:fixed; top:0; right:6%; width:auto; height:40px; margin:0; padding:6px 0 0 28px; z-index:801; background:#0be; color:#fff;}
.topinfo a {color:#fff; opacity:0.85;}
.topinfo a:hover {opacity:1;}
.termin, .phone {position:relative; padding:0 38px; margin:0; display:block; box-sizing:border-box; float:left;}
.termin {background:url(../images/icons/termin.svg) top left no-repeat;}
.phone {background:url(../images/icons/phone.svg) top left no-repeat;}

.headercontent {position:relative; width:100%; max-width:1200px; padding:0; margin:0 auto;}

.logo {position:absolute; top:30px; left:4%; width:260px; padding:0; margin:0; display:block; text-align:left;
font-family:'Alice', 'Times', 'Times New Roman', serif; font-weight:400; font-size:24px; line-height:30px; color:#0be;}

.navi {position:relative; margin:0 auto; padding:60px 0 0; text-align:center; float:right;
font-family:'Alice', 'Times', 'Times New Roman', serif; font-weight:400; font-size:14px; line-height:20px; text-transform:uppercase;}
.navi ul {position:relative; margin:0 auto; padding:0; display:block;}
.navi ul li {position:relative; display:inline-block; margin:0 10px; padding:0; list-style-type:none; text-align:left;}
.navi ul li a {padding:10px; margin:0; height:40px; color:#467; transition:color 0.2s; text-decoration:none; display:block; box-sizing:border-box;}
.navi ul li:hover a, .navi ul li.active a, .navi ul li:hover ul li a:hover {color:#0be; transition:color 0.2s;}

input[type="checkbox"].opennavi:checked ~ .navi {transform:translateX(0);}
input[type=checkbox].opennavi {transition:all 0.3s; box-sizing:border-box; display:none;}
.sidebarIconToggle {position:absolute; top:64px; right:40px; width:22px; height:22px; box-sizing:border-box; cursor:pointer; display:none; z-index:999; transition:all 0.3s;}
.spinner {position:absolute; width:100%; height:3px; background:#007788; box-sizing:border-box; transition:all 0.3s;}
.horizontal {position:relative; float:left; margin-top:3px; box-sizing:border-box; transition:all 0.3s;}
.diagonal.part-1 {position:relative; float:left; box-sizing:border-box; transition:all 0.3s;}
.diagonal.part-2 {position:relative; float:left; box-sizing:border-box; transition:all 0.3s; margin-top:3px;}
input[type=checkbox].opennavi:checked ~ .sidebarIconToggle > .horizontal {box-sizing:border-box; transition:all 0.3s; opacity:0;}
input[type=checkbox].opennavi:checked ~ .sidebarIconToggle > .diagonal.part-1 {box-sizing:border-box; transition: all 0.3s; margin-top:8px; transform: rotate(135deg);}
input[type=checkbox].opennavi:checked ~ .sidebarIconToggle > .diagonal.part-2 {box-sizing:border-box; transition:all 0.3s; margin-top:-9px; transform: rotate(-135deg);}

.main {position:relative; width:92%; max-width:1000px; padding:40px 0; margin:0 auto;}

.halb {position:relative; width:47%; padding:0; margin:0 6% 0 0; float:left; display:inline-block;}
.doppel {position:relative; width:65%; padding:0; margin:0 5% 0 0; float:left; display:inline-block;}
.drittel {position:relative; width:30%; padding:0; margin:0 5% 0 0; float:left; display:inline-block;}
.drittellater {position:relative; width:30%; padding:0; margin:0 5% 0 0; float:left; display:inline-block;}
.last {margin-right:0;}
.clear {clear:both;}
.space {height:30px; clear:both;}

.left {float:left; display:block;}
.right {float:right; display:block;}
.center {text-align:center;}

.footer {width:100%; padding:40px 0; margin:0 auto; background:#fef; color:#aac; text-align:center;}
.footer p {margin:0 auto;}
.footer a {color:#aac; text-decoration:none; margin:0 10px;}

.totop {position:fixed; bottom:10px; right:10px; width:3px; height:3px; padding:12px 19px 22px 16px; margin:0; 
text-align:center; border-radius:50%; border:3px solid #aac; background:rgba(255,255,255,1); z-index:100; opacity:0.3; 
 filter: alpha(opacity=30);}
.totop:hover {opacity:0.6;
 filter: alpha(opacity=60);}
.totop i:before, .totop i:after {content:""; position:absolute; background-color:#aac; width:3px; height:9px;}
.totop i:before {
 -ms-transform: translate(-2px, 0) rotate(45deg);
 -webkit-transform: translate(-2px, 0) rotate(45deg);
 transform: translate(-2px, 0) rotate(45deg);
}
.totop i:after {
 -ms-transform: translate(2px, 0) rotate(-45deg);
 -webkit-transform: translate(2px, 0) rotate(-45deg);
 transform: translate(2px, 0) rotate(-45deg);
}

img {position:relative; padding:0; margin:0; max-width:100%; height:auto;}
.portrait {position:relative; padding:0; margin:0 auto 30px; width:80%; max-width:400px; display:block; border-radius:50%;}

.album {padding:0 0 60px 0; margin:0; text-align:center; clear:both;}
.album a {padding:1px; margin:0 auto; display:inline-block;}
.album a img {padding:1px; margin:0; border:1px solid #cef;}
.album a:hover img {border:1px solid #0be;}

.banner {padding:0; margin:0; background:#fcfafa; box-shadow: inset 0 0 15px rgba(0,0,0,0.08); overflow:hidden; clear:both;}
.bannercontent {width:100%; max-width:1200px; padding:0; margin:0 auto; background-position:center top; background-size:cover;}
.praxis {background-image:url(../images/bg1.jpg);}
.osteopathie {background-image:url(../images/bg2.jpg);}
.heilpraktikerin {background-image:url(../images/bg3.jpg);}
.kontakt {background-image:url(../images/bg4.jpg);}
.map {background-image:url(../images/map.jpg); height:478px;}

/*///////////////////// IMAGE LIGHTBOX /////////////////////////*/

#imagelightbox {position:fixed; z-index:1002; cursor:pointer; 
-ms-touch-action: none; touch-action: none;
-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.3 ); /* 50 */
box-shadow: 0 0 10px rgba(0,0,0,0.3); /* 50 */
}
#imagelightbox-overlay {position:fixed; top:0; right:0; bottom:0; left:0; z-index:1001; 
background-color:#fff; background-color:rgba(255,255,255,.9);
}
#imagelightbox-loading, #imagelightbox-loading div {border-radius:50%;}
#imagelightbox-loading {position:fixed; top:50%; left:50%; z-index:903; 
width: 2.5em; /* 40 */
height: 2.5em; /* 40 */
padding:0.625em; /* 10 */
margin: -1.25em 0 0 -1.25em; /* 20 */
background-color:#0be;
}
#imagelightbox-loading div {
width: 1.25em; /* 20 */
height: 1.25em; /* 20 */
background-color: #fff;
-webkit-animation: imagelightbox-loading .5s ease infinite;
animation: imagelightbox-loading .5s ease infinite;
}
#imagelightbox-caption {position:fixed; left:0; right:0; bottom:0; z-index:904;
text-align: center; color: #fff; background-color: rgba(0,0,0,0.3);
padding: 0; /* 10 */
}
@-webkit-keyframes imagelightbox-loading {
from {opacity:0.5;	-webkit-transform: scale(0.75);}
50%	 {opacity:1;	-webkit-transform: scale(1);}
to	 {opacity:0.5;	-webkit-transform: scale(0.75);}
}
@keyframes imagelightbox-loading {
from {opacity:0.5;	transform: scale(0.75);}
50%	 {opacity: 1;	transform: scale(1);}
to	 {opacity:0.5;	transform: scale(0.75);}
}


/* Ausbildungen Collapse */
.mehr-btn {
	display: none;
	background: #eee;
	border: 1px solid #c2d6db;
	padding: 10px 15px;
	border-radius: 6px;
	cursor: pointer;
	margin: 15px 0;
    color: #0be;
}



/*///////////// RESPONSIVE /////////////*/

@media screen and (max-width: 960px) {


}

@media screen and (max-width: 780px) {
    
    
    .doppel, .drittel {width:100%; margin:0;}

    h1, h2 {padding:80px 4% 100px; font-size:32px; line-height:40px;}
    
    .mehr-btn {
		display: block;
	}
	
	.collapse-mobile {
		display: none;
	}
	
	.collapse-mobile.active {
		display: block;
	}  
    .drittellater {
        width:100%; margin:0;
    }
    .map {background-image:url(../images/mini/map.jpg);}
    .logo {position:relative; margin:0 auto; left:auto; top:20px; font-size:20px; line-height:24px; text-align:center;}
    .navi {padding:28px 0 0; float:none; text-transform:none; font-family:'Roboto', 'Arial', sans-serif;}
    .navi ul li {margin:0px;}
    .minitext br {display:none;}
    p {
        -moz-hyphens: auto;
        -o-hyphens: auto;
        -webkit-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
        -moz-hyphenate-limit-chars: auto 5;
        -o-hyphenate-limit-chars: auto 5;
        -webkit-hyphenate-limit-chars: auto 5;
        -ms-hyphenate-limit-chars: auto 5;
        hyphenate-limit-chars: auto 5;
        -moz-hyphenate-limit-lines: 2;
        -o-hyphenate-limit-lines: 2;
        -webkit-hyphenate-limit-lines: 2;
        -ms-hyphenate-limit-lines: 2;
        hyphenate-limit-lines: 2;
    }
}

@media screen and (max-width: 420px) {
    .navi ul li:first-child {display:none;}
}