@charset "utf-8";
/* CSS Document */


/* #Reset & Basics (E. Meyers)
================================================== */
	html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		font: inherit;
		vertical-align: baseline; }
	article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
		display: block; }
	body {
		line-height: 1; }
	ol, ul {
		list-style: none; }
	blockquote, q {
		quotes: none; }
	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none; }
	table {
		border-collapse: collapse;
		border-spacing: 0; }


/* #Basic Styles
================================================== */
	html, body { width: 100%; height: 100%; }
	body { position: relative; background: #edeeee; font: 62.5%/150% 'Open Sans', sans-serif; color: #211d21; font-weight: 400;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ -webkit-text-size-adjust: 100%; text-rendering: optimizeLegibility; }

	nav { width: 16%; height: 100%; float: left; }
	#main { width: 31%; padding: 0 7.5% 100px; min-height: 100%; position: absolute; left: 16%; background: #fff;  
		-webkit-box-shadow: 0px 0px 20px #8d9598; -moz-box-shadow: 0px 0px 20px #8d9598; box-shadow: 0px 0px 20px #8d9598; }
			header { /*height: 200px;*/ text-align: center; display: table-cell; vertical-align: middle; }
			.buch { clear: both; float: left; /*overflow: auto;*/ width: 100%; padding-bottom: 50px; }
			.buch .cover { /*width: 38%;*/ width: 50%; float: left; }
			.buch .cover:nth-child(even) { /*width: 38%;*/ width: 50%; float: right; }
			.buch .desc { width: 50%; float: left; }
	#visual { width: 38%; height: 100%; position: fixed; right: 0; top: 0; z-index: -1; background: none no-repeat scroll center top;
		-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; }
	

/* #Navigation
================================================== */
	nav dl { font-size: 1.25em; line-height: 2.3em; margin-left: 15.5%; margin-top: 125%; }
	nav dl dd { line-height: 1.8em; margin-left: 7.5%; }
	nav dl dd.first { margin-top: 1em; }
	nav dl dd.last { margin-bottom: 1em; }
	nav a, nav a:visited { color: #8d9598; }
	nav a:hover, nav a:focus, nav a.active, nav .active a { color: #211d21; text-decoration: none; }
	#menu-icon { display: none; font-size: 1.3em; line-height: 2.3em; font-weight: 600; text-transform:capitalize; padding-left: 55px; margin: 10px 0; background: url(_layout/sandwich.png) 20px .5em no-repeat; }


/* #Typography
================================================== */

	h1, h2, h3, h4, h5, h6 { font-weight: normal; }
	h1, h2 { font-family: 'Lora', Georgia, serif; font-weight: 400; }

	h1 { font-size: 2.4em; line-height: 1.4em; margin-bottom: 0.9em; }
	h2 { font-size: 1.8em; line-height: 1.4em; margin-bottom: 0.9em; }
	h3 { font-size: 1.3em; line-height: 1.8em; margin-bottom: 0.6em; font-weight: 600; }
	h4 { font-size: 1.2em; line-height: 1.8em; margin-bottom: 0.6em; font-weight: 400; color: #8d9598; letter-spacing: .05em; }

	.half-bottom { margin-bottom: 0.4em; }
	.double-bottom { margin-bottom: 2.7em; }

	p { font-size: 1.3em; line-height: 1.8em; margin-bottom: 1.8em; }
	p.initial { overflow: auto; }
	p.initial:first-letter { float: left; font-family: 'Lora', Georgia, serif; font-size: 5.4em; line-height: 1em; margin: .125em .25em 0; }
	p.copy { font-size: 1.1em; text-align: right; color: #8d9598; margin-bottom: 2.7em; }
	p.swoosh { text-align: center; }

	ul { font-size: 1.3em; line-height: 1.8em; margin-bottom: 1.8em; }
	ul ul { font-size: inherit; line-height: inherit; margin-bottom: 0; }
	ul li { background: url(_layout/list.png) 21px 0.7em no-repeat; padding-left: 35px; }

	blockquote { margin-top: 5.4em; }
	blockquote p { padding: 0; text-align: center; font-family: 'Lora', Georgia, serif; font-weight: 400; font-style: italic; font-size: 1.8em; line-height: 1.4em; }
	blockquote cite { padding-left: 50%; /*text-align: right;*/ display: block; font-size: 1.1em; }

	em { font-style: italic; }
	strong { font-weight: 600;  }
	small { font-size: 80%; }

	hr { border: 1px solid #dededf; border-width: 1px 0 0; clear: both; margin: 3.6em 0 3.6em; height: 0; }


/* #Links
================================================== */
	a, a:visited { color: #8d9598; text-decoration: none; /*outline: 0; */ }
	a:hover, a:focus { text-decoration: underline; }
	a.download { background: url(_layout/download.png) 8px center no-repeat; padding-left: 35px; }


/* #Farben
================================================== */
	.plutoniumgrau { color: #004559; }
	.pastellrot { color: #f7bea7; }
	.brasilrot { color: #ce5657; }
	.erdbraun { color: #963c00; }
	.beige { color: #dcbe88; }
	.orange-dust { color: #885f3b; }
	.lorbeerzweig { color: #8c7933; }
	.graugelb { color: #a49b66; }
	.taupe { color: #ba7549; }
	.elefantengrau { color: #8d9598; }
	.hasengrau { color: #af9888; }
	.lakritzschwarz { color: #211d21; }


/* #Images
================================================== */
	img.scale-with-grid { max-width: 100%; height: auto; }
	.kalf { margin-bottom: 2em; }
	.shadow { width: 100%;  margin: 7.2em 0 7.2em; }

	#main header img { width: 62%; padding: 15% 0; }
	.swoosh img { margin: 20px 0; }
	.domin img { margin: 0 20px 10px -58px; }  /* width: 38, height: 34 */
	#main .beratung img { position: relative; top: 34px; margin: -34px 20px 0 -58px; }  /* width: 38, height: 34 */
	#main .recherche img { position: relative; top: 34px; right: -20px; margin: -34px 0 0 0; } /* width: 38, height: 34 */


/* #Fotos und Headlines
================================================== */
	.start h1, .start blockquote p { color: #963c00; }
	.about #visual { background-image: url(autorin/katja-mutschelknaus_portrait-schal.jpg); }
	.about h1, .about h2, .about blockquote p { color: #af9888; }
	.booking #visual { background-image: url(autorin/katja-mutschelknaus_portrait-schal.jpg); }
	.booking h1, .booking h2 { color: #af9888; }
	.leistungen #visual { background-image: url(autorin/katja-mutschelknaus_wall.jpg); }
	.leistungen h1, .leistungen h2, .leistungen blockquote p { color: #ba7549; }
	.publikationen #visual { background-image: url(autorin/rosen_pink.jpg); }
	.publikationen h1, .publikationen h2, .publikationen blockquote p { color: #9E2648; } /* altrot */
		.archiv h2 { color: #004559; }
	.foodtorian #visual { background-image: url(autorin/schlosskoechin.jpg); }
	.foodtorian h1, .foodtorian h2 { color: #004559; } 
	.mldl #visual { background-image: url(autorin/meinlokaldeinlokal.jpg); }
	.mldl h1, .mldl h2 { color: #ce5657; } 
	.kaffeekultur #visual { background-image: url(autorin/kaffeeklatsch.jpg); }
	.kaffeekultur h1, .kaffeekultur h2, .kaffeekultur blockquote p { color: #ce5657; }
	.gewuerze #visual { background-image: url(autorin/lavendel-hell.jpg); }
	.gewuerze h1, .gewuerze h2 { color: #004559; }
	.presse #visual { background-image: url(autorin/presse.jpg);  }
	.presse h1, .presse h2 { color: #8c7933; }
	.referenzen #visual { background-image: url(autorin/rosen_hell.jpg); }	
	.referenzen h1, .referenzen h2 { color: #a49b66; }
	.links #visual { background-image: url(autorin/rosen_hell.jpg);  }
	.links h1, .links h2 { color: #a49b66; }
	.kontakt #visual { background-image: url(autorin/katja-mutschelknaus_portrait.jpg); }
	.kontakt h1, .kontakt h2 { color: #ce5657; }
	.datenschutz #visual { background-image: url(autorin/rosen_hell.jpg); }
	.datenschutz h1, .datenschutz h2 { color: #a49b66; }




/* #Misc
================================================== */


@media only screen and (max-width:767px) {
	nav { position: absolute; top: 0px; height: auto; width: 100%; background-color:rgba(255,255,255,0.9); z-index: 20;}
	nav dl { margin-top: 0; /* margin-bottom: 20px; */ }
	#menu-icon { display: block; }
	#nav { display: none; }
	#main { width: 68%; padding: 0 16% 100px; left: 0; top: 50%; }
		.start #main { top: 49px; }
	#visual { width: 100%; height: 50%; position: static; background-position: center center; }
		.about #visual, .leistungen #visual/*, .presse #visual*/, .kontakt #visual { background-image: url(autorin/rosen_hell.jpg);  }
		.about h1, .about h2, .about blockquote p,
		.leistungen h1, .leistungen h2, .leistungen blockquote p, 
		.presse h1, .presse h2,
		.kontakt h1, .kontakt h2 { color: #a49b66; } 
	
	.buch { clear: both; float: none; }
	.buch .cover { width: 100%; float: none; }
	.buch .cover:nth-child(even) { width: 100%; float: none; }
	.buch .desc { width: 100%; float: none; }
}

@media only screen and (max-width : 767px) and (orientation : portrait) {
	.about #visual { background-image:url(autorin/katja-mutschelknaus-portrait-quer.jpg); }
	.about h1, .about h2, .about blockquote p { color: #af9888; }
	.leistungen #visual { background-image: url(autorin/katja-mutschelknaus_wall-quer.jpg); }
	.leistungen h1, .leistungen h2, .leistungen blockquote p { color: #ba7549; }
	.kontakt #visual { background-image: url(autorin/katja-mutschelknaus_portrait-quer.jpg); }
	.kontakt h1, .kontakt h2 { color: #ce5657; }
}
