/* "Back of man... I am a scientist"
Author: Moritz Limanski / www.portnull.de
------------------------------------------------------------------------*/


/* $BASIC
------------------------------------------------------------------------*/
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	line-height: 1.5em;
	color: #303030;
	padding:0;
	margin: 0 0 20px 0;
	background: #E9E6DD url("gfx/bg_body.jpg") top center repeat-x;}
	
div#wrapper {
	width: 1002px;
	padding: 0 0 0 18px;
	margin: 0 auto;}
	

a#bklogo {
	display: block;
	height: 66px;
	width: 200px;
	background: url("gfx/logo.png") top left no-repeat;}
	
div#logo {
	margin: 14px 0;}
		

/* $TYPO & $COLORS
------------------------------------------------------------------------*/
h1,h2,h3,h4,h5,h6 {padding: 0; margin: 0;}

h1, h2, h3 {
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica;
	text-transform: uppercase;}

h1 {
	font-size: 2em;
	letter-spacing: -1px;}	

h2 {
	text-align: left;
	font-size: 1.6em;
	letter-spacing: -1px;
	margin: 12px 0 0;
	text-shadow: 1px 1px 1px #ccc;}
body#index h2 {margin: 6px 0 0;}
h2 a:link, h2 a:visited {color: #2d2d2d;}
h2 a:hover, h2 a:active {color: #666;}


h3 {
	font-size: 1.3em;
	text-shadow: 1px 1px 1px #ccc;}
h3.subheadline {
	clear:left;
	margin: 8px 0 4px 0;}
	

h4 {
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica;
	font-size: 1.1em;
	margin: 8px 0 0;}
div.mbox h4 {
	margin: 8px 0 0 6px;}
	

a:link, a:visited {
	color:#666;
	text-decoration: none;}
a:hover, a:active {
	color: #dcbb36;}

a img { border:0;}
	
p {
	margin: 4px 0 0 0;
	padding: 2px 0 6px 0;}
	
p.credits {
	font-size: .9em;
	color: #666;
	margin: 0 0 0 8px;
	padding: 2px 6px;}
	
q {
	display: block;
	color: #333;
	background: #f8f6f0;
	padding: 4px 4px 4px 8px;
	border-left:4px solid #d2d0c3;}

ol, ul, li {
	padding: 0;
	margin: 0;}


.sleft {
	float: left;
	text-align: left;
	padding: 0 0 2px 18px;
	width: 48%;}
.sright {
	float: right;
	text-align: right;
	padding: 0 18px 2px 0;
	width: 48%;}


/* $CONTENT
------------------------------------------------------------------------*/
div#content {
	float: left;
	background: url("gfx/bg_content.gif") top right repeat-y;}
div#teasercontent {
	float: left;}
	
	
div#page,
div.teaserpage {
	float: left;
	width: 610px;
	font-size: 1.2em;
	padding: 0 18px 0 12px;
	background: #fff;}


div#sidebar,
div.teaserbar {
	float: right;
	width: 344px;
	font-size: 1em;
	margin: 0 18px 0 0;
	background: #d2d0c3;
	display: inline;}


	
/* $MBOX
------------------------------------------------------------------------*/
div.mbox {
	float: left;
	font-size: 1.2em;
	line-height: 1.4em;
	width:316px;
	border-top:2px solid #666;
	padding: 0 0 6px 0;
	margin: 10px 18px 18px 0;
	background: #fff;
	display: inline;}
div.mbox.list {padding: 0;}



div.mbox p {
	padding: 2px 8px;}

div.boxhead {
	height: 20px;
	padding: 10px 0 7px 8px;
	border-top:1px solid #837e61;
	border-bottom:1px solid #aba483;
	background: #dcbb36;}
	
div.boxhead h2 {
	display: inline;
	font-size: 1.5em;
	color: #303030;
	padding: 3px;
	border-bottom: 1px solid #666;
	background: #fff;}


/* $LISTS
------------------------------------------------------------------------*/		
div.mbox ul {font-size: 1.1em;}

ul.links li {
	list-style:none;
	color: #2e2c1f;
	padding: 0;
	margin: 0;}
	
/* FUCK YOU IE */ * html ul.links li {display: inline;}	
		
ul.links a {
	display: block;
	font-size: 1.1em;
	padding: 8px 0 8px 10px;
	margin: 0;
	border-top: 1px solid #d2d0c3;
	border-bottom: 1px solid #999;
	background: #fff url("gfx/list_arrow_0.gif") 288px 7px no-repeat;}
ul.links a:hover {
	color: #333;
	background: #fff url("gfx/list_arrow_1.gif") 288px 7px no-repeat;}
ul.links li:first-child a {
	border-top:none;}
	

div.txt ol,
div.txt ul {
	padding: 0 0 0 24px;
	margin: 6px 0;}
	
div.txt ol li,
div.txt ul li {
	margin: 4px 0;}

div.txt ol li {list-style-type: decimal;}
div.txt ul li {list-style-type: disc;}	
	
	
	
/* $PAGE
------------------------------------------------------------------------*/
div#page {background: #fff url("gfx/page_yellow.gif") top left repeat-x;}
body#aktionen div#page, div#page.red {background: #fff url("gfx/page_red.gif") top left repeat-x;}
div#page.yellow {background: #fff url("gfx/page_yellow.gif") top left repeat-x;}
body#film div#page, div#page.dark {background: #fff url("gfx/page_dark.gif") top left repeat-x;}
div.teaserpage {background: #fff url("gfx/page_red.gif") top left repeat-x;}

div.pagehead {
	height: 88px;
	padding: 14px 0 0 0;}
	
/* FUCK YOU IE */ * html div.pagehead {padding: 24px 0 0 0;}
		
div.pagehead h2,
div.pagehead h3 {
	font-size: 1.8em;
	color:#2d2d2d;
	padding: 6px;
	border-bottom: 1px solid #92917b;
	background: #fff;}
	
div.pagehead h3 {
	font-size: 1.6em;
	color:#666;}
	
/* DATES */	
span.date {
	color: #837d66;
	background: #f8f8f8;}

div.date, div.nr {
	float: left;
	font-size: 1.2em;
	color:#666;
	width: 42px;
	text-align: center;
	padding: 4px 4px 0 4px;
	margin: 2px 8px 4px 0;
	border-bottom:1px solid #92917b;
	background: #e6e4d8;
	display: inline;}
div.nr {
	width: auto;
	padding: 8px 8px 4px 8px;
	margin: 3px 8px 0 0;}

div.date, div.nr em {
	display: block;
	font-size: 1.2em;
	color: #2e2c1f;
	margin: 0 0 4px 0;}
	

div.txt, div.people {
	font-size: 1.1em;
	line-height: 1.4em;
	margin: 12px 0 0 0;}
.element div.txt {
	margin: 12px 0;}
	

div.img {
	padding: 0 0 0 12px;
	margin: 10px 0 10px 0;}	
div.img img,
div.people img {
	float: left;
	width: 139px;
	margin: 0 8px 8px 0;
	border: 1px solid #d1d0c1;}
	
div.people {
	float: left;
	border-top: 1px solid #d2d0c3;
	border-bottom: 1px solid #999;}
	

p.intro {
	font-family: Verdana, Arial, Helvetica;
	font-style: italic;
	color: #222;
	width: 99%;}
	

div.pages {
	padding: 10px 0 0 0;
	margin: 8px 0 0 0;
	border-top: 1px dashed #d2d0c3;}
div.pages a {
	display: block;
	float: left;
	font-size: 1.4em;
	font-style: italic;
	padding: 8px;
	margin: 0 8px 12px 0;
	border-bottom: 1px solid #92917b;
	background: #e6e4d8;
	display: inline;}
div.pages a:visited {
	color:#666;
	background: #e6e4d8;}
div.pages a:hover {
	color:#fff;
	border-bottom: 1px solid #fff;
	background: #c20020;}


/* $SIDEBAR
------------------------------------------------------------------------*/
div#sidebar {background: #d2d0c3 url("gfx/page_yellow.gif") top left repeat-x;}
body#aktionen div#sidebar, div#sidebar.red {background: #d2d0c3 url("gfx/page_red.gif") top left repeat-x;}
div#sidebar.yellow {background: #d2d0c3 url("gfx/page_yellow.gif") top left repeat-x;}
body#film div#sidebar, div#sidebar.dark {background: #d2d0c3 url("gfx/page_dark.gif") top left repeat-x;}
div.teaserbar {background: #d2d0c3 url("gfx/page_red.gif") top left repeat-x;}


div#sidebar div.mbox,
div.teaserbar div.mbox  {
	margin: 18px 0 0 12px;}
	
div#sidebar div.boxhead,
div.teaserbar div.boxhead {
	background: #837d66;}


div#sidebar h2,
div.teaserbar h2 {
	margin: 5px 0 0 0;
	padding: 3px;}

div.polaroid {padding: 22px 0 12px 30px;}

* html body#aktionen div.polaroid {padding: 22px 0 0 30px;}


/* ------------------------- override */
body#film div.mbox {
	border-top:2px solid #575757;}
body#film div.boxhead {
	border-top:1px solid #3b3b3b;
	border-bottom:1px solid #aba483;
	background: #575757;}	



/* $TEASER
------------------------------------------------------------------------*/
div.teaser {
	float: left;
	background: url("gfx/bg_content.gif") top right repeat-y;}
	
div.teaser.last {
	margin: 0;
	border: 0;}

div.isolator {
	float: left;
	width: 984px;
	margin: 0 0 42px 0;
	border-bottom: 6px solid #8f8c76;
	background: url("gfx/bg_content.gif") top left repeat-y;}



/* $NAVIGATION
------------------------------------------------------------------------*/
ul#menu {
	font-size: 1.1em;
	list-style-type: none;
	height: 35px;
	margin: 8px 0 0 0;}
ul#menu li {
	float: left;
	margin: 0 0 0 0;
	display: inline;}
ul#menu li:after {
	content: url(gfx/menu_dotted.gif);}
ul#menu li:last-child:after {
	content:"";}
	
ul#menu a {
	float: left;
	display: block;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica;
	font-size: 1.5em;
	font-weight: bold;
	text-transform: uppercase;
	color: #9a9a8c;
	margin: 1px 9px 0 9px;
	padding-bottom:2px;
	color: #8f8c76;
	display: inline;}
ul#menu a:hover {
	color: #bcbaa7;}
	
/* COLOR ME +++ NAVIGATION */	
body#index a#mindex {
	color: #e1b241;}
body#blog a#mblog {
	color: #e1b241;}
body#aktionen a#maktionen {
	color: #e1b241;}
body#film a#mfilm {
	color: #e1b241;}
body#wirueberuns a#mwirueberuns {
	color: #e1b241;}
body#mitgliedschaft a#mmitgliedschaft {
	color: #e1b241;}
	
	
	
/* $FOOTER
------------------------------------------------------------------------*/
div#footer {
	float: left;
	font-size: 1.1em;
	height: 80px;
	width: 984px;
	margin: 0 0 42px 0;
	background: #e9e6dd url("gfx/bg_footer.gif") top left no-repeat;}

a#portnull {
	float: right;
	height: 66px;
	width: 65px;
	margin: 10px 10px 0 0;
	background: url("gfx/portnull.gif") top left no-repeat;}
	
#footer a:hover {
	color:#333;}
	


/* $SPLASH $INDEX $TWITTER
------------------------------------------------------------------------*/

div#index_twitter {
	background: #fff url("gfx/bg_twitter.jpg") bottom left no-repeat;}

div#twitter_div {
	line-height: 18px;
	padding: 2px 8px;
	margin: 0 0 6px 0;}
div#twitter_div li {
	list-style: none;
	margin: 0 0 6px 0;}

a#twitter_link {color: #d6a538;}
a#twitter_link:hover {color: #333;}




div#splash {
	float: left;
	width: 630px;
	min-height: 596px;
	border-top: 6px solid #837e61;
	background: url("img/splash_bklive.jpg") top center no-repeat;}
div.splashtxt {
	font-size: 1.4em;
	line-height: 1.4em;
	padding: 10px;
	margin: 510px 20px 20px;}
div.splashtxt h3 {
	display: inline;
	padding: 4px 6px;
	background: #fff;}
	
body#index #sidebar {
	background: none;}
body#index div.mbox {margin: 0 0 12px 0;}


div#yesiam p {
	float: left;}
div#yesiam img {
	float: right;
	margin: 10px 10px 0;}
	
div#splash p.credits {
	text-align: right;
	color: #fff;}


div#splash_imprint.mbox {
	text-align: right;
	border: none;
	color: #fff;
	background: #837d66;}
div#splash_imprint.mbox p {margin: 6px 0 0;}
div#splash_imprint.mbox a {color: #fff;}



	
	
	
/* $EXTRAS
------------------------------------------------------------------------*/
a.button {
	float: left;
	display: block;
	font-size: 1.1em;
	color: #666;
	padding: 2px 4px;
	margin: 0 0 8px 0;
	border-bottom: 1px solid #d2d0c3;
	background: #f6f6f6;}

a.button:hover {
	color: #333;}
	
a.inlinebutton {
	float:left;
	display: block;
	font-size: 1.1em;
	color: #666;
	padding: 4px;
	margin: 0 0 12px 0;
	border: 1px solid #bfbcac;
	background: #f3f3f3;}

a.inlinebutton:hover {
	color: #333;
	border-bottom: 1px solid #666;
	background: #f3f3f3}

div.mp3player {
	margin: 0 0 0 12px;}
	
div.video {
	width: 400px;
	margin: 20px auto;}
	
div.brightcove {
	width: 486px;
	margin: 20px auto;}
	
	
/* $ACCORDION / AJAX
------------------------------------------------------------------------*/
.toggler {
	cursor: pointer;
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', Arial, Helvetica;
	color: #222;
	padding: 6px 0 6px 6px;
	margin: 0;
	border-top: 1px solid #fff;
	border-bottom: 1px dashed #d3d1c3;
	background: #fff;}