/*	h1: 																			hidden, same as title
		h2: Tomato, 1.75em = 28px; normal					page header, 
		h3: Arial, 2.1875em = 35px; normal
		h4: Arial, .8125em = 13 px, normal				header of .benefit and .referenz, 
		h5: Tomato, normal
		*/

/* The Font +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	/* Generated by Font Squirrel (http://www.fontsquirrel.com) on May 25, 2012 +++++++++++++++++++ */
	
	@font-face {
			font-family: 'TomatoRoundCondensedMedium';
			src: url('tomatoroundcondensed_uml_franz_sz.eot');
			src: url('tomatoroundcondensed_uml_franz_sz.eot?#iefix') format('embedded-opentype'),
					 url('tomatoroundcondensed_uml_franz_sz.woff') format('woff'),
					 url('tomatoroundcondensed_uml_franz_sz.ttf') format('truetype'),
					 url('tomatoroundcondensed_uml_franz_sz.svg#TomatoRoundCondensedMedium') format('svg');
			font-weight: normal;
			font-style: normal;
		}

	body { font-family: Courier; }

	h3, h4, p, td, li, blockquote, cite, #index #aktuelles p, #aktuelles a, .p
		{ font-family: Arial, sans-serif; }

	h1, h2, h3, nav *, span, footer p, #index p, #error-404 p, #aktuelles article p + a,
	.benefit h4, .referenz h4, h5, .teaser div ~ a, .fotos em
		{ font-family: 'TomatoRoundCondensedMedium', Arial, sans-serif; }

	h2, h3, .benefit h4, .referenz h4, h5 { font-weight: normal; }
	
@media screen, projection

{

	/* Font Sizes +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	.fotos a em { font-size: 6px; line-height: 6px; }
	.fotos strong em { font-size: 12px; line-height: 12px; }

	h4, .p a, p, td, li, blockquote, cite, #aktuelles p + a, #aktuelles h4 + a, #aktuelles a[href^="index"], .fs13 { font-size: .8125em; }

	.index #mo, .index #bu, .index #tr, #aktuelles article p + a, .fs17 { font-size: 1.06em; }

	#de, #en, #fr, #fo, #kt, #im, .index #ko, footer p, .fs18 { font-size: 1.15em; }

	#ma-ma, #ma-le, #ma-re, div.g, div.h, .e, .benefit h4, .referenz h4, h5, .teaser div ~ a, .fs20 { font-size: 1.25em; }

	.fs21 { font-size: 1.3em; }

	h2, .fs28 { font-size: 1.75em; }

	.index #ak, .index #ma, div.img-large span, .fs30 { font-size: 1.875em; }

	h3, .fs35 { font-size: 2.1875em; }

	.fs40 { font-size: 2.5em; }

	#aktuelles h2, .fs48 { font-size: 3em; }

	p { line-height: 18px; }

	li, td { line-height: 150%; }

	/* Reset doppeltgemoppelte */

	td li, td h4, ul li h4 { font-size: 1em; }

	/* Font Colors ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	a { color: #005F9a; }

	.a a, .e a, .g a, .h a, #ak a, .o a, .p a, footer a, .teaser div ~ a, .benefit a, .referenz a, #aktuelles a { color: black; }
	#ak a:hover { color: #005F9a; }

	.orange-box, .orange-box a, .white { color: white; }

	.fotos em { color: #666666; }

	.o a, .p a { font-weight: bold; }

	/* box-sizing: border-box +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	.body, header, section, section > div, article, footer { 
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
	 }
	
	/* Page Layout ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	.ym-skiplinks a { background-color: #EEEEEE; padding: 15px; font-size: 1.2em; white-space: pre; }

	.ym-wrapper { width: 960px; margin: 0 auto; } /* wraps header, nav, section, footer */
	
		header { }
	
		nav { height: 200px; background-image: url(img/header-background.png); }
		.index nav { height: 120px; background-image: url(img/header-background+2-more-pipes-no-pics.png); }
	
		section { }

		.ym-grid { padding: 40px 28px 30px; }
		.ym-grid + .ym-grid { padding-top: 10px; } /* 2., 3. ... section */

				.ym-grid .ym-gl { padding: 0px 18px 12px 0; }
	
				.ym-grid .ym-gr { padding: 0px 0 12px 18px; }

			.orange-box { padding: 36px 26px; background-color: #FD6907; }

		article { position: relative; }
	
		footer { }
	
	/* Page Backgrounds +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	body { background: url(img/background.jpg) center top no-repeat, url(img/middle-background.jpg) center top repeat-x, url(img/back-background.png) center top; }
	
	.index section { background: url(img/index-background+white-circle.png) no-repeat; }
	
	/* FooterStick ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	html, body { height: 100%; }
	
	.ym-wrapper { min-height: 100%; position: relative; } /* Creates Stacking Context */

	section { min-height: 500px; }

	.index section { height: 860px; } /* incl. padding-bottom for footer */
	
		.ym-wrapper section.last-section { padding-bottom: 200px; }

	footer { position: absolute; bottom: 0; width: 100%; height: 200px; }
	
	/* Navigation +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	/*	nav a = link (for hover, focus; stretches to size of the containing li)
			nav a span = link text (with padding to reach size)
			nav strong = current, active page (same size as link a)
			nav a strong = link text AND active page (when 1st level menu item is a page on its own
			
			a = link, span = link text, strong = active page ++++++++++ all can be combined

			(strong: Re-activate the 1st level links which are proper pages themselves)

			hover und active nutzen unterschiedliche Hintergrundgrafiken, aber beide mit den gleichen Positionen, d.h. da werden nur die Bilder ausgetauscht

			Einige Menüpunkte haben in dt., en., franz. unterschiedliche Längen.
			Im head wird die Sprachvariable abgefragt und ggfs. die engl. oder franz. Textlänge über style-en.css oder style-fr.css überschrieben.
	*/

	nav ul, nav li { margin: 0; padding: 0; }
	
	nav li { position: absolute; list-style-type: none; text-align: center; white-space: nowrap; }
	
		nav li a { display: block; width: 100%; height: 100%; } /* Fills the containg li-element */

			nav li span { display: inline-block; }

		nav li strong { display: inline-block; font-weight: normal; /*outline: 2px dotted maroon;*/ }
		footer strong { font-weight: normal; }
			#de strong, #en strong, #fr strong { outline: none; }
		nav .c strong { display: block; }

	nav li a, footer a, .g a, .h a, .teaser div ~ a { text-decoration: none; }

		nav li a:hover, nav li a:focus, footer a:hover, footer a:focus, 
		#aktuelles a:hover, #aktuelles a:focus, #kontakt section a:hover, #kontakt section a:focus, 
		.fotos a:hover, .fotos a:focus, .g a:hover, .g a:focus, .h a:hover, .h a:focus
		.teaser a:hover, .teaser a:focus { /*outline: 2px dotted dimgray;*/ } /* Alle diese mit Handgezeichneten Rahmen ersetzen */

	/* (.a) (background) pic, additional text in white box when hovered (1st level nav at the top) + */

		.a a, .a strong { display: block; width: 100%; height: 100%; } /* fills the containing li area */

		.a span { background: white; padding: .2em .3em 0; position: relative; left: -32000px; top: -32000px; } /* text block */

		.a a:hover, .a a:focus { background-image: url(img/hover.png); }

		.a strong { background-image: url(img/active.png); }

		.a.active { z-index: 3; }
		.a:hover, .a:focus { z-index: 4; }

		#ho { left: 829px; top:   0px; width:  78px; height: 119px; }             #ho a { margin: -3px -5px; padding: 3px 5px; background-position: -200px -450px; } #ho strong { background: none; }
		#ma { left: 495px; top:  78px; width: 122px; height: 100px; } #ma strong, #ma a { margin: -3px -5px; padding: 3px 5px; background-position: 0 -500px; }
		#tr { left: 642px; top: 134px; width:  80px; height:  62px; } #tr strong, #tr a { margin:  0px; padding: 0px; background-position: -198px -498px; }
		#bu { left: 617px; top:  78px; width:  76px; height:  60px; } #bu strong, #bu a { margin: -5px 0px; padding: 5px 0px; background-position: -200px -500px; }
		#mo { left: 397px; top: 108px; width:  98px; height:  74px; } #mo strong, #mo a { margin: 0px; padding: 0px; background-position: -190px -495px; }
		#ko { left: 440px; top:  63px; width:  65px; height:  45px; } #ko strong, #ko a { margin: -8px -18px; padding: 8px 18px; background-position: -200px -500px; }

		#ho strong span, #ho a:hover span, #ho a:focus span { left: -50px; top:  60px; }
		#ma strong span, #ma a:hover span, #ma a:focus span { left:   0px; top:  85px; }
		#tr strong span, #tr a:hover span, #tr a:focus span { left: -30px; top:  50px; }
		#bu strong span, #bu a:hover span, #bu a:focus span { left: -30px; top: -21px; }
		#mo strong span, #mo a:hover span, #mo a:focus span { left: -70px; top:  20px; }
		#ko strong span, #ko a:hover span, #ko a:focus span { left: -66px; top:   0px; }

	/* (.b) (background) pic with text, (index page and 404 page) +++++++++++++++++++++++++++++++++ */

		.index a:hover, .index a:focus { background-image: url(img/hover.png); }
		.index #ak a:hover, .index #ak a:focus , .index #aktuelles a { background-image: none; }

		.index #ma { left: 562px; top: 370px; width: 270px; height: 208px; } .index #ma strong, .index #ma a { margin: -3px -5px; padding: 3px 5px; background-position: 10px -692px; }
		.index #tr { left: 444px; top: 578px; width: 160px; height: 124px; } .index #tr strong, .index #tr a { margin:  0px; padding: 0px; background-position: -301px -702px; }
		.index #bu { left: 640px; top: 236px; width: 166px; height: 124px; } .index #bu strong, .index #bu a { margin: -5px 0px; padding: 5px 0px; background-position: -500px -695px; }
		.index #mo { left: 350px; top: 360px; width: 212px; height: 161px; } .index #mo strong, .index #mo a { margin: 0px; padding: 0px; background-position: -696px -698px; }
		.index #ko { left: 490px; top: 274px; width: 130px; height:  88px; } .index #ko strong, .index #ko a { margin: -8px -18px; padding: 8px 18px; background-position: -982px -698px; }
		
		.index li#ma span { left: 116px; top: 142px; line-height: 35px; height: 35px; }
		.index li#tr span { left: 98px; top: 71px; }
		.index li#bu span { left: 58px; top: 108px; }
		.index li#mo span { left: -110px; top: 104px; }
		.index li#ko span { left: -45px; top: 45px; }
	
	/* (.c) text only (top row) ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

		.c a:hover, .c a:focus { background-image: url(img/hover.png); }
		.c:hover, .c:focus { z-index: 4; }

		#kt strong, #fo strong { background-image: url(img/active.png); }

		#kt { left:  739px; top:   0px; width:  90px; height:  50px; line-height: 50px; }                    #kt strong, #kt a { margin: -10px -7px; padding: 10px 7px; background-position: -0px 8px; }
		#fo { right: 221px; top:   0px; width: 130px; height:  50px; line-height: 50px; text-align: right; } #fo strong, #fo a { margin: -0px 0px; padding: 0px 0px; background-position: 30px -0px; }
			#fo span { padding-left: 15px; padding-right: 15px; } /* Fotolink rechtsbündig, weil unterschiedlich breit */
		#de { left:    0px; top:   0px; width:  90px; height:  50px; line-height: 50px; } #de a { margin: -10px -5px; padding: 10px 5px; background-position: -4px 8px; }
		#en { left:   90px; top:   0px; width:  76px; height:  50px; line-height: 50px; } #en a { margin: -20px -13px; padding: 20px 13px; background-position: -4px 18px; }
		#fr { left:  166px; top:   0px; width: 105px; height:  50px; line-height: 50px; } #fr a { margin: -10px -5px; padding: 10px 5px; background-position: -4px 8px; }

	/* (.d) text only (Aktuelles) */

		.index #ak { left:  40px; top: 470px; width: 230px; height: 170px; }
		.index #ak span { position: relative; left: 10px; top:  62px; background: none; }

	/* (.e) text in white box, additional frame when hovered (sub navigation, right hand side +++++ */

		.e { background: white; z-index: 2; }
		.e.active { z-index: 3; } /* Active li, containing strong */
		.e:hover, .e:focus { z-index: 4; }
		/* .e.hovered { z-index: 5; } class also for the jQuery script to foreground the hovered link */

		.e span { display: inline-block; padding: .2em .8em 0; }

		.e a:hover, .e a:focus { outline: none; background-image: url(img/hover.png); }
		.e strong { background-image: url(img/active.png); }

		                                    /* white box, link */     /* redo edge to fit handmade frame */ /* sprite position */
		#ma-ma { left: 802px; top: 254px; } #ma-ma strong, #ma-ma a { margin: -6px -4px; padding: 6px 4px; background-position: -0px -300px; }
		#ma-le { left: 822px; top: 294px; } #ma-le strong, #ma-le a { margin: -7px -4px; padding: 7px 4px; background-position: -0px -100px; }
		#ma-re { left: 802px; top: 334px; } #ma-re strong, #ma-re a { margin: -7px -0px; padding: 7px 0px; background-position: -0px -100px; }

		#tr-ag { left: 620px; top: 254px; }	#tr-ag strong, #tr-ag a { margin: -8px -0px; padding: 8px 0px; background-position: -900px -100px; }
		#tr-im { left: 600px; top: 294px; }	#tr-im strong, #tr-im a { margin: -7px 0px; padding: 7px 0px; background-position: -896px -300px; }
		#tr-co { left: 860px; top: 334px; }	#tr-co strong, #tr-co a { margin: -6px -4px; padding: 6px 4px; background-position: -0px -0px; }
		#tr-me { left: 840px; top: 374px; }	#tr-me strong, #tr-me a { margin: -7px 0px; padding: 7px 0px; background-position: -0px -100px; }

		#bu-bu { left: 790px; top: 254px; } #bu-bu strong, #bu-bu a { margin: -7px -4px; padding: 7px 4px; background-position: -0px -300px; }
		#bu-im { left: 730px; top: 294px; } #bu-im strong, #bu-im a { margin: -7px 0px -8px; padding: 7px 0 8px; background-position: -200px -300px; }
		#bu-an { left: 750px; top: 334px; } #bu-an strong, #bu-an a { margin: -7px -4px; padding: 7px 4px; background-position: -200px -300px; }

		#mo-ga { left: 740px; top: 254px; } #mo-ga strong, #mo-ga a { margin: -7px -4px; padding: 7px 4px; background-position: -200px -200px; }
		#mo-te { left: 658px; top: 294px; } #mo-te strong, #mo-te a { margin: -6px -4px; padding: 6px 4px; background-position: -500px -300px; }

		#ko-sc { left: 810px; top: 254px; } #ko-sc strong, #ko-sc a { margin: -7px 0px; padding: 7px 0px; background-position: -0px -200px; }
		#ko-po { left: 840px; top: 294px; } #ko-po strong, #ko-po a { margin: -7px -0px; padding: 7px 0px; background-position: -0px -0px; }

		#fo-mo { left: 810px; top: 354px; } #fo-mo strong, #fo-mo a { margin: -7px -2px; padding: 7px 2px; background-position: -0px -100px; }
		#fo-bu { left: 790px; top: 394px; } #fo-bu strong, #fo-bu a { margin: -7px 0px; padding: 7px 0; background-position: -0px -300px; }
		#fo-po { left: 810px; top: 434px; } #fo-po strong, #fo-po a { margin: -7px -8px; padding: 7px 8px; background-position: -0px -100px; }

	/* (.f) footer +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
		footer { background: url(img/sprite.png) no-repeat 10px -790px; }
	
		footer p { width: 100%; height: 100%; text-align: right; }
	
		footer a, footer strong { display: inline-block; width: 84px; margin-top: 110px; margin-right: 20px; padding: 20px; background-position: 0 -95px; }

		footer strong { background-image: url(img/active.png); }
		footer a:hover, footer a:focus { background-image: url(img/hover.png); }

	/* (.g) Teasers with pictures +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	.g { float: right; position: relative; }
	.ym-gr .g { float: left; }

	.g a { display: block; padding: .3em; }

		.g img { border: 5px solid white; display: inline-block; vertical-align: middle; }

		.g span {
			display: inline-block; min-width: 120px; height: 50px; padding: 5px 0 0 20px; 
			background: url(img/sprite.png) -1000px -78px; 
			white-space: pre; vertical-align: middle; 
		}

	/* (.h) Teasers with links, without pictures (portfolio) ++++++++++++++++++++++++++++++++++++++ */

	.h { float: right; position: relative; }
	.ym-gr .h { float: left; }

	.h a { display: block; padding: .3em; }

	.h span {
			display: inline-block; min-width: 120px; height: 28px; padding: 5px 0 0 20px; background: url(img/sprite.png); background-position: -1000px -100px; vertical-align: middle; }

	/* Elements +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	/* Heading black on white, on top corner of orange box */

	h2 { color: black; background: white; 
			display: inline-block; padding: .3em .5em .2em;
			position: absolute; left: 26px; top: -25px; }

	/* Heading in orange box */

	h3 {line-height: 44px; margin: 0 0 14px 0; }

	/* 2nd Heading in orange box */

	h4 { margin-bottom: 14px; }

	p { margin-bottom: 16px; }
	p:last-child { margin-bottom: 4px; }

	/* Graphics, Overlay, Sprites, set dimensions and position in html tag ++++++++++++++++++++++++ */

	.overlay 
		{ position: absolute; border: none !important; background: url(img/sprite.png); z-index: 1; }

	.zitat {
		float:left;
		position: relative; width: 280px; height: 200px;
		border: none !important;
		background-image: url(img/d-zitate-bellini-_-dickens-einstein-ford-luccock.png);
	}
	.zitat .bubble1 { width: 100%; height: 100%; position: absolute; background: url(img/sprite.png) -1700px -400px; }
	.zitat blockquote { display: none; }
	.zitat cite { position: absolute; left: 0; bottom: 0; }

	.bubble-1 { float: left; position: relative; width: 420px; height: 230px; background: url(img/sprite.png) -1700px -400px; }
		.bubble-1 blockquote { position: absolute; left: 75px; top: 45px; width: 250px; height: 130px; background-image: url(img/d-zitate-bellini-_-dickens-einstein-ford-luccock.png);}
			.bellini  { background-position: -0px;}
			.dickens  { background-position: -500px 3px;}
			.einstein { background-position: -750px;}
			.ford     { background-position: -1000px;}
			.luccock  { background-position: -1250px;}
	.bubble-1 cite { position: absolute; bottom: 30px; width: 100%; text-align: center; }

	/* Miscellaneous ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	cite { display: block; font-style: normal; text-align: right; }

	h2, h3, .pre { white-space: pre; }

	div.img-large { float: left; position: relative; margin-bottom: 54px; }

		div.img-large img[src] { border: 14px solid white; }

		div.img-large span { position: absolute; right: 14px; bottom: 14px; background: white; padding: .2em .3em 0; }
		.fotos a em { position: absolute; left: 6px; bottom: 0px; font-style: normal; }
		.fotos strong em { position: absolute; left: 12px; bottom: 0px; font-style: normal; } /* Angabe des Fotografen */

	.benefit { width: 379px; margin: 0 auto; }
	.benefit .top { background: url(img/sprite-sliding-door-frames.png) left top; height: 36px; }
	.benefit .mid { background: url(img/sprite-sliding-door-frames.png) left center repeat-y; }
	.benefit .bot { background: url(img/sprite-sliding-door-frames.png) left bottom; height: 24px; }

	.referenz { width: 399px; margin: 0 auto; }
	.referenz .top { background: url(img/sprite-sliding-door-frames.png) right top; height: 50px; margin-top: -20px; }
	.referenz .mid { background: url(img/sprite-sliding-door-frames.png) right center repeat-y; }
	.referenz .bot { background: url(img/sprite-sliding-door-frames.png) right bottom; height: 24px; }

	.mid ul { margin: -8px 30px 0; }
	.mid blockquote, .mid cite { margin-right: 30px; margin-left: 30px; }

	/* Shadows */

	div.img-large img[src], .fotos strong {											/* Schatten: schwarz, 25% Deckkraft, 6px Abstand, 13px breit, Überfüllen 0 */
		-webkit-box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.25);	/* WebKit */
		-moz-box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.25);		/* Firefox */
		box-shadow: 4px 4px 13px 0px rgba(0, 0, 0, 0.25);					/* Standard */ 
	}

	.g img, .fotos a {																/* Schatten: schwarz, 25% Deckkraft, 2px Abstand, 5p breit, Überfüllen 0 */
		-webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.25); /* WebKit */
		-moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.25); /* Firefox */
		box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 0.25); /* Standard */ 
	}

		/* Shadow behind white text boxes for better visibility on (white) background +++++++++++++++ */

	.a span,	.e {
		-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); /* WebKit */
		-moz-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); /* Firefox */
		box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.5); /* Standard */ 
		}

	/* Für den Teaser Lebenslauf, Workshops, Angebote zum Mitnehmen */

	.teaser { padding-top: 0; }
	.teaser .orange-box { padding: 12px; }
	.teaser p { margin: 4px 0 0; }
	.teaser div ~ a { display: inline-block; width: 80px; height: 30px; line-height: 28px; margin-top: 15px; padding-left: 12px; background: url(img/sprite.png) -800px -190px; }

	/* Individual Pages +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

	#index section > div {
		position: relative; left: 50px; width: 316px; height: 317px;
		background-image: url(img/sprite-orange.png);
		text-align: center;
		}
	#index section > div p { padding-top: 85px; line-height: 42px; white-space: pre; }
	#index section > div p + p { padding-top: 15px; }

	#error-404 section div { width: 500px; height: 317px; padding: 0 50px; }
	#error-404 section div p { line-height: 42px; white-space: pre; }

	#maja-mommert h3, #maja-ueber-maja h3, #lebenslauf .ym-gr h3, #businesstheater-und-schauspiel h3,
	#businesstheater h3, #improtheater-und-schauspiel h3, #angewandte-improvisation .ym-gr h3,
	#konzeption h3, #schwerpunkte h3 
		{ padding-top: 120px;}

	#moderation h3, #galas-events-tagungen h3, #teamsitzungen-kundenworkshops h3 { padding-top: 100px;}

	#portfolio .img-large { margin-bottom: 24px; }

	table td { vertical-align: top; }
		#kontakt table td { vertical-align: middle; }
		#lebenslauf table td { width: 84px; }
		#lebenslauf table td + td { width: auto; }
		#referenzen table { margin: 20px 100px 0 0; }
		#referenzen table td { padding-right: 20px; }
		#portfolio table td, #kontakt table td, #impressum table td { padding-right: 20px; }
		#impressum table td { padding-bottom: 10px; }
		#impressum table h4 { margin: 0;  }

	#trainings-workshops-coaching #main article, #angebote-fuer-agenturen-und-unternehmen #main article, #angebote-fuer-impro-ensembles-und-schauspieler #main article 
		{ padding-right: 140px; }		
	#trainings-workshops-coaching h3, #angebote-fuer-agenturen-und-unternehmen h3, 
	#angebote-fuer-impro-ensembles-und-schauspieler h3, #coaching h3 { margin-top: 14px; }

	/* Liste in der Lebenslauf-Tabelle */
	/* Ist nachträglich wieder aus dem Dienst genommen worden, jetzt alle Listen gleich */

	ul.l { list-style: none; margin: 14px 0 20px; }
	ul.l li { margin-left: 15px; position: relative; }
	ul.l li:before { position: absolute; left: -15px; content: "•"; font-size: 32px; }

	#impressum .ym-gr h3, #datenschutz .ym-gr h3, #kontakt .ym-gr h3 { margin-top: 68px; }

	#kontakt section a { display: inline-block; background: url(img/sprite.png); cursor: pointer; }
	#kontakt a#email { width: 218px; height: 49px; background-position: -900px 12px; }
	#kontakt a#xing { width: 45px; height: 49px; background-position: -928px -88px; vertical-align: middle; }
	#kontakt a#linkedin { width: 45px; height: 49px; background-position: -892px -88px; vertical-align: middle; }

	#fotos-portraits .orange-box, #fotos-businesstheater .orange-box, #fotos-moderation .orange-box { height: 430px;}

	.fotos { position: relative; height: 600px; padding: 0; } /* Containing Block */
	.fotos a, .fotos strong { display: block; background-color: white; position: absolute; }
	.fotos strong { width: 420px; height: 315px; padding: 12px; left: 140px; top: 130px; z-index: -1; /* hinter alle a */}
		.fotos a[href]      { width: 120px; height: 90px; padding: 6px; }
		/* Position der Links in den einzelnen Dateien festlegen, ggfs. auch Höhe und Breite neu festlegen, wenn sie vom vorgegebenen Querformat abweichen
		.fotos a[href$="01"] { left: 551px; top:  20px; }*/
	.fotos img { width: 100%; height: 100%; }

	/* (.p) Liste für Trainings, Workshops, Coaching; a: link, h4: no link but header, div: text */
	/* Ohne JavaScript wird die Karteireiter-Funktion durch display-styles erzeugt, die mit SSI 
			direkt im html-Element ein- und ausgeblendet werden;
			mit Javascript ... */
	/* Struktur: section.p div article (h4 a (div p))
			der erste article mit dem Einleitungstext bekommt height:0 direkt im Element */

	.p { position: relative; top: -4px; }

	.p article {
		position: relative; /* Containing Block für absolut positionierte divs */
		margin-left: 26px;
		width: 409px; height: 77px; /* Orange Graphics 409px x 77px */
		display: table; /* Prepare for vertical-align: middle */
		margin-bottom: -8px; /* Overlapping, zieht den nächsten li 8px hoch und drüber */
	}

	.p article > h4, .p a { display: table-cell; vertical-align: middle; padding: 0 50px 0 33px; }

	.p article > h4 { 																					/* 2 Backgrounds, from front to back */
		background: url(img/sprite.png) -1710px -870px,	/* Less-than-sign */
		url(img/sprite-orange.png) -400px 0px;					/* and the orange thing */
	}

	.p a { background: url(img/sprite.png) -1710px -770px; text-decoration: none; } /* Greater-than-sign */

	.p a:hover, .p a:focus { background-position: -1710px -870px; /* Less-than-sign */
		text-decoration: underline; /*outline: 2px dotted grey;*/ } 

	.p article:nth-last-child(n+2) a:after, .p article:nth-last-child(n+2) > h4:after { /* Alle außer letzter article */
		content: " ";
		display: block;	width: 409px; height: 5px; /* Fits in the negative margin */
		position: absolute; left: 0px; bottom: 3px; z-index: 1;
		background: url(img/sprite.png) -600px -297px;  /* Show horizontal rule */
	}

	.p article div { position: absolute; left: 444px; top: 0; width: 382px; } /* Inhalt */

	.p article:nth-last-child(1) div { top: auto; bottom: 0; } /* Untere article unten bündig plazieren */
	.p article:nth-last-child(2) div { top: auto; bottom: -68px; }
	.p article:nth-last-child(3) div { top: auto; bottom: -136px; }
	.p article:nth-last-child(4) div { top: auto; bottom: -204px; }
	.p article:nth-last-child(5) div { top: auto; bottom: -272px; }
	#angebote-fuer-impro-ensembles-und-schauspieler .p article:nth-last-child(6) div { top: auto; bottom: -330px; }

	.p article div p:last-child, .p article div ul:last-child { margin-bottom: 0; }

	/* Entwicklungsabteilung ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	/*nav li a, nav li strong, footer a { background-color: red; opacity: .5; }*/

}

@media print

{
body { font-size: 10pt; padding: 0 5px; }
h1,h2,h3,h4,h5,h6 { page-break-after:avoid; }
div, article { height: auto !important; }
div.overlay { display: none !important; }
.p > div > article > h4, .p > div > article a { display: none !important; }
.p > div > article > div { display: block !important; }
h2, h3, h4 { margin-top: 1em !important; }
a[href]:after { content:" <Link: "attr(href)">"; color:#444; background:inherit; font-style:italic; }
}