﻿/*
Theme Name: Ayurvedische Heilkunst
Author: Matthias Breinl
Author URI: http://L7media.de/
Description: für Inga Mayer, ayurvedische-heilkunst.de
*/



	* {	padding:0; margin:0;}
	a {color:#000; text-decoration:none;}
	img{border: 0px;}
	html, body{height:100%;}

@font-face {
	font-family: 'open-sans-regular';
    src: url('fonts/opensans-regular-webfont.woff2') format('woff2'),
         url('fonts/opensans-regular-webfont.woff') format('woff');
}
@font-face {
    font-family: 'open-sans-bold';
    src: url('fonts/opensans-bold-webfont.woff2') format('woff2'),
         url('fonts/opensans-bold-webfont.woff') format('woff');
}
@font-face {
    font-family: 'open-sans-semibold';
    src: url('fonts/opensans-semibold-webfont.woff2') format('woff2'),
         url('fonts/opensans-semibold-webfont.woff') format('woff');
}
	
	/* ---------------------------------------------- LAYOUT ---------------------------------- */
	body{background: url(grafik/content-back.png); font-family:'open-sans-regular', sans-serif; font-size:20px; color:#000;	}
	#wrapper {
		position:relative;
		width:100%;
		max-width: 1240px;
		margin: 0 auto;
		background: rgba(255,255,255, 0.8);
	}
	
	header img{display:block;}	
	
	#spacer img{width:100%; height:auto;}
	#logo{position:absolute; top:0; right:3.9%; width:14.3548%; min-width:80px; z-index:9980;}
	#borte{position:absolute; top:0; left:0px;  z-index:9999;}
	#logo img, #borte img {width: 100%;	height: auto;}
	
	
	#navi {padding: 16px 5% 10px 7%; position:relative;}
	#navi li{float:left;}
	
	#nav_button{display:none; position: absolute; top:20px; left:7%; /*margin: -20px 7% 20px;*/ cursor:pointer; width:5%; background:#fff; padding: 15px 15px 10px; z-index:9999;}
	#nav_button img{width:100%; height:auto; }
	
	@media screen and (max-width:1239px){
		#navi { display:none; position:absolute; background:rgba(255,255,255,1); left:22%; top:0; z-index:9990; padding:85px 10px 10px;}
		#nav_button{display:block;}
		#navi li{float:none; border-left:none 0px; padding:8px 0; text-align:left; background:url(grafik/punktlinie.png) repeat-x bottom;}
	}
	@media screen and (max-width:1000px){
		#navi {padding-top:70px; }
	}
	@media screen and (max-width:768px){
		#navi {left:21%; top:0; padding-top:54px;}
		#nav_button{ /*margin: 0px 7% 20px;*/ width:40px; padding: 10px 10px 5px;}
	}
	@media screen and (max-width:480px){
		#navi {/*left:24%; top:0; right:0;*/ left:24%; padding-top:34px;}
		#nav_button{ /*margin: 0px 7% 20px;*/ width:30px; padding:0px 7px 1px; top:10px;}
	}
	/*#bild img {width: 100%;	height: auto;}*/
	main {position:relative; margin: 40px 7% 60px;}
	@media screen and (max-width:768px){
		main {margin-top: 25px;}
	}
	.metaslider{clear:both;}
	.clear{clear:both;}
	
	footer {background:#eaf1d1; clear:both; padding: 15px 7% 15px;}
	.footermenu{clear:both;}
	footer ul{float:right; padding-bottom:10px;}
	footer li{float:left;}
	#copyright{text-align: right; clear:both;}
	@media screen and (max-width:860px){
		footer ul{float:none;}
		.footermenu {clear:none; width:50%; float:left;}
		footer li{float:none; margin-bottom:7px;}
		#copyright{text-align: center;}
	}
	@media screen and (max-width:420px){
		.footermenu { float:none;}
	}
	
	/* ---------------------------------------------- NAVI Textformate ---------------------------------- */
	#navi ul {list-style-type:none;}	
	#navi li{ font-family:'open-sans-semibold', sans-serif; line-height:28px;}
	#navi li::after{content:"·";}
	#navi li:last-child::after{content:"";}
	#navi a {color:#1f5029; display:inline-block; padding:0 12px;}
	#navi li:first-child a { padding-left:2px ;}
	#navi a:hover, #navi .current_page_item a{color:#da0011; }
	@media screen and (max-width:1240px){
		#navi li::after{content:"";}
		#navi a{font-size:18px;}
	}
	
	/* ---------------------------------------------- CONTENT Textformate ---------------------------------- */
	
	/* ---------------------------------------------- Ankermenü ---------------------------------- */
	
	main ol{list-style-type: none; padding-bottom:30px; max-width:74%;}
	main ol li{ margin-bottom: 4px; padding:7px 0 7px 45px; background:url(grafik/listenpunkt-logo.png) no-repeat 0 2px;}
	main ol a{font-size:26px; line-height:120%; font-family:'open-sans-semibold', sans-serif; color:#da0011;}
	@media screen and (max-width:1100px){
		main ol li{ margin-bottom: 0; background-size: 26px auto; padding-top:3px; background-position:0 -1px;}
		main ol a{font-size:22px; line-height:24px;}
	}
	@media screen and (max-width:768px){
		main ol{padding-bottom:15px;}
		main ol li{ padding-left:35px; margin-bottom: 0; background-size: 22px auto; padding-top:3px; background-position:0 2px;}
		main ol a{font-size:19px; line-height:20px;}
	}
	@media screen and (max-width:480px){
		main ol{ max-width:100%; }
	}
	
	/* ---------------------------------------------- Artikelbild – rote Grafiken ---------------------------------- */
	
	.artikelbild{float:right; width:25%; padding: 10px 0 20px 15px; margin-right:-4%;}
	.artikelbild img{margin:0; width:100%; height:auto;}	
	@media screen and (max-width:480px){
		.artikelbild{display:none;}	
		.inga .artikelbild, .kontakt .artikelbild{display:inline;}
	}
	
	/* ---------------------------------------------- Textformate ---------------------------------- */
	h1, h2, h3, p, td, li{letter-spacing: 0em;}
	
	h1, h2, h3{font-family:'open-sans-semibold', sans-serif; color:#da0011; }
	h1{clear:both; font-size:35px; line-height:46px;  margin-bottom:36px; padding-top:40px; background:url(grafik/punktlinie.png) repeat-x;}
	h1:first-of-type{clear:none; width:74%; padding-top:0px; background:none;}
	.ayurveda h1:first-of-type, .mbsr h1:first-of-type, .kurse h1:first-of-type, .psycho h1:first-of-type, .inga h1:first-of-type{padding-top:40px; background:url(grafik/punktlinie.png) repeat-x;}
	@media screen and (max-width:480px){
		h1:first-of-type{width:100%;}	
	}
	h1 .subheadline{display:block; font-size:60%; line-height:135%;}
	h2{font-size:26px;  line-height:40px; margin-top:48px;}	
	h3{font-size:24px;  line-height:40px;}
	h4{font-family:'open-sans-bold'; color:#8c8c8c;}
	p, main ul{font-size:18px; line-height:180%; margin-bottom:36px; max-width:900px;}
	main ul{margin-left:20px; list-style-image:url(grafik/listenpunkt.png) }
	main ul li{margin-bottom:10px; }
	@media screen and (max-width:1100px){
		h1{font-size:32px; line-height:38px; margin-bottom:24px;}
		h1 .subheadline{font-size:62%;}
		h2{font-size:23px; line-height:32px; margin-top:40px;}
		p, main ul{font-size:17px; line-height:160%; margin-bottom:28px;}
		main ul li{margin-bottom:17px; }
	}
	@media screen and (max-width:767px){	
		h1{font-size:24px; line-height:30px; margin-bottom:18px;}
		h1 .subheadline{font-size:66%;}
		h2{font-size:20px; line-height:26px; margin-top:32px;}
		p, main ul{font-size:16px; line-height:150%; margin-bottom:14px;}
		main ul{margin-left:16px; list-style-image:url(grafik/listenpunkt-klein.png) }
		main ul li{margin-bottom:20px; }
	}
	
	.alignleft{float:left;}
	.alignright{float:right;}
	
	.normal{font-weight:400;}
	strong{font-family:'open-sans-semibold', sans-serif; color:#da0011;}
	main a {color:#1f5029; text-decoration:none; font-family:'open-sans-bold';}
	main a:hover {color:#da0011;}
	sup{font-size:60%;}
	
	/* ---------------------------------------------- TABELLE HOME ---------------------------------- */
	.home td{vertical-align:top; }
	.home td:nth-child(1){width:40%; padding:0 20px 35px 0;}
	.home td p{line-height:150%;}
	.home td img{ padding-top:10px; width:100%; height:auto;}
	@media screen and (max-width:767px){
		.home td{display:block; clear:both;}
		.home td:nth-child(1){width:80%;}
		.home td img{ width:100%; height:auto;}
	}
	
	/* ---------------------------------------------- Up-BUTTONS ---------------------------------- */
	hr{clear:both; float:right; border:none; width:32px; height:32px; background: transparent url(grafik/up-button.png) no-repeat; cursor:pointer; margin:-11px 0 21px;}
	hr:last-child{margin-top:-40px;}
	.home hr:last-child{margin-top:-11px;}
	@media screen and (max-width:767px){
		hr{width:24px; height:24px; background-image:url(grafik/up-button-klein.png);}
	}
	p + hr{margin:-11px 0 21px;}
	div + hr{margin:16px 0 21px;}
	
	/* ---------------------------------------------- KONTAKTFORMULAR ---------------------------------- */
	.label{display:table-cell; width:160px; color:#da0011; font-family:'open-sans-semibold', sans-serif;}
	.wpcf7-text, .wpcf7-textarea, .wpcf7-quiz{background:#eaf1d1; border: solid 1px #1f5029; font-size:18px; padding:2px 10px 3px;}
	.wpcf7-text, .wpcf7-textarea{width:70%; max-width:600px; margin-bottom:16px;}
	.wpcf7-text{width:70%; max-width:300px;}
	.wpcf7-quiz{width:30px;}
	
	.wpcf7-textarea{vertical-align:text-top ; font-family:'open-sans-regular', sans-serif;}
	.wpcf7-submit{color:#1f5029; background:transparent; font-family:'open-sans-bold', sans-serif; font-size:20px; border:none; cursor:pointer;}
	@media screen and (max-width:600px){
		 .wpcf7-text, .wpcf7-textarea{width:90%; }
	}
	
	/* ---------------------------------------------- NEWSLETTER-FORMULAR ---------------------------------- */
	.mc-field-group label{display:inline-block; width:160px; font-size:18px;}
	.mc-field-group input[type=text], .mc-field-group input[type=email]{background:#eaf1d1; border: solid 1px #1f5029; font-size:18px; padding:3px 10px;  margin-bottom:16px;}
	#mc_embed_signup input.button{color:#1f5029; background:transparent; font-family:'open-sans-bold', sans-serif; font-size:20px; padding:3px 0px; border:none; cursor:pointer;}
	div.mce_inline_error{background:#da0011 !important;}
	
	
	/* ---------------------------------------------- SLIDER ---------------------------------- */
	.kunst_foto .metaslider{border:solid 1px #cecece;}
	.flex-direction-nav a{background:url(grafik/bg_direction_nav.png) no-repeat 0 0 !important; height:40px !important; opacity:1 !important;}
	.flex-direction-nav a.flex-next{background-position-x:-30px !important; height:40px !important;}
	
	main .metaslider{margin-top:10px;}
	main .metaslider .caption-wrap{bottom:-32px !important; background-color:transparent !important; color:#000 !important;  opacity:1 !important;}
	main .metaslider .caption{padding:0 !important;}
	@media screen and (max-width:767px){
		main .metaslider{margin-bottom:20px;}
		main .metaslider .caption-wrap{bottom:-25px !important; background-color:#fff !important; font-size:14px;}
	}
	
	/* ---------------------------------------------- FOOTER Textformate ---------------------------------- */
	footer {font-size:14px;}
	footer ul{list-style-type:none;}
	footer li{ font-family:'open-sans-semibold', sans-serif; line-height:16px;}
	footer li::after{content:"·";}
	footer li:last-child::after{content:"";}
	footer a {color:#1f5029;  text-decoration:none; display:inline-block; padding:0 7px;}
	footer li:last-child a {padding-right:0;}
	footer a:hover, footer .current_page_item a{color:#da0011; }
	@media screen and (max-width:860px){
		footer li::after{content:"";}
		footer a {display:inline-block; padding:0 0;}		
	}
	
	
	/* ---------------------------------------------- SONSTIGES ---------------------------------- */
	
	.inga main img{max-width:100%; height:auto;}
	
	.inga main img.inga-content{display:none;}
	
	@media screen and (max-width:600px){
		.inga .artikelbild {display:none;}
		.inga main img.inga-content{display:block; width:50%; margin:7px 0 5px 0;}
	}
	@media screen and (max-width:480px){
		.inga main img.inga-content{width:75%;}
	}
	
	
	