/* It's always darkest right before it becomes totally black! John McCain */

html, body, div, span, 
h1,  h2, h3, h4, h5, h6, h7, 
p, a, q, font, img, b, u, i, center,
em, strong, dfn, blockquote, cite, abbr, acronym, strong, address,
ul, ol, li, dl, dd, dt, table, th, tr, td

{
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	font-weight: inherit;
	font-family: inherit;
	font-style: inherit;
	}
	
html[lang="de"] q { quotes: "" "" }
dl, dd, dt, ul, li { font-style: normal; }

ul, ol { list-style: none; padding: 0; margin: 0; }
::selection { background: #34302F; color: #fff; /* Safari */ }
::-moz-selection { background: #34302F; color: #fff; /* Firefox */ }

body {
	-x-system-font: none;
	color: #fff;
	background: #000;
	font-family: Arial, Helvetica, Geneva, sans-serif;
	font-size: 1.0em;
	line-height: 1.625;
	font-weight: normal;
	font-variant: normal;
	font-style: normal;
	margin: 0;
	}
	
#grid {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: url(grid.png) no-repeat;
	z-index: 1;
	}
	
	

/* ----------------- (1) CONTENT LAYOUT ---------------------- */
	
#page { font: inherit inherit inherit inherit inherit inherit; } /* Architektur wird in Short und Long festgelegt */
				
	
			/* ---- HEADLINES ---- */
			
			
			/* Inline-Label-Überschriften */
				#page .article h2.label, #page .article h3.label {
					display: inline;
					font-size: 0.875em; /* 14px */
					font-family: inherit;
					font-weight: normal;
					font-style: normal;
					text-transform: uppercase; 
					letter-spacing: 1px; 
					background: #f0f0f0; 
					padding: 0px 3px;
					color: #000;
					margin-right: 4px;
					}
							
					#page .article h2.label + p { display: inline; }
					#page .article h3.label + p { display: inline; }
					
						
						body.eng #page .article h2.label, body.eng #page .article h3.label,
						body.wide #page .article h2.label, body.wide #page .article h3.label
						{ padding: 4px 6px 3px 6px; }
						/* Vergrößert Labelpadding wegen größerer Schrift in Langen Dokumenten */
						
			
			/* Blog-Überschriften */
				#page .article h2.blog, #page .article h3.blog {
					clear: both;
					float: none;
					display: block;
					height: 50px;
					width: 100%;
					background: #000 url(../imgnew/h2-blog-separator.png) no-repeat top center;
					font-family: inherit;
					font-weight: bold;
					font-style: normal;
					color: #fff;
					}
					
					#page .article h2.blog { font-size: 1.375em; line-height: 1.875; margin: 100px 0 0 0; padding: 25px 0 0 0; }
					#page .article h3.blog { font-size: inherit; line-height: inherit; margin: 50px 0 0 0; padding: 0; }
						
			
			/* Blog-Überschriften mit Swift */
				#page .article h2.swift {
					font-family: Cambria, Georgia, 'Palatino Linotype', Palatino, Book Antiqua, Times New Roman, serif;
					display: block;
					height: auto;
					width: 100%;
					text-align: center;
					background-position: center 50px;
					background-repeat: no-repeat;
					background-color: #000;
					margin: 0 0 0 0;
					padding: 220px 0 15px 0;
					font-size: 2.0em;
					line-height: 1.875;
					font-weight: normal;
					font-style: normal;
					color: #fff;
					}
					
					#page .article h2.swift:before { content: url(../imgnew/typo/threefold-open.png); padding-right: 2px; }
					#page .article h2.swift:after { content: url(../imgnew/typo/threefold-close.png); padding-left: 3px; }

					.swift-1 { background-image: url(../imgnew/typo/swift1.png); }
					.swift-2 { background-image: url(../imgnew/typo/swift2.png); }
					.swift-3 { background-image: url(../imgnew/typo/swift3.png); }
					.swift-4 { background-image: url(../imgnew/typo/swift4.png); }
					.noswift { background-image: none; padding-top: 0; }


			
			
			/* ---- FLIESSTEXT ---- */
			
			#page .article p { voice-family: male; }
			#page .article p:selection { color: fc0; }
				#page .article p.force { clear: both; float: none; margin-top: 1.375em; text-indent: 1.0em; }
			
				
				#page .article h2 + p { text-indent: 0em; margin-top: 1.375em; }
					
				#page .article p + p { 
					margin-top: 1.375em; /* identisch zur Zeilenhöhe */
					text-indent: 1.0em; /* identisch zur Zeichengröße */
					}
					
				#page .article ul + p { 
					margin-top: 1.375em; /* identisch zur Zeilenhöhe */
					text-indent: 0; /* Kein Geviert nach Aufzählung */
					}
					
				#page .article p.colophon:after {
					content: "\2766";
					font-size: 1.875em;
					padding-left: 10px;
					float: right;
					position: relative;
					top: 15px
					}
					
					#page .article p.noindent { text-indent: 0; }
	
			#page .article ul { 
				list-style: none;
				margin: 19px 16px 0 16px;
				}
				
				#page .article ul li {
					display: list-item;
					line-height: inherit;
					}
					
					#page .article ul li a { font-style: inherit; border-bottom: 1px dotted #fff; color: #fff; }
					#page .article ul li a:hover { color: #c00; }
					#page .article ul li:hover:before { content: "\25B6"; color: #900; margin-right: 3px; margin-left: -16px; }
			
			#page .article .label { 
				font-size: 0.8125em; 
				text-transform: uppercase; 
				letter-spacing: 1px; 
				background: #900; 
				padding: 2px 4px 3px 4px; 
				color: #fff; 
				}

				

				
				
				

/* ----------------- (2) META & CITE ---------------------- */

	/* Doppelte Anführungszeichen */
	blockquote, cite { font-style: normal; volume: medium; }
		q.dq:before, blockquote:before, cite:before { content: "\00BB"; padding-left: 2px; padding-right: 1px; }
		q.dq:after, blockquote:after, cite:after { content: "\00AB"; padding-left: 1px; padding-right: 2px; }
						
	
	/* Einfache Anführungszeichen */
	.meta { font-style: normal; volume: loud; }
		.meta:before { content: "\203A"; padding-right: 1px; }
		.meta:after { content: "\2039"; padding-left: 1px; }
		
	/* Kursives Auszeichnen ohne Anführungszeichen */
	q, q abbr { font-style: italic; volume: loud; }
		q:before { content: ""; }
		q:after { content: ""; } /* Ergänzt Thinspace */
	
	q.male1, q.male2, q.male3, q.female1, q.female2, q.female3 { font-style: normal; volume: medium; }
	q.male1:before, q.male2:before, q.male3:before, q.female1:before, q.female2:before, q.female3:before { content: "\00BB"; padding-left: 2px; padding-right: 1px; }
	q.male1:after, q.male2:after, q.male3:after, q.female1:after, q.female2:after, q.female3:after { content: "\00AB"; padding-left: 1px; padding-right: 2px; }


	

/* ----------------- (3) TYPOGRAPHIE ---------------------- */

	dfn, em, strong, address, abbr { font-style: normal; font-weight: normal; }
	
	.kursiv { font-style: italic; }
	.bold { font-weight: bold; }
	.stoke { text-decoration: line-through; }
	.markee { background: #FF6; padding: 1px 3px; }
		
	.parenthesis { }
		.parenthesis:before { content: "\2014\200B"; padding-right: 0.25em;  }
		.parenthesis:after { content: "\200B\2014"; padding-left: 0.25em;  }


				
/* ----------------- (4) GLOBALE LINKS ---------------------- */					
	
a { outline: 0; text-decoration: none; font-style: normal; color: #fff; }


	/* Linkskennzeichnung */
	
		.article p a:after { 
		font-size: 0.8725em;
		font-family: inherit;
		text-transform: uppercase;
		font-weight: normal;
		margin-left: 3px;
		} /* Formatierung gilt für alle Linkzusätze, auch wenn sie leer sind */
	
		.article p a[href^="http:"]:after { content: "(ext)"; }
		.article p a[href^="http://www.daniel"]:after { content: ""; }
		.article p a[href$=".pdf"]:after { content: "(pdf)"; }
		.article p a[href*="photography/"]:after { content: "(bild)"; }
		
		.article p a[href*="stockholm/touren"]:after, .article p a[href*="stockholm/sightseeing"]:after, 
		.article p a[href*="stockholm/dndd"]:after, .article p a[href*="stockholm/dke"]:after, .article p a[href*="stockholm/dft"]:after,
		.article p a[href*="stockholm/dzt"]:after, .article p a[href*="stockholm/places"]:after { content: "(bild)"; }
		

	
	/* Inlinelinks */
	.article a.inline { font-style: inherit; border-bottom: 1px dotted #fff; color: #fff; }
		.article a.inline:hover { color: #c00; }
						
			/*Span-Tooltip für Inlinelinks */
			.article a.inline span { 
				display: none;
				padding: 5px 8px 6px 12px; 
				margin-left: 5px;
				width: auto;
				max-width: 200px; 
				font-size: 1em; 
				line-height: 1.125; 
				font-family: inherit; 
				}
				
					.article a.inline:hover span { 
						display: inline; 
						position: absolute; 
						text-indent: 0px; 
						background: #900; 
						color: #fff; 
						-moz-box-shadow: 0px 0px 100px #c00; 
						-khtml-box-shadow: 0px 0px 100px #c00; 
						-webkit-box-shadow: 0px 0px 100px #c00;
						box-shadow: 0px 0px 100px #c00;									
						}
				
				
	/* Buttonlinks */
	a.button { 
		font-size: 0.75em;
		font-family: Arial, Helvetiva, Tahoma, sans-serif;
		text-transform: uppercase;
		letter-spacing: 1px;
		margin: 10px;
		padding: 1px 6px;
		border: 0;
		color: #000;
		background: #fff;
		-moz-border-radius: 3px;
		-khtml-border-radius: 3px;
		-webkit-border-radius: 3px;
		}
					
		a.button:hover { background: #900; color: #fff; -webkit-transition: color 1s linear; -webkit-transition: background 1s linear; }
						
			/*Span-Tooltip für Buttonlinks */
			a.button span { 
				display: none;
				padding: 4px 0 0 0; 
				margin-left: 10px;
				width: auto;
				max-width: 200px; 
				font-size: 0.875em; 
				line-height: 0.9375; 
				font-family: inherit;
				text-transform: none;
				letter-spacing: 0px;
				}
							
				a.button:hover span { 
					display: inline; 
					position: absolute;
					margin-top: 3px; /* Richtet Span zu Buttom aus */
					text-indent: 0px; 
					background: #000; 
					color: #fff;
					-moz-box-shadow: 0px 0px 0px #000; 
					-khtml-box-shadow: 0px 0px 0px #000; 
					-webkit-box-shadow: 0px 0px 0px #000;
					box-shadow: 0px 0px 0px #000;	
					}
				

				
				
						
/* ----------------- (5) NAVIGATION ---------------------- */	
	
	#path, #nav {
		position: absolute;
		height: 20px;
		width: auto;
		background-color: #fff;
		color: #000;
		font-size: 0.875em;
		font-family: inherit;
		z-index: 9999;
		}
	
		#path { 
			top: 0; 
			right: 0; 
			text-align: right;
			-moz-border-radius-bottomleft: 5px;
			-khtml-border-radius-bottomleft: 5px;
			-webkit-border-radius-bottomleft: 5px;
			padding: 0 20px 6px 10px; 
			}

		#nav {
			bottom: 0;
			left: 0;
			text-align: right;
			-moz-border-radius-topright: 5px;
			-khtml-border-radius-topright: 5px;
			-webkit-border-radius-topright: 5px;
			padding: 2px 10px 6px 15px;
			}
			
		
			#path ul, #nav ul {
				list-style: none;
				padding: 0;
				margin: 0;
				}
			
				#path ul li, #nav ul li { display: inline; }
				
					#path ul li:last-child { font-weight: bold; } /* Aktuelle Seite fett */
				
				
						/* Spezifische Eigenschaften */
					
						#path ul li.second:before {
							content: ">";
							padding-right: 9px;
							font-size: inherit;
							font-weight: bold;
							} /* Nichterste Items haben Pfeil */
						
						#path ul li#home:before {
							content: "\2605";
							padding-right: 5px;
							font-size: inherit;
							} /* Root-Item Home hat Stern */
						
						#nav ul li:after {
							content: "\2605";
							padding-left: 5px;
							font-size: inherit;
							}
							
							#nav ul li:last-child:after { content: ""; } /* Letztem Kind folgt kein Stern */
						
						
						/* Linkeigenschaften */
						
						#path ul li a, #nav ul li a {
							text-decoration: none;
							color: #000;
							}
							
							#path ul li a { margin-right: 2px; }
							#nav ul li a { margin-left: 4px; }
						
							#path ul li a:hover, #nav ul li a:hover {
								border-bottom: 1px solid #000;
								background: #fff;
								}
						
						/* Tooltip */
						
						#path ul li a .tip, #nav ul li a .tip { display: none; }
									
									
							#path ul li a:hover .tip, #nav ul li a:hover .tip {
								display: inline;
								position: absolute;
								left: 0px;
								color: #fff;
								text-align: left;
								font-family: inherit;
								font-size: 0.8725em;
								padding: 3px;
								margin-left: 15px;
								background: transparent;
								}	

									#path ul li a:hover .tip { 
										top: 38px; 
										background: rgba(70, 180, 193, 0.2);
										-moz-box-shadow: 0px 0px 100px #46B4C1; 
										-khtml-box-shadow: 0px 0px 200px #46B4C1; 
										-webkit-box-shadow: 0px 0px 200px #46B4C1;
										box-shadow: 0px 0px 100px #46B4C1;
										}
										
											#path ul li:last-child a:hover .tip { font-weight: normal; }
											
									#nav ul li a:hover .tip { 
										top: -40px;
										background: rgba(153, 0, 0, 0.2);
										-moz-box-shadow: 0px 0px 100px #c00; 
										-khtml-box-shadow: 0px 0px 200px #c00; 
										-webkit-box-shadow: 0px 0px 200px #c00;											
										box-shadow: 0px 0px 100px #c00;
										}
						
	
		
		
/* ----------------- (6) JS Tooltip ---------------------- */	


	div#qTip {
			padding: 5px;
			border: 0;
			display: none;
			background: #000;
			color: #fff;
			font-size: 0.75em;
			line-height: 1;
			font-family: inherit;
			text-align: left;
			position: absolute;
			z-index: 1000000;
			width: 200px;
			-moz-border-radius: 3px;
			-khtml-border-radius: 3px;
			-webkit-border-radius: 3px;
			-moz-box-shadow: 0px 0px 20px #000;
			-khtml-box-shadow: 0px 0px 20px #000;
			-webkit-box-shadow: 0px 0px 20px #000;
			}
		
	
		
/* ----------------- (7) Styles ---------------------- */	

	.dropshadow {
		-moz-box-shadow: 3px 3px 7px #000;
		-khtml-box-shadow: 3px 3px 7px #000;
		-webkit-box-shadow: 3px 3px 7px #000;
		-o-box-shadow: 3px 3px 7px #000;
		}
	
	.borderradius {
		-moz-border-radius: 3px;
		-khtml-border-radius: 3px;
		-webkit-border-radius: 3px;
		}
	
	/* Ausrichtung */
	.floatleft { float: left; }
	.floatright { float: right; }
	.clear { clear: both; float: none; }
	.left { text-align: left; }
	.right { text-align: right; }
	.center { text-align: center; }
	.noindent { text-indent: 0; }
	.margintop50 { margin-top: 50px; }
	.marginbottom50 { margin-bottom: 50px; }
	.paddingtop50 { padding-top: 50px; }
	.displayinline { display: inline; }
	.displayblock { display: block; }

	/* colors */
	.blau { color: #036; }
	.bg-blau { background-color: #036; }
	.rot { color: #900; }
	.bg-rot { background-color: #c00; }
	.hellrot { color: #036; }
	.bg-hellrot { background-color: #c00; }
	.gelb { color: #fc0; }
	.bg-gelb { background-color: #fc0; }
	.weiss { color: #fff; }
	.bg-weiss { background-color: #fff; }




/* ----------------- (8) Aural ---------------------- */	

	.male1 { voice-family: male; azimuth: center-left; }
	.male2 { voice-family: male; azimuth: right; }
	.male3 { voice-family: male; azimuth: left; }
	.female1 { voice-family: female; azimuth: left; }
	.female2 { voice-family: female; azimuth: right; }
	.female1 { voice-family: female; azimuth: center; }
	.child { voice-family: child; azimuth: right; }
	
	abbr { voice: spell-out; }
	em, strong, .meta, .kursiv, .bold { stress: 75; }
	
	

	
/* ----------------- (9) Pageflip ---------------------- */	

#flip {
	position: absolute;
	right: 0; 
	top: 0;
	float: right;
	z-index: 5;
	}
	
	#flip img {
		width: 50px; height: 52px;
		z-index: 99;
		position: absolute;
		right: 0; 
		top: 0;
		-ms-interpolation-mode: bicubic;
		display: block;
		}
		
	
	
	#flip .hidden {
		width: 50px; height: 50px;
		overflow: hidden;
		position: absolute;
		right: 0; top: 0;
		background: url(../imgnew/hidden-trans.png) no-repeat right top;
		}