@charset "utf-8";

@import url("nav.css");
/**
  * DIE Stylesheet for Screenversion
  * ===============================================================
  * @Autor             Digitale Zeiten GmbH - Agathe Gwiozdzik
  * @URL               http://www.digitale-zeiten.de
  * @Letzte Aenderung  2010-10-01
  */

/*--------
Colors

institut-blau: #06f / #a3c7ff / #d9e8ff
inhalte-blau: #039 / #a3b5da / #d9e1f0
die-gruen: #5c703c
---------*/

/*--------
Structure
---------*/
/*Hgroup hinzugefuegt Freyberg*/
header,nav,footer,article,aside,section,hgroup {
	display:block;
}

html {
	overflow:scroll;
}

html,body {
	font-size:1.01em;
}

body {
	background:#fff url(../img/bg-page.png) repeat-x 0 0;
	margin:0;
	padding:0 3%;
}

div#page {
	background:transparent url(../img/bg-header.png) no-repeat center 0;
	max-width:1000px;
	margin:auto;
}

header {
clear:both;
margin-bottom:20px;
}

div#logo {
padding-top:10px;
float:left;
}

ul#setfont {
float:right;
padding-left:30px;
margin:0;
}

ul#setfont ul {
display:inline;
padding-left:0;
}

ul#setfont li {
display:inline;
}

div#services {
background:transparent url(../img/bg-services-trans.png) repeat-x top left;
padding:4px 10px 8px 10px;
text-align:right;
}

nav#metanav ul {
margin:0;
}

nav#metanav li {
display:inline;
margin-left:10px;
}

ul#breadcrumb {
list-style-type:none;
margin:0;
padding-right:10px;
padding-left:10px;
}

ul#breadcrumb ul,ul#breadcrumb ul li {
display:inline;
padding:0;
}

nav#mainnav {
float:left;
width:230px;
}

div#content {
background:#fff;
margin-left:260px;
}

article {
padding:20px;
}

div#rc {
width:33%;
float:right;
padding-left:20px;
}
/*Warum muss das doppelt?
,div#page.twocol aside, div#page.twocol section
*/

div#page.twocol div#rc
{	
	 display:none;
}

aside {
	padding:10px;
}

section {
	padding:10px 0;
}

/*IE lt 9 and older versions off cool browsers don't support Pseudoclasses. Here is a class-solution*/
section.last-child {
	border-bottom:none!important;
}

footer#contentfooter {
	clear:both;
	display:block;
	text-align:center;
}

footer#contentfooter ul {
	margin:0;
}

footer#contentfooter ul li {
	display:inline;
	padding:0 10px;
}

footer#pagefooter {
	background:transparent url(../img/bg-footer-trans.png) repeat-x bottom left;
	text-align:right;
	display:block;
	padding:8px 10px 4px 10px;
	margin-top:20px;
	clear:both;
}

/*--------
Typo
---------*/
body {
	line-height:1.5em/*18px*/;
	font-family:Arial,Helvetica,sans-serif;
	font-size:.75em/*12px*/;
}

p,ul,dl,ol,table {
	font-size:1em/*12px*/;
	margin:0;
}

/*
#content p,
#content ul,
#content dl,
#content ol {
	padding-top:.375em;
	padding-bottom:.375em;
}
*/


#content ul {
	padding-top:.375em;
	padding-bottom:.375em;
}

/*Neu Freyberg*/
article p,
article table,
article ul,
article dl,
article ol
{
	margin-top:.875em;
	padding-bottom:.375em;
}

article ul li{
	margin-top:.375em;
	padding-bottom:.375em;
}

/*Warum gerade h3?? s.u.*/
div#rc h3~p {
	margin-left:12px;
}

h1 {
	font-size:1.42em/*17px*/;
	font-weight:700;
	margin:0;
}

h2 {
	font-size:1.25em/*15px*/;
	font-weight:400;
	padding-top:2em;
	margin:0;
}

h3 {
	font-size:1em/*12px*/;
	font-weight:700;
	padding-top:2em;
	margin:0;
}

/*Neu Freyberg*/
h4 {
	font-size:0.9em/*12px*/;
	font-weight:700;
	padding-top:2em;
	margin:0;
}
/*Neu Freyberg*/
hgroup h1+h2,hgroup h2+h3 {
	padding-top:0;
}

/*Neu Freyberg* muss am besten durch margin-top der Blockelemente ersetzt werden*/
hgroup
{	
	padding-bottom:0.5em;
	}

/*Warum gerade h3??*/
div#rc h2 {
	font-size:1em/*12px*/;
	font-weight:700;
	padding-top:0;
}

/*Warum gerade h3??*/
div#rc h3 {
	padding-top:.75em;
}

/*Neue Klasse Freyberg */
.kontakt
{
	font-size:1em/*12px*/;
	font-weight:700;
	}

/*erweitert um type=button und textarea Freyberg*/
input[type='text'],input[type='submit'],input[type='button'],textarea {
	font-family:Arial,Helvetica,sans-serif;
	font-size:1em/*12px*/;
}

footer#pagefooter,footer#contentfooter {
	font-size:.917em/*11px*/;
}

/*--------
Links. fast alles neu
---------*/
a {
	text-decoration:none;
}

a:hover {
	text-decoration:underline;
}
/* 
border-bottom:1px dotted #313131;
neu Freyberg. Wirkt sich allerdings auch auf bilder in Links aus*/
#content article a{
	background:url(../img/link-intern.png) no-repeat 0 5px;
	padding-left:12px;
	font-weight:700;
}
/*wichtig auf f�r das Logo*/
a img {
	border:none!important;
	text-decoration:none;
}
/*wenn man z.B. bei Bildern nicht den Pfeil sehen soll der einen Link markiert. Fett verschwindet auch. Besser umbenennen in linkunsichtbar. */
#content article a.unsichtbar
{
	 background-image:none;
	 padding-left:0px;
	 font-weight:400!important;	
	}

/* zu allgemein
a+span {
	padding-left:12px;
}
*/

a.fussnote
{
	font-weight:400!important;
	background:none !important;
	padding-left:0px !important;
}

a.unwesentlich
{
	font-weight:400!important;	
}

a.auffallend
{	border-bottom:none!important;
	background:url(../img/link-intern.png) no-repeat 0 5px;
	padding-left:12px;
	}

a.wichtig
{
	font-weight:700;
	border-bottom:none!important;
	background:url(../img/link-intern.png) no-repeat 0 5px;
	padding-left:12px;
	}


a.sehr_wichtig
{
	display:list-item;
	font-weight:700;
	list-style-position:outside;
	list-style-type:none;
	padding-left:12px;
	margin-top:.3em;
	margin-bottom:.0em;
	border-bottom:none!important;
	background:url(../img/link-intern.png) no-repeat 0 5px;	
	}

#content a[href^='http://'],
#content a.auffallend[href^='http://'],
#content a.auffallend[href^='https://'],
#content a.auffallend[href^='ftp://'],
#content a.wichtig[href^='http://'],
#content a.wichtig[href^='https://'],
#content a.wichtig[href^='ftp://'],
#content a.sehr_wichtig[href^='http://'],
#content a.sehr_wichtig[href^='https://'],
#content a.sehr_wichtig[href^='ftp://']
{
	background:url(../img/link-extern.png) no-repeat 0 5px;
}

#content a[href^='http://www.die-bonn.de'],
#content a.auffallend[href^='http://www.die-bonn.de'],
#content a.wichtig[href^='http://www.die-bonn.de'],
#content a.sehr_wichtig[href^='http://www.die-bonn.de']
{
	background:url(../img/link-intern.png) no-repeat 0 5px;
}

#content a.auffallend[href$='.pdf'],
#content a.auffallend[href$='.pdf'],
#content a.auffallend[href$='.doc'],
#content a.wichtig[href$='.pdf'],
#content a.wichtig[href$='.doc'],
#content a.sehr_wichtig[href$='.pdf'],
#content a.sehr_wichtig[href$='.doc'] {
	background:url(../img/link-doc.png) no-repeat 0 3px;
}

#content a[rel='section'],
#content a.auffallend[rel='section'],
#content a.wichtig[rel='section'],
#content a.sehr_wichtig[rel='section'],
#content a.wichtig[href^='#']{
	background:url(../img/link-anchor.png) no-repeat 0 7px;
}

/*#content a:hover
{
	border-bottom:1px solid #5c703c;
	text-decoration:none;

}
*/

a:hover,a.sehr_wichtig:hover,a.wichtig:hover,a.auffallend:hover,a.die-link:hover
{
	/*border-bottom:none!important;*/
	text-decoration:underline!important;
}




ul#breadcrumb a {
	border-bottom:none;
	text-decoration:none;
}


/*Internal Links in Metanavigation*/
nav#metanav a.wichtig,
nav#metanav a[rel='copyright'] {
	background:url(../img/link-intern-s.png) no-repeat 0 5px;
	display:inline;
	font-weight:400;
	padding-left:6px;
}

ul#setfont a {
	font-weight:700;
}

ul#breadcrumb a.internal {
	background:none;
	display:inline;
	font-weight:700;
	font-size:.917em;
	padding-left:0;
	border-bottom:none;
}

ul#breadcrumb a.on {
	font-weight:400;
	font-size:.917em;
	border-bottom:none;
}

/*Alternativ RSS Link*/
footer#contentfooter a[rel='alternate'] {
	background:url(../img/link-rss.png) no-repeat 0 2px;
	padding-left:15px;
	border-bottom:none;
}

/*Service Print Link*/
/*Zusatz: footer#contentfooter entfernt */
a[rel='print'] {
	background:url(../img/link-print.png) no-repeat 0 2px;
	padding-left:15px;
	border-bottom:none;
}

/*Top Link*/
footer#contentfooter a[rel='top'] {
	background:url(../img/link-top.png) no-repeat 0 0;
	padding-left:15px;
	border-bottom:none;
}


/*--------
Colors
---------*/
h1,h2,h3,h4,legend {
	color:#5c703c;
}



/*Klasse kontakt neu hinzugefuegt*/
body,
a,
div#services,
div#services a,
footer#pagefooter,
footer#pagefooter a,
.kontakt,
input {
	color:#313131;
}



ul#breadcrumb,
ul#breadcrumb a,
footer#contentfooter ul,
footer#contentfooter ul a {
	color:#636363;
}



/*--------
Colors Special for body#institut or body#inhalte
Navigation Colors -> nav.css
---------*/
#institut ul#breadcrumb {
background:#d9e8ff;
border-bottom:1px solid #a3c7ff;
}

#inhalte ul#breadcrumb {
background:#d9e1f0;
border-bottom:1px solid #a3b5da;
}

#institut div#content {
border:1px solid #06f;
}

#inhalte div#content {
border:1px solid #039;
}

#institut aside {
border-left:1px solid #a3c7ff;
}


#inhalte aside {
border-left:1px solid #a3b5da;
}
/*aside eingefuegt */
#institut aside section {
border-bottom:1px solid #a3c7ff;
}
/*aside eingefuegt */
#inhalte aside section {
border-bottom:1px solid #a3b5da;
}

#institut footer#contentfooter {
background:#D9E8FF;
border-top:1px solid #a3c7ff;
}

#inhalte footer#contentfooter {
background:#d9e1f0;
border-top:1px solid #a3b5da;
}

#institut th {
border:1px solid #B2D1FF;
background-color:#B2D1FF;
}

#institut td {
border:1px solid #B2D1FF;
}

#institut tr.even {
background:#D9E8FF;
}

#inhalte th {
border:1px solid #a3b5da;
background-color:#a3b5da;
}

#inhalte td {
border:1px solid #a3b5da;
}

#inhalte tr.even {
background:#d9e1f0;
}


/*--------
Forms
---------*/
/*erweitert um type=button  Freyberg*/
input[type='submit'],input[type='button'] {
	background:#a7b296 url(../img/bg-simplesearch.png) repeat-x top left;
	border:1px solid #5c703c;
	color:#fff;
	cursor:pointer;
	margin-top:4px;
	padding:2px;
	width:auto;
}

/*neu freyberg: um Abstand nach unten f�r Formularelemente zu bekommen keine <p> benutzen*/
div.formularzeile
{
     padding-bottom:1em;
}

input[type='text'],
input[type='image'],
input[type='checkbox'],
label {
vertical-align:middle;
}

/*muss eigentlich auch weg*/
input[type='checkbox'] {
	float:left;
	margin-right:5px;
	margin-top:.2em; 
}

/*Deaktiviert Freyberg
Verstehe die Allgemeinheit nicht. Schneidet den Text im IE ab*/
select {
/*width:30%;*/

}

form .simplesearch {
	background:#627543 url(../img/bg-simplesearch.png) repeat-x top left;
	border:1px solid #5c703c;
	float:right;
	margin-top:45px;
	padding:5px;
	text-align:left;
	width:210px;
}

form .simplesearch input[type='text'] {
	background:#fff url(../img/bg-input.png) repeat-x top left;
	border:1px solid #fff;
	padding:2px;
	vertical-align:middle;
	width:180px;
}

form .simplesearch input[type='image'] {
	margin:0 0 0 6px;
	padding:0;
	vertical-align:middle;
}

form .keywordsearch {
	margin:.375em 0;
}

form .keywordsearch input[type='text'] {
	background:#fff url(../img/bg-input.png) repeat-x top left;
	border:1px solid #5c703c;
	padding:4px;
	vertical-align:middle;
	width:95%;
}

form .searchform div.fltl {
margin-right:40px;
}

form .searchform input[type='text'] {
background:#fff url(../img/bg-input.png) repeat-x top left;
border:1px solid #5c703c;
padding:4px;
width:260px;
}

form .searchform input[type='image'] {
margin:0 0 0 6px;
padding:0;
}

/*Wenn Inhalt unter Formularelementen ohne eine Ueberschrift beginnt*/
div.form {
margin-bottom:2em;
}

/*--------
Listen
---------*/
article ul,
article ol {
	padding:0 0 .375em 0;
}

/*margin-bottom .8em; eingefuegt freyberg*/
article ul li {
	background:url(../img/listingdot.png) no-repeat left 6px;
	list-style-type:none;
	margin-bottom:.8em;
	padding:0 0 0 12px;
}
/*neu Freyberg ListenElemente mit dem DIE-Logo (bei DIE-Veranstaltungen)*/
article ul li.die 
{
	background:url(../img/die_logo_16x16.gif) no-repeat 0 0px;	
	list-style-type:none;
	margin-bottom:.8em;
	padding:0 0 0 20px;
}

	

article ul li>ul {
	padding-top:0em;
}

article ol li {
	margin-left:20px;
	padding:0;
}

/*Wenn Listenpunkte gleichzeitig Links sind*/
ul.linklist {
	padding:0;
}

ul.linklist li {
	background:none;
	list-style-type:none;
	padding:0;
}
/*margin-bottom 0em; eingefuegt freyberg*/
ul.linklist li li {
	padding-left:12px;
	margin-top:0;
	margin-bottom:0;
}

/*Freyberg: 1.5em durch 1em ersetzt*/
ul.linklist ul {
	margin:0 0 1em 0;
}

#rc ul.linklist ul {
	margin:0 0 .75em 0;
	padding:0;
}

/*Neu wie twolevel-ulist nur ohne fettdruck*/
ul.twolevel-textlist li {
	background:url(../img/listingdot.png) no-repeat left 6px;
	list-style-type:none;
	padding-left:12px;
}

/*neu freyberg*/
ul.twolevel-textlist li li {
	background:none;
	font-weight:400;
	margin-top:0;
	margin-bottom:0;
	padding:0;
}

/*neu*/
ul.twolevel-textlist ul {
	margin:0 0 1.5em 0;
	padding:0;
}

/*Das (erste) Element der Liste ist der Quasi-Titel und wird fett gededruckt*/
ul.twolevel-ulist li {
	background:url(../img/listingdot.png) no-repeat left 6px;
	font-weight:700;
	list-style-type:none;
	padding-left:12px;
}

/*margin-bottom 0em; eingefuegt freyberg*/
ul.twolevel-ulist li li {
	background:none;
	font-weight:400;
	margin-top:0;
	margin-bottom:0;
	padding:0;
}

/*Abstand nach unten von 1.3 in 1em geaendert*/
ul.twolevel-ulist ul {
	margin:0 0 1.3em 0;
	padding:0;
}
/*speciallist ist die Subnavigation */
ul.speciallist {
	margin:1em 0;
}

ul.speciallist li {
	background-color:#d9e1f0;
	background-image:none;
	border:1px solid #a3b5da;
	display:inline;
	list-style-type:none;
	margin-right:2px;
	padding:5px 18px 5px 8px;
}

ul.speciallist li.on {
background-color:#a3b5da;
}

ul.speciallist li a {
display:inline;
}

dl.dlist dt {
float:left;
font-weight:700;
}

dl.dlist dd {
margin-left:12em;
}

ol.kleinbuchstaben
{
 list-style-type:lower-latin;
	}
ol.gro�buchstaben
{
	list-style-type:upper-latin;
	}

ol.roemisch
{
	 list-style-type:upper-roman;
	}
/*--------
Tables / See also: Colors Special for body#institut or body#inhalte
---------*/
table {
border-collapse:collapse;
border-spacing:0;
margin:.375em 0;
width:100%;
}

th {
font-weight:700;
text-align:left;
}

th,td {
padding:5px;
vertical-align:top;
}

/*IE lt 9 and older versions off cool browsers don't support Pseudoclasses such as nth-child(odd) and nth-child(even). Here is a class-solution*/
tr.odd {
background:#fff;
}

/*--------
Special Classes + Generic Classes
---------*/
img.image-left {
border:1px solid #313131;
float:left;
margin:.375em 20px .375em 0;
}

img.image-right {
	border:1px solid #313131;
	float:right;
	margin:.375em 0 .375em 20px;
}

.forprint,.hide {
display:none;
}

.clr {
clear:both;
height:0;
}

.alignr {
text-align:right;
}

.fltl {
float:left;
}

.fltr {
float:right;
}

.hint {
color:#06f;
font-size:1.25em;
}