/*
// Zugzwang Project
// resystra.de
// Copyright (c) 2014 Gustaf Mossakowski <gustaf@koenige.org>
// CSS for all
*/


@font-face	{ font-family: 'Droid Sans'; font-style: normal; font-weight: 400;
			src: local('Droid Sans'), local('DroidSans'), url(droidsans.woff) format('woff'); }

html, body	{ height: 100.1%; }
body		{ background: white; color: #666; font-family: 'Droid Sans', Arial, sans-serif; 
			margin: 0; padding: 0; }

h1, h2, h3, h4, h5, h6
			{ color: black}
h1			{ font-size: 130%; margin: .5em 0 .25em; }
h2			{ font-size: 130%; margin: 1.5em 0 0; font-weight: normal; }
h3			{ font-size: 110%; }
h1 + h2, div.feedback h2, #zzform #record h2, div h2:first-child
			{ margin-top: .25em; }

strong		{ color: #555; }

p, ul		{ margin: .5em 0 1em; }

pre			{ max-width: 100%; overflow: auto; background: #EEE; }

a			{ text-decoration: none; }
a img		{ border: none; }
a:link		{ color: #118E38; }
a:visited	{ color: #92C56E; /* #ADC90E; */ }
a:target, li:target
			{ background: yellow; }
a:link:hover, a:visited:hover
			{ background: #EEE; }

@media screen and (max-width: 40em) {
	body		{ font-size: 92%; }
	input, textarea	
				{ max-width: 95%; }
	
	h1			{ margin-bottom: 0; }
	h1 + h2, div.feedback h2, #zzform #record h2, div h2:first-child
				{ margin-top: 0; }
}

#all		{ margin: 0; 
			position: relative; /* needed for footer positioning*/
			height: auto !important; /* IE6: treaded as min-height*/
			min-height: 100%; /* real browsers */ }
#canvas, #logo, #menu, .foot
			{ max-width: 56em; margin: 0 auto; padding: 0 1em; }
#canvas		{ padding-bottom: 120px; }

#head, #foot
			{ width: 100%; margin: 0; min-height: 4em; }
#head		{ background: #666; color: white; text-align: center; }
#foot		{ padding: 0; }
#foot		{ background: #ecebe6; position: absolute; bottom: 0; 
			padding-top: .5em; }
.clear		{ clear: both; }

#logo		{ text-align: left; padding-top: 1.75em; padding-bottom: .75em; }
#logo strong	{ padding: 0 .35em; }
#logo strong strong
			{ padding: 0; }
#logo a:link:hover, #logo a:visited:hover
			{ background: none; }

nav			{ background: #ecebe6 url(nav-background.png) repeat-x; overflow: hidden; }
#menu		{ overflow: hidden; }
#menu li	{ list-style: none; float: left; padding: 0;
			bborder-right: 1px solid #CCC; line-height: 1; }
#menu li:first-child a, #menu li:first-child strong
			{ padding-left: .5em; }
#menu strong, #menu a
			{ padding: .75em; display: block; color: #666; } 
#menu strong, #menu a:hover, #menu a.below
			{ background: #666; color: white; font-weight: normal; }

#breadcrumbs
			{ clear: both; color: #999; padding: 1em 0 0; }
#breadcrumbs strong
			{ color: #999; }
#breadcrumbs, #menu li, #foot p, #foot li
			{ font-size: 90%; }

#menu a, #breadcrumbs a
			{ text-decoration: none; }

#text		{ line-height: 1.6; padding: .5em; }

#foot p		{ margin: .5em; }
#menufoot
			{ margin: 0 .5em; padding: 0 0 1em; }
#menufoot li
			{ float: left; list-style: none; padding: 0 .75em 0; margin: 0; 
			border-left: 1px dotted #666; }
#menufoot li:first-child
			{ padding-left: 0; border-left: none; }

#sponsors	{ float: right; overflow: hidden; }
#sponsors img
			{ padding: 0 12px 16px 16px; vertical-align: bottom; }

@media screen and (max-width: 40em) {
	#canvas, #logo, #menu, .foot
				{ padding: 0 .5em; }
	#canvas		{ padding-bottom: 160px; }
	#menu		{ padding: 0 .75em; }
	#logo		{ padding: .75em .5em; }

	#menu strong, #menu a
				{ padding: .5em .5em; }
	#sponsors	{ padding-bottom: .5em; }
	#sponsors img
				{ padding: 6px 2% 12px 2%; max-width: 40%; }
	#menufoot	{ overflow: hidden; }
	#foot p		{ margin: .75em; }
	#menufoot
				{ margin: 0 .75em; }
	
	#breadcrumbs
				{ display: none; }
}

/* Projekte */

ul.projects	{ padding: 0; }
.projects li
			{ margin: 1.5em 0 .75em; list-style: none; padding: 0; }
.projects li:first-child
			{ margin-top: 0; }
.projects li li
			{ margin: .25em 0; list-style: square; }
.projects p	{ margin: .25em 0; }
.projects li .head strong
			{ font-size: 130%; font-weight: normal; }

.abstract	{ font-weight: bold; }

/* Team */

.persons	{ margin: 0 0 1em; padding: 0; }
.persons li
			{ margin: 1em 0; clear: both; list-style: none; }
.persons li:first-child
			{ margin-top: 0; }
.persons img
			{ float: left; width: 80px; padding: .4em 1em 1em 0; }
.persons p, .persons p.arbeitsbereiche, .persons ul.arbeitsbereiche
			{ margin-left: 96px; padding: 0; }
@media screen and (max-width: 40em) {
	.persons p, .persons p.arbeitsbereiche, .persons ul.arbeitsbereiche
				{ margin-left: 0; }
	.persons img
				{ padding-bottom: 5px; }
}

p.arbeitsbereiche
			{ margin: .25em 0 0; padding: 0; }
ul.arbeitsbereiche
			{ margin-bottom: 1.5em; margin-top: 0; padding: 0; }
.arbeitsbereiche li
			{ padding: 0; margin: 0; line-height: 1.3; }

/* Aktuelles */

.termine	{ border-collapse: collapse; }
.termine th	{ padding-right: 1.5em; text-align: left; min-width: 8.5em; }
.termine td, .termine th
			{ vertical-align: top; padding-bottom: .75em; }
.termine p	{ margin: 0 0 .5em; }
.termine th em
			{ font-weight: normal; font-style: normal; }
ul.termine, .terminbox .publications
			{ list-style: none; margin: 0; padding: 0; font-size: 90%; }
ul.termine li
			{ margin: .75em 0 0; padding: 0; list-style: none; }
ul.termine ul
			{ margin: 0; }
ul.termine li li
			{ margin: 0; list-style: square; }
ul.termine .date
			{ color: #D51130; }
.termine .images
			{ float: right; padding: 0 0 .5em .5em; }
.termine .images a
			{ margin: 0 0 .5em .5em; }
.termine .images img
			{ vertical-align: bottom; }

.terminbox	{ float: right; max-width: 15em; background: #ecebe6;
			padding: 1em; margin: .5em 0 .75em .75em; line-height: 1.5; }
.terminbox h2
			{ font-size: 100%; font-weight: bold; }
.terminbox p, .terminox li
			{ margin: .5em 0 0; }
.terminbox h2
			{ margin: 2em 0 .5em; }
.terminbox h2:first-child
			{ margin: 0; }

@media screen and (max-width: 40em) {
	.termine th	{ display: block; color: #D51130; min-width: auto; 
				padding-bottom: 0; }
	.termine td	{ display: block; }
	
	.terminbox	{ float: none; max-width: none; margin: .5em; }
}

/* Partner */

.orgs		{ list-style: none; padding: 0; overflow: hidden; }
.orgs li	{ margin: 1em 0; clear: both; }
.orgs .img	{ float: left; width: 240px; padding-bottom: 1em; }
.orgs p		{ margin: .25em 0 .25em 240px; padding: 1em 0 0 2em; }

dt			{ font-weight: bold; }

@media screen and (max-width: 40em) {
	.orgs .img	{ display: block; float: none; padding-bottom: 0; }
	.orgs p		{ margin: .25em 0 .25em 2em; padding: .5em 0 2em;
				text-align: right; }
}

/* Intern */

#login fieldset
			{ border: none; margin: 0; padding: .25em 1.5em;
			background: #dbe9a6 url(/_layout/zugzwang-stripes.gif) repeat-y 100% 0; }
#login legend
			{ background: #dbe9a6; padding: .25em .75em; }
#login label
			{ float: left; width: 10em; }
#login form	{ margin: 1em 0 0; }
#login form p
			{ margin: .5em 0; }
#login form p.submit
			{ margin-left: 10em; }
#logout		{ position: absolute; right: 2em; top: 2em; font-weight: bold; 
			z-index: 4; margin: 0; padding-right: 20px; }

@media screen and (max-width: 40em) {
	#login fieldset
				{ background-image: none; }
	#login form p.submit
				{ margin-left: 0; }
	#login label
				{ float: none; width: auto; }

}

/* Medien */

p.bild		{ color: #AAA; font-size: 85%; text-align: center; }
p.bild img	{ max-width: 100%; display: block; margin: auto; }

.bilder240, .bilder120
			{ text-align: center; }
.bilder240 img, .bilder120 img
			{ vertical-align: middle; padding: .5em; }

div.bottommedia
			{ padding-top: 1em; }
@media screen and (max-width: 40em) {
	div.bottommedia		{ margin-left: 0; margin-bottom: 9em; }
}

/* Publikationen */

.publications a
			{ font-weight: bold; }
.publications p
			{ margin: .5em 0; }

/* Fehler */

.error		{ background-color: red; color: white; }

/* Intern */

.column-left	{ float: left; width: 48%; margin-right: 4%;}
.column-right	{ float: left; width: 48%; }

@media screen and (max-width: 40em) {
	.column-left, .column-right
				{ float: none; width: auto; margin-right: 0;}
}