/* CSS Document */

/* source-sans-pro-300 - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/source-sans-pro-v21-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-300.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}
/* source-sans-pro-regular - latin */
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/source-sans-pro-v21-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/source-sans-pro-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/source-sans-pro-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/source-sans-pro-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/source-sans-pro-v21-latin-regular.svg#SourceSansPro') format('svg'); /* Legacy iOS */
}



*{
margin:0;
padding:0
}


html,body{
height:100%
}



body {
	font-family: 'Source Sans Pro', sans-serif;
	font-weight:300
}


#navMobile{
	width:50px;
	position: fixed;
	z-index: 15001;
	top:40px;
	right:20px;
	display: none
}


#navMobile img{
	width:100%;
	height:auto
}

h1.home{
	font-weight: 300;
	color:#8e7e6d;
	position: absolute;
	bottom:10px;
	left:10px;
	font-size:60px;
	text-transform: uppercase;
	line-height: 60px;
	z-index: 950;
	letter-spacing: 2px
}





h1.big{
	font-weight: 300;
	color:#8e7e6d;
	position: absolute;
	bottom:8px;
	left:9px;
	font-size:110px;
	text-transform: uppercase;
line-height: 110px
}

h1.allgemein{
font-weight: 400;
color: #8e7e6d;
letter-spacing: 2px;
font-size: 20px;
text-transform: uppercase;
line-height: 22px;
margin-bottom: 20px;
}

h1.akupunktur{
font-weight: 400;
color: #8e7e6d;
letter-spacing: 1px;
font-size: 20px;
text-transform: uppercase;
line-height: 22px;
margin-bottom: 20px;
	text-align: center;
	margin:40px 0 40px 0;
}


h2{
	font-weight: 400;
	color:#8e7e6d;
letter-spacing: 2px;
	font-size:20px;
	text-transform: uppercase;
	line-height: 24px;
}

h2.diagnose{
	text-align: center;
	margin:40px 0 40px 0;
}




h3{
	font-weight: 400;
	color:#8e7e6d;
	font-size:14px;
	line-height: 17px;
	margin-bottom:5px;
	
}

#therapieformen h3{
}

.therapie-2 h3.therapie,.therapie-3 h3.therapie,.therapie-4 h3.therapie{
color:#000;
}


h3.diagnose{
	text-transform: uppercase;
	letter-spacing: 1px
}

h3.therapie{
	color:#fff;
	text-transform: uppercase;
	letter-spacing: 1px;
	position:absolute;
	left:8px;
	bottom:5px
}


h4.diagnose{
	 font-weight: 400;
	color:#8e7e6d;
	font-size:14px;
	margin-top:15px
}

.logo{
	width:300px;
	float:left;
	margin-top:40px;
	margin-left:25px
}

.logo img{
	width:100%;
	height: auto;
	
}

#page {

	width:100%;
	height:100% !important;
	margin:auto;
}

#page.noBigImage{
	height:7% !important
}


#content {
	width: calc(100% - 55px);
	margin:auto;
	margin-top:40px;
	background-color:#f5ede4;
padding-top: 1px;
padding-bottom: 1px;
	position: relative
}

#content ul{
	margin-left:15px
}

#content ul li {
	font-size: 14px;
	color:#8e7e6d;
	margin-bottom: 8px;
}

#content ul li span{
	color:#000
}

#content.diagnose{
	height:1600px
}

#content.ernaehrung{
	height:1200px
}

#content.phytotherapie{
	height:800px
}

#content.darmflora{
	height:600px
}

#content.mitochondrial{
	height:700px
}

#content.akupunktur{
	height:1000px
}



.wrapper1020{
	width:1020px;
	position: relative;
	margin: auto
}


.innerBox-home{
	width:45%;
	margin: auto;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px
}

.innerBox-home p{
	margin-top:15px;
	font-size: 14px
}


.innerBox-diagnose-1{
	width:250px;
		border:2px solid #fff;
	padding:35px;
	position: absolute;
	left:100px;
	height:300px;
	background-image: url(../images/bild-diagnose-2.jpg);
	background-repeat: no-repeat;
	background-size: 32px;
	background-position: bottom right
}



.innerBox-diagnose-2{
	width:450px;
	height:780px;
	border:2px solid #fff;
	padding:35px;
	position: absolute;
	right:108px;
	top:340px;
	
}


.innerBox-diagnose-3{
	width:250px;
		border:2px solid #fff;
	padding:35px;
	position: absolute;
	top:1158px;
	left:100px;

	background-image: url(../images/bild-diagnose-2.jpg);
	background-repeat: no-repeat;
	background-size: 32px;
	background-position: top right
}

.innerBox-therapie-1{
	width:550px;
	margin: auto;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: relative
}

.innerBox-ernaehrung-1{
	width:350px;
		border:2px solid #fff;
	padding:35px;
	position: absolute;
	left:100px;
}

.innerBox-ernaehrung-2{
	width:450px;
		border:2px solid #fff;
	padding:35px;
	position: absolute;
	right:100px;
	top:320px
}

.innerBox-ernaehrung-3{
	width:200px;
		border:2px solid #fff;
	padding:35px;
	position: absolute;
	left:100px;
	top:600px
}



.innerBox-phytotherapie{
	width:250px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 450px;
	top: 200px;
}

.innerBox-mikro{
	width:350px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 450px;
	top: 100px;
}

.innerBox-darmflora{
	width:450px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 250px;
	top: 100px;
}
.innerBox-eigenblut{
	width:320px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 250px;
	top: 100px;
}


.innerBox-homoeopathie{
	width:350px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 250px;
	top: 50px;
}

.innerBox-akupunktur-1{
	width:280px;
	border:2px solid #fff;
	padding:35px;
	margin-top:35px;
	margin-bottom: 35px;
	position: absolute;
	left: 150px;
	top: 50px;
}


.innerBox-akupunktur-2{
	width:500px;
	border:2px solid #fff;
	padding:35px;
	margin-top:70px;
	margin-bottom: 35px;
	position: absolute;
	left: 400px;
	top: 250px;
}




.lowercase{
	text-transform: lowercase
}

.uppercase{
	text-transform: uppercase;
	letter-spacing: 1px
}

.bigger{
	font-size:16px
}

.center{
	text-align: center
}

.talismano{
text-align: center;
color:#8e7e6d;
font-style: italic;
font-size:18px !important
}
.talismano-expl{
text-align: center;
color:#8e7e6d;
font-style: italic
}


.innerBox-diagnose-1 p,.innerBox-diagnose-2 p,.innerBox-diagnose-3 p,.innerBox-therapie-1 p,.innerBox-ernaehrung-1 p,.innerBox-ernaehrung-2 p,.innerBox-ernaehrung-3 p,.innerBox-phytotherapie p,.innerBox-mikro p,.innerBox-darmflora p,.innerBox-homoeopathie p,.innerBox-akupunktur-1 p,.innerBox-eigenblut p,.innerBox-akupunktur-1 p,.innerBox-akupunktur-2 p{
	margin-bottom:15px;
	font-size: 14px
}


.bild-home-1{
width: 200px;
position: absolute;
right: 60px;
bottom: -50px;
}


.bild-diagnose-1{
width: 250px;
position: absolute;
left: 450px;
top: 170px;
}

.bild-ernaehrung-1{
width: 300px;
position: absolute;
left: 540px;
top: 85px;
}

.bild-tiziana{
position: absolute;
width: 200px;
left: -200px;
top: 70px;	
}

.bild-phytotherapie{
position: absolute;
width: 260px;
left: 200px;
top: 50px;
z-index: 500;
}

.bild-mikro{
position: absolute;
width: 350px;
left: 120px;
top: 50px;
z-index: 500;
}

.bild-darmflora{
position: absolute;
width: 150px;
left:700px;
top: 350px;
z-index: 500;
}

.bild-eigenblut{
position: absolute;
width: 250px;
left:630px;
top: 240px;
z-index: 500;
}

.bild-homoeopathie{
position: absolute;
width: 250px;
left:650px;
top: 340px;
z-index: 500;
}

.bild-akupunktur{
position: absolute;
width: 250px;
left:130px;
top: 322px;
z-index: 500;
}



.bigImage{
width: calc(100% - 55px);
height: calc(100% - 150px);
background-size: cover;
background-position: 0 100px;
animation: zoom 15s linear infinite;
animation-timing-function: ease-in-out;
animation-fill-mode: forwards;
animation-direction: alternate;
webkit-animation: zoom 15s linear infinite;
webkit-animation-timing-function: ease-in-out;
webkit-animation-fill-mode: forwards;
webkit-animation-direction: alternate;

	
position: relative;
margin:auto;
padding-top: 110px;
}



@-webkit-keyframes zoom {
    0% { background-size: 120%; }
    100% { background-size: 140%; }
}

@keyframes zoom {
    0% { background-size: 120%; }
    100% { background-size: 140%; }
}





.bigImage.home{
	background-image: url(../images/motiv-home.jpg)	;
}
.bigImage.diagnose{
	background-image: url(../images/motiv-diagnose.jpg)	;
}
.bigImage.therapie{
	background-image: url(../images/motiv-therapie.jpg)	;
}
.bigImage.ernaehrung{
	background-image: url(../images/motiv-ernaehrung.jpg)	;
}




#arrowDown{
position:absolute;
bottom:10px;
width:24px;
left:50%;
margin-left:-12px;
}

#arrowDown img{
width:100% !important;
height:auto	;
}


#upLink1{
display:none
}



#header{
	height:110px;
	width:100%;
	position: fixed;
	z-index: 10000;
	background-color: #fff
}


#header ul{
	float:right;
	margin-top:60px;
	margin-right:30px;
	margin-bottom:40px
}

#header ul.navigation li{
	color:#8e7e6d;
	list-style: none;
	display:inline;
	letter-spacing: 1px;
	margin-left:10px;
	font-size: 12px;
	margin-top:3px;
	margin-bottom: 3px;
	
}

#header ul.navigation li.aktiv{
	text-transform: uppercase
}

ul.navigation li a,ul.navigation li a:link,ul.navigation li a:active,ul.navigation li a:hover,ul.navigation li a:visited{
	text-decoration: none;
	color:#000
}




.clear {
	clear: both
}



#therapieformen{
	padding:20px;
	margin:auto;
	border:2px solid white;
	width:760px;
height:560px;
	margin-bottom: 50px;
	position: relative
}

.therapie-1{
	background-color:grey;
	width:244px;
	height:368px;
position: absolute;
	left:20px;
	top:20px;
	background-image: url(../images/therapieform-ernaehrung.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}

.over-1,.over-2,.over-3,.over-4,.over-5,.over-6,.over-7{
	display: table-cell;
	width:100%;
	height:100%;
	vertical-align: middle;
	background:rgba(255,247,247,0.95);
	font-size: 12px !important;
	line-height: 20px;
		text-align: center;
	z-index: 5000;
	position: relative;
	opacity: 0
}

.over-1 p,.over-2 p,.over-3 p,.over-4 p,.over-5 p,.over-6 p,.over-7 p{
	width:70%;
	margin:auto
}

#therapieformen a,#therapieformen a:link,#therapieformen a:active,#therapieformen a:hover,#therapieformen a:visited{
	text-decoration: underline;
	color:#8E8070;
	text-transform: uppercase;
	font-weight: bold;
	display: block;
	margin-top:10px;
	letter-spacing:1px
}


.therapie-2{

	background-color:grey;
	width:244px;
	height:180px;
position: absolute;
	left:20px;
	top:396px;	
	background-image: url(../images/therapieformen/149081901.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}





.therapie-3{
	background-color:grey;
	width:244px;
	height:180px;
position: absolute;
	left:276px;
	top:20px;	
	background-image: url(../images/therapieform-akupunktur.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}

.therapie-4{
	background-color:grey;
	width:244px;
	height:368px;
position: absolute;
	left:276px;	
	top:208px;
		background-image: url(../images/therapieform-phytotherapie.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}


.therapie-5{
	background-color:grey;
	width:244px;
	height:180px;
position: absolute;
	left:532px;
	top:20px;	
	background-image: url(../images/therapieform-homoeopathie.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}

.therapie-6{

	background-color:grey;
	width:244px;
	height:180px;
position: absolute;
	left:532px;
	top:208px;	
		background-image: url("../images/therapieformen/mitochondrium.jpg");
background-repeat: no-repeat;
	background-size:cover;
	display: table
}

.therapie-7{
	background-color:grey;
	width:244px;
	height:180px;
position: absolute;
	left:532px;
	top:396px;	
		background-image: url(../images/therapieform-mikro.jpg);
background-repeat: no-repeat;
	background-size:cover;
	display: table
}

.more{
	width:30px;
	position: absolute;
	right:10px;
	bottom:10px;
	z-index: 3000
}


.mailLink, .mailLink:link, .mailLink:active, .mailLink:hover, .mailLink:visited{
	text-decoration: underline;
	color:black
}

#footer {
	width:85%;

	margin-top:40px;
	margin-bottom:80px;
	padding-bottom:50px;
	background-color:#fff;
	color:#8e7e6d;
	font-size: 14px;
	
}
#footer p{
	margin-bottom:15px;
	margin-left:25px

}


#footer h3{
	margin-left:25px
}

#footer a,#footer li a:link,#footer li a:active,#footer li a:hover,#footer li a:visited{
	text-decoration: none;
	color:#8e7e6d
}

.datenschutz a,.datenschutz a:link,.datenschutz a:active,.datenschutz a:hover,.datenschutz a:visited{
	text-decoration: underline;
	color:#000
}



/* Responsive Responsive Responsive* Responsive Responsive Responsive* Responsive Responsive Responsive*/
/* Responsive Responsive Responsive* Responsive Responsive Responsive* Responsive Responsive Responsive*/
/* Responsive Responsive Responsive* Responsive Responsive Responsive* Responsive Responsive Responsive*/

/* Minimum aspect ratio */
@media (max-aspect-ratio: 7/6) {

	.bigImage {
    animation: none;
	background-size: cover;
background-position: center center;
		
  }

}


@media screen and (max-width: 1024px) {
	
#header ul{
width: 400px;
margin-top: 40px;
text-align: right;
}	
	
.bild-tiziana {
    position: relative;
	float:right;
	margin-left:20px;
    width: 200px;
    left: inherit;
    top: inherit;
}
	
	
}



@media screen and (max-width: 1000px) {
	
	.bild-home-1,.bild-diagnose-1,.bild-ernaehrung-1,.bild-darmflora,.bild-akupunktur,.bild-phytotherapie,.bild-homoeopathie,.bild-eigenblut,.bild-mikro{
		position: relative;
		right:inherit;
		left:inherit;
		top:inherit;
		bottom: inherit;

		margin:auto;
		width:60%;
		display: block;
		margin-bottom:30px;
		margin-top:30px
	}	
	
	

	
	
	
	.innerBox-home {
    width: 60%;
		
	}
	
	
	.wrapper1020{
		width:100%
	}
	
	#content.diagnose,#content.ernaehrung,#content.darmflora,#content.akupunktur,#content.phytotherapie {
    height: auto;
}
	
	.innerBox-diagnose-1,.innerBox-diagnose-2,.innerBox-diagnose-3,.innerBox-ernaehrung-1,.innerBox-ernaehrung-2,.innerBox-ernaehrung-3,.innerBox-darmflora,.innerBox-akupunktur-1,.innerBox-akupunktur-2,.innerBox-phytotherapie,.innerBox-homoeopathie,.innerBox-eigenblut,.innerBox-mikro{
		position: relative;
		left:inherit;
		right:inherit;
		top:inherit;
		bottom: inherit;
		margin:auto;
		width:60%;
		height:inherit;
margin-top: 30px;
margin-bottom: 30px;

	}
	
	
	
	.innerBox-therapie-1{
		width:84%;
		margin:inherit !important;
		padding:25px
	}
	

	
	
}



@media screen and (max-width: 800px) {
	#navMobile{
		display: block
	}
	
	.navigation{
	display:none
	}
	
	#header ul{
	width: 100%;
	margin:auto;
	text-align: center;
	background-color: rgba(255,255,255,0.87);
margin-top:28px;
		padding-top:20px;
		padding-bottom:10px
}
	#header ul li{
		display:block !important;

	}
	#header ul.navigation li {
	font-size:16px
	}
	
	
#therapieformen{	
width: 85%;
	padding:0;
height: auto;
	border:0
}
	
	.therapie-1,.therapie-2,.therapie-3,.therapie-4,.therapie-5,.therapie-6,.therapie-7{
		width:100%;
		position: relative;
		left:inherit;
		right: inherit;
		top:inherit;
		bottom:inherit;
		margin-bottom: 20px
	}	
	
.over-1, .over-2, .over-3, .over-4, .over-5, .over-6, .over-7 {
    font-size: 16px !important;
    line-height: 24px;
    text-align: center;
}	
	
#therapieformen h3 {
    font-size: 20px;
    letter-spacing: 2px;
    background-color: rgba(255,255,255,0.80);
    color: #000;
    left: 0px !important;
    bottom: 0 !important;
    margin-bottom: 0;
    line-height: 20px;
    width: calc(100% - 4px);
    padding: 7px 0 7px 4px;
}	
	
.more {
    width: 26px;
    position: absolute;
    right: 10px;
    bottom: 5px;
    z-index: 3000;
}	
	
	
#content {
	width: 100%;
	}

	
.bigger{
	font-size:23px
}
	
	
	
}

@media screen and (max-width: 700px) {
h1.big {
    font-size: 80px;
    line-height: 85px;
}
	
}


@media screen and (max-width: 600px) {
	.innerBox-home {
     width: 75%
	}	
	
	
h1.home {
    font-weight: 300;
    color: #8e7e6d;
    position: absolute;
    bottom: 10px;
    left: 10px;
    font-size: 30px;
    text-transform: uppercase;
    line-height: 32px;

}	
	
	
	.weissVerlauf{
	position: absolute;
	bottom:0;
	width:100%;
	height:200px;
	z-index: 800;
	
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+85&0+0,1+42 */
background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 42%, rgba(255,255,255,1) 85%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 42%,rgba(255,255,255,1) 85%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 42%,rgba(255,255,255,1) 85%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
	
	
	
}
	
	
	
	
	
}



@media screen and (max-width: 500px) {
h1.big {
    font-size: 60px;
    line-height: 65px;
	color:#fff
}
	
	
.bild-tiziana {
	float:left;
	margin-left:0;
    width: 100%;
margin-bottom: 20px
}	
	
	
}




@media screen and (max-width: 450px) {
	.logo{
		width:65%;
		margin-top:50px
	}
	
	#header ul{	
		margin-top:10px;
	}
	

	
	
}


@media screen and (max-width: 400px) {
	h1.big {
    font-size: 58px;
    line-height: 50px;
}
}

@media screen and (max-width: 320px) {

	.more{
	}
	
h2.diagnose {
    text-align: left;
    margin: 40px 0 0 22px;
}	
	
.bild-home-1,.bild-diagnose-1,.bild-ernaehrung-1,.bild-darmflora,.bild-akupunktur,.bild-phytotherapie,.bild-homoeopathie,.bild-eigenblut,.bild-mikro{
width:85%
}	
	
.bild-home-1,.bild-diagnose-1,.bild-ernaehrung-1{
		display: none
	}	
	
.innerBox-home {
width: 85%;
padding:0;
border:0	
}


	
.innerBox-diagnose-1,.innerBox-diagnose-2,.innerBox-diagnose-3,.innerBox-ernaehrung-1,.innerBox-ernaehrung-2,.innerBox-ernaehrung-3,.innerBox-darmflora,.innerBox-akupunktur-1,.innerBox-akupunktur-2,.innerBox-phytotherapie,.innerBox-homoeopathie,.innerBox-eigenblut,.innerBox-mikro{

width:85%;
padding: 0;
border:0;

}	

	.innerBox-diagnose-1,.innerBox-ernaehrung-1{
	margin-top:0
	}
	
.wrapper1020 {	
padding-top:25px	
}
	
.innerBox-diagnose-1,.innerBox-diagnose-3{	
	background-image:none;
	}
	
	
	
h1.home {
    font-weight: 300;
    color: #625549;
    position: absolute;
    bottom: 10px;
    left: 10px;
    font-size: 18px;
    text-transform: uppercase;
    line-height: 21px;
}	
	

.weissVerlauf {


    height: 100px;

    opacity: .6;

}	

.bigImage.home{
	background-image: url(../images/bild-home-1.jpg);
}	

.bigImage.diagnose{
	background-position: 30% 70px;
}	

	h1.big.therapie {
    font-size: 61px;

}

	h1.big.ernaehrung {
    font-size: 46px;

}	
	
	
#header{
	height:70px
}	
	
	
#navMobile {

    width: 34px;
    top: 26px;


}
	
.logo {

    width: 70%;
    margin-top: 25px;

}	
	
	
}