/*	
 *   HTML5 & CSS by Dominik Ogilvie / Avant La Lettre, (c) 2011.
 *   http://www.avantlalettre.ch 
 */
		

/*_____ Reset _____*/ 

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video  {
  margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }

/* HTML5 */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section  { display: block; } 
address  { display: inline; margin: 0; }


/*_____  Basics _____*/

html  { overflow-y: hidden; }

body  { font:16px/1.4 Times, "Times New Roman", Times, serif;  
	/* background: #fff url(http://www.smileycat.com/miaow/archives/images/misc/layout_grid.png) 
		no-repeat fixed top center;  */ } 
select, input, textarea, button  { font:99% sans-serif; }
a  { text-decoration: none; }

small, .small, aside, aside p, dd, dd li  { font-size: 13px; }
strong, b, th  { font-weight: 700; }

ul, ol  { margin-left: 2em; }
ol  { list-style-type: decimal; }
ul li  { list-style-type: square; }
nav ul, nav li  { margin: 0; list-style:none; list-style-image: none; }

table  { border-collapse: collapse; border-spacing: 0; }
td  { vertical-align: top; }

hr  { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
input, select  { vertical-align: middle; }
textarea  { overflow: auto; }

sub, sup  { font-size: 75%; line-height: 0; position: relative; }
sup  { top: -0.5em; }
sub  { bottom: -0.25em; }
.footnotes li a:rev  { display: none; }

h1, h2, h3, nav  { text-rendering: optimizeLegibility; }


/*_____  Erscheinung _____*/

/* header > div  { z-index: 1200;  position: absolute; margin: 0 auto;} */

/*  branding  */
#koordinaten  { position: fixed; top: 0px; right: 50%; width: 542px; margin-right: -271px; height: 650px; background: #fff url(/grafik/koordinaten.png) no-repeat scroll top center; padding-top: 10px;
	-moz-box-shadow: 5px 8px 22px #555; -webkit-box-shadow: 5px 8px 22px #555; box-shadow: 5px 8px 22px #555; z-index: 100; } /* 7px 10px 20px #777*/

header  { width: 540px; margin: 0 auto; padding: 0; /* border-top: 10px solid #f20; */
	background: #fff url(/grafik/kopf.png) no-repeat scroll top center; padding-top: 10px; }
header h1, #koordinaten h1, #koordinaten h2 i  { font-size: 16px; color: black; letter-spacing: 2px; text-transform: uppercase; }
header h2  { font-size: 21px; font-weight: normal; letter-spacing: 1px;  }
nav  { font-size: 14px; }
header h1, header h2, nav li a, #koordinaten h1, #koordinaten h2, #koordinaten h3  { width: 300px; border-bottom: 1px solid #f20; margin: 0 auto; text-align: center; }
nav li a  { text-align: left; padding-left: 93px; width: 300px; } /* faux-align: center */
header h1, #koordinaten h1  { height: 30px; line-height: 28px; letter-spacing: 0.25em; }
header h2  { height: 40px; line-height: 40px; font-weight: bold; }
#koordinaten h2, #koordinaten b  { font-family: Georgia, serif; font-weight: normal; font-size: 30px; letter-spacing: 0.12em !important; }
#koordinaten h2 i  { font-style: normal; font-size: 21px; }
#koordinaten h3  { padding-top: 0.5em; font-size: 13px; color: black; text-transform: uppercase; height: 94px; line-height: 24px; letter-spacing: 0.15em; border-color: black; } 
#koordinaten h3 b  { font-size: 16px; }
#koordinaten h3 strong  { font-size: 18px; margin: 0 2px;  }
#definition  { width: 440px; margin-left: 24px; padding: 1.5em 0 1.5em 24px; text-indent: -24px; 
	font-size: 20px; line-height: 1.2em ; }
	
#links, #rechts  { width: 245px; float: left; font-size: 12px; line-height: 13.5px; float: left;  }
#links  { margin-left: 20px; }
#rechts  { margin-left: 10px;  }
#koordinaten div p  { margin-bottom: 1em; text-indent: -24px; margin-left: 24px; }
#koordinaten em  { font-style: italic; }


/*  1/3/6/12 spalten  */
.scrollspalten
	{ width: 100%; margin: 0 auto; position: absolute; top: 172px; left: 0px; right: 0px; bottom: 0px; }
.scrollspalten > *  { float: left; height: 100%; border-right: 1px solid black; margin-left: -1px !important; 
	overflow-y: scroll; overflow-x: hidden;  }
.scrollspalten div > *, .scrollspalten article > *  { margin-left: 20px;  text-align: left; width: 88%;  }
footer  { clear: both; }

#scroll-12er > div  { width: 8.333%; } 
#scroll-3er > *  { width: 33.333%; }
#scroll-3er > div > *, #scroll-6er > article > *   { /* padding-left: 4%; */ }
#scroll-6er > *  { width: 16.666%; }
#scroll-6er div > *, #scroll-6er article > *   { /* padding-left: 4%; */ }

#scroll-12er div *  { width: 200px;  } /* provisorisch */

#scroll-1er  { overflow-y: scroll; z-index: -10; }
#scroll-1er > *, #schrift  { text-align: left; overflow: visible; border-right: none; }
#scroll-1er article  { float: left; width: 66%;  }
#schrift  { float: right; width: 46.5%; margin: 0 0 0 1.5%;  }
#portraitbild  { float: left;  width: 45%; margin: 0 1.5% 0 3%; padding-top: 42px;  }
aside#bildspalte  { float: right; width: 30%; margin: 0 2% 0 1%;  padding-top: 42px;}
#schrift h1  { display: none; }
#schrift *  { margin-left: 0; margin-right: 0; width: 95%; }
#rubriktitel-1er  { display: block; clear: both; margin: 18px auto;  padding: 0 0 0.8em 1em; width: 712px; 
height: 16px; 
	background: #fff url(/grafik/spaltentitel.png) no-repeat scroll 3px -8px;
	font-size: 13px; color: #333; letter-spacing: 1px; text-transform: uppercase; }

#scroll-3er embed, #scroll-3er object, #scroll-3er iframe  { margin: 0.6em 0 0.6em -32px; width: 103%; }
#scroll-3er object embed  { margin: 0; width: 100%; }


#schrift, #bildspalte, #portraitbild  { /* border: 1px dotted powderblue; */ }


/*  in spalten  */

hr  { margin-bottom: 1em; border-color: #fff; }

h1.spaltentitel  { margin: 20px 0 12px 8px !important; padding: 0 0 0.8em 1em !important; width: 90% !important;
	background: #fff url(/grafik/spaltentitel.png) no-repeat scroll 3px -8px;
	font-size: 13px; color: black; letter-spacing: 1px; text-transform: uppercase;
	/* position: absolute; width: 6.33%; height: 16px;  overflow: hidden !important; */  
	position: absolute; top: -20px;  width: 29% !important; height: 14px !important; overflow: hidden !important; line-height: 19px; }

#scroll-6er h1.spaltentitel  { width: 12% !important;  }
div#scroll-12er div h1  { width: 4.5% !important;  }

.scrollspalten h1 + *  { padding-top: 42px; }
.scrollspalten h1 + a + a  { padding-top: 42px; }
.scrollspalten h2, .ticker *  { font-size: 24px; text-transform: uppercase; line-height: 1em; font-weight: normal !important; }
.scrollspalten article p  { text-indent: 32px; font-weight: bold; line-height: 1.2em }

p + p.noch-keine-besucher  { display: none; }

/*  text-markup  */
article strong  { border-bottom: 1px solid #444; }
article h3  { margin: 0.8em 0 0 0; text-transform: uppercase; text-transform: uppercase; font-weight: bold;  }
article h3 + p  { text-indent: 0px !important; }
#zusatz article h3  { margin-bottom: 0.3em; font-weight: normal; line-height: 1.2em; margin-top: 30px; }
#zusatz article h1.spaltentitel + h3  { margin-top:12px !important; }
i  { font-family: "Times New Roman", serif; font-style: italic; font-weight: normal; }
.silben span  { margin-right: 0.2em; padding-right: 0.2em; border-right: 0.12em solid #999; }
header a:hover span  { border-color: #F48E80; }
header h2 span  { margin-right: 0.3em !important; }
article p.aside  { font-style: italic; font-weight: normal; text-indent: 0px; } /* Autorzeile */
time  { font-style: normal; font-family: Georgia, serif !important; font-size: 0.96em;   }
ins  { text-decoration: none; font-weight: normal; }
/* .caps { letter-spacing: 1px; font-size: 0.96em; } */

/* zufalls-inhalte */
#scroll-6er p  { margin: 1em 20px; }
#scroll-6er p img  { width: 120%; min-width: 200px; height: auto; }
p.menschen-keinbild a  { font-size: 14px; text-transform: uppercase; text-align: center; border: 2px solid #333; color: #333; padding: 5px 2px !important;  font-weight: normal; display: block; width: 91%;  }


#scroll-12er div *  { width: 150%; margin-bottom: 10px !important; }
#scroll-12er div img  { width: 140%; height: auto; }
#scroll-12er div p  { line-height: 1.12em;  }
/* #scroll-12er div a  { color: #333; } */
.tags-12er	  { font-size: 14px; text-transform: uppercase; text-align: left; border: 2px solid #333; color: #333; padding: 5px 1em !important;  font-weight: normal; white-space: nowrap; overflow-x: visible; }

#scroll-12er embed, #scroll-12er iframe, #scroll-12er video, #scroll-12er object { display: none !important; }


/*_____  Medienobjekte _____*/

img#portrait  { width: 88%; height: auto; margin: 0 6%; padding-bottom: 1.5em; }
#portraitbild ul.artikel  { width: 87%; }

#bildspalte a  { float: left;  width: 42%;  text-transform: none; margin: 0 0 20px 6%; }
#bildspalte img  { width: 100%; height: auto;  }



#bildspalte  {
	font-size: 13px; line-height: 1.5em; 
    counter-reset: chapter;      /* Create a chapter counter scope */
}
#bildspalte a:after  {
    content: "[Abb. " counter(chapter) "]";
    counter-increment: chapter;  /* Add 1 to chapter */
}




/*_____  Links _____*/

a  { color: #f20; text-decoration: none; }
header a, nav a, a.schwarz  { color: black; }
#verweise  { position: fixed; top: 40px; left: 2%; margin: 0; padding: 0; }
#verweise li  { display: inline; list-style: none; }
#verweise img  { width: 46px; height: 56px; }
ul.mediakit  { list-style: none;   margin: 0 auto !important; width: 280px; }
ul.mediakit li  {  display: inline;  }
ul.mediakit li a  { padding-left: 94px; min-height: 110px; display: block; width: 210px; 
	background: white url(/grafik/icon-pressemappe.png) no-repeat scroll -6px -4px; }
ul.flyer li a  { min-height: 90px; background: white url(/grafik/icon-flyer.png) no-repeat scroll -6px -6px; }
	

/*_____  Listen _____*/

article > ul, article > div > ul  { margin-left: 1.2em !important;  }
article > ul > li, article > div > ul > li  { list-style: square; padding-left: 0.3em; font-weight: bold; }

li a time, .ticker time  { color: #f20; }
li time, dd time  { float: right; margin-bottom: 0.3em;  }
ul.artikel li  { clear: both; border-top: 1px solid #555; line-height: 18px; padding: 0.1em 0.2em 0.3em 0.2em; text-transform: uppercase; list-style: none;  }

ul.addendum  { margin-top: 0.7em; margin-bottom: 1.4em }
ul.addendum li  { clear: both; border-top: 1px solid #555; line-height: 18px; padding: 0.1em 0.2em 0.3em 0.2em; text-transform: uppercase; list-style: none; text-transform: none; font-weight: normal;  }
ul.addendum li a:first-child  { font-weight: bold }
ul.addendum li a + a, ul.addendum li a:last-child  { float: right; color: #f20; margin-left: 3.5%; }

div li a, ul.artikel li a  { color: #333 ; }
div dd  { line-height: 18px; }

section.ticker *  { display: inline; margin: 0; }
section.ticker article  { margin: 0 0.2em 0 0; } /* :after content: "\00A0 " */

ul.liste-menschen li  { list-style: none; }
ul.liste-menschen li, .liste-menschen ul li a  { font-size: 14px; line-height: 1.2em; text-transform: uppercase; }
ul.liste-menschen > li  { color: #f20; margin-top: 1em; padding: 0.2em 0 1em 0; margin: 0.2em 0; 
	border-top: 1px solid #f20;  font-weight: bold; letter-spacing: 1px; }
ul.liste-menschen ul  { margin: 0; padding: 0; width: 250px; }
ul.liste-menschen ul li  { border-top: none !important; padding: 0; font-weight: normal; letter-spacing: 0px; }

dl.liste-abc dt  { color: #f20; padding: 0 0.2em; }
.liste-abc dd + dt  { margin-top: 1em; } 
.liste-abc dd  { font-size: 16px;  color: #333; text-transform: uppercase; border-top: 1px solid #555; clear: both; }
.liste-abc dd a  { color: #333; }

dl.tags  { margin-top: 1.5em;  }
.tags *  { font-size: 14px; text-transform: uppercase; text-align: right;  }
.tags dt  { }
.tags dd  { border: none; display: block;  }
.tags dd a  { color: #f20; }

#fabrikate ul.artikel li time  { float: left; margin-right: 0.5em; } 
#fabrikate ul.artikel li  { text-align: right; } 

blockquote p { text-indent: 0 !important; margin-left: 32px; }

/*_____  Navigation _____*/

article h2 a  { color: #111; }

a:hover  { color: #E91D00 ; } /* f20 > 600, 1v6; od. 1v10 > sw:	 #E81F00 */

nav li  { display: inline; }
nav li a  { display: block; text-align: center; text-transform: uppercase; letter-spacing: 1px; padding: 2px 0 0px 0; }
nav li a i  { text-transform: none; letter-spacing: 0px; }