/* CSS Bersteigerdörfer XHTML-Strict */
/* --------------------------------- */

/* allgemeine Angaben */
html, body {
margin: 0; padding: 0;
background-color: #fff;
}
body {
font: normal normal normal 101%/normal Verdana, sans-serif;
padding-bottom: 20px;
}
img { border: 0; margin: 0; }
h1, h2, h3, p, ul, ol { margin: 0; padding: 0; }
.nofloat { clear: both; height: 0; font-size: 0; line-height: 0; }

/* allg. Seitenstruktur */
/* -------------------- */
/* Hintergrund-, Schrift-Farben: */
#topnav, #mainnav, #inhalt { background: #f2f2f2 url(bg-f2f2f2.jpg) repeat; /* für IE6 und Highcolor*/ color: #666; }
#topnav { color: #999; }
#visual { background-color: #037f2e; /* grün */ color: #fff; }
#visual.grau { background: #037f2e url(bg-visual.jpg) repeat; color: #333; }

#topnav, #mainnav, #visual, #visualthumbs { padding: 0 13px 0 20px; width: 887px; }
#inhalt { padding: 0 0 10px 20px; width: 900px; }
#mainnav { padding-right: 0px; width: 900px; /* wegen padding #mainnav a siehe Zeile 62 */}
* html #topnav, * html #mainnav, * html #visual, * html #inhalt { width: 920px; }

#visual.thumbs, #visualthumbs { padding-right: 0; width: 900px; }
* html #visual.thumbs, * html #visualthumbs { width: 920px; }

#logo {
position: absolute;
width: 175px; height: 105px;
padding: 0 0 0 15px;
top: 20px; left: 0;
background: #f2f2f2 url(bg-f2f2f2.jpg) repeat; /* für IE6 und Highcolor*/
text-align: center;
z-index: 10;
}
* html #logo { width: 190px; }

/* Top Navigation: */
#topnav {
height: 17px; padding-top: 3px;
text-align: right; font-size: 0.7em;
}
* html #topnav { height: 20px; }
#topnav a { 
color: #999; text-decoration: none;
}
#topnav a:hover { color: #45859c; }

/* Main Navigation: */
#mainnav {
height: 75px; border-bottom: 10px solid #b1dff1;
text-align: right;
}
* html #mainnav { height: 85px; }
#mainnav a, #mainnav a.on { 
display: block; float: right; 
text-decoration: none; 
font: normal 15px/15px Georgia, serif;
color: #2f6b7d; background: transparent;
padding: 50px 10px 7px 9px;
margin: 3px 0 0 3px;
/* Gesamthöhe 75px: font: 15px + padding: 50 + 7px + margin: 3 + 0 px = 75px */
}
#mainnav a:hover, #mainnav a.on { background-color: #e6e6e6; }

/* Contentbereich Bild */
#visual { 
position: relative; z-index: 0;
clear: right; 
height: 315px; overflow: hidden;
}
#visualthumbs { 
position: relative; z-index: 0;
clear: right;
height: 315px; overflow: hidden;
background: #037f2e url(bg-visual.jpg) repeat; color: #333;
}

#visual img, #visual #karte { float: left; margin-right: 18px; }
#visual #karte { 
margin: 10px 20px 55px 20px; 
width: 410px; height: 315px;
position: relative; 
background: transparent url(karte.gif) no-repeat center 40px;
}
* html #visual #karte { margin-left: 10px; }
#visual.thumbs img, #visualthumbs img { margin-right: 1px; }
#visual img.thumb, #visualthumbs img { float: left; margin: 2px 1px 0 1px; cursor: pointer; }


/* Contentbereich */
#inhalt {
clear: left;
background: #f2f2f2 url(bg-inhalt.jpg) repeat;
}
#inhalt.home { background: #f2f2f2 url(bg-inhalt-home.jpg) repeat; }
#inhalt.bilder { background-image: none; background-color: #fff;  }
#fusszeile {  
clear: both; 
width: 900px; padding: 8px 0 5px 20px;
background-color: #fff;
border-bottom: 5px solid #f2f2f2;
}
* html #fusszeile { width: 920px; }
#copyright-hinweis { 
clear: both;
width: 920px; 
font-family: Verdana, sans-serif; font-size: 10px; text-align: right;
color: #333; background-color: #fff;
}

/* Content Klickpfad, Breadcrumpnav */
#inhalt #klickpfad {
font-size: 0.7em;
padding: 8px 0 0 0;
}
#inhalt #klickpfad a {
text-decoration: none; color: #333;
}
#inhalt #klickpfad a:hover {
text-decoration: underline;
}

/* Ende allg. Struktur */
/* ------------------- */


/* Content Elemente */
/* ---------------- */
#visual h1, #visualthumbs h1 {
font: normal 1.5em Georgia, serif; 
padding: 14px 0 5px 0px;
}
#visualthumbs h1 { 
background-color: #037f2e; color: #fff; 
height: 62px;
text-align: center;
}
* html #visualthumbs h1 { height: 81px; }
#visual p { 
font-size: 0.8em; line-height: 1.5;
padding: 8px 0 0 0;
}
#visualthumbs p {
color: #037f2e;
font-size: 0.8em; line-height: 1.5;
margin: 0 4px 0 456px;
}
#visualthumbs img#bild { 
position: relative; z-index: 1;
margin-left: 0; margin-top: 0;
}
* html #visualthumbs img#bild {
margin: 0 -2px 0 -3px;
}
#visualthumbs div#copyright, #visual div#copyright {
position: absolute; z-index: 2; top: 303px; left: 22px;  
font-family: Arial, sans-serif; font-size: 0.6em; 
background: transparent; color: #e6e6e6;
margin: 0; padding: 0; height: 12px; 
}

/* Content 3-spaltig in #inhalt */
#inhalt #info { font-size: 95%; /* Schrift etwas kleiner */ }
#subnav, #info, #zusatzinfo { float: left; padding-top: 30px; background: transparent }
#subnav { width: 170px; }
#info { width: 510px; }
#zusatzinfo {
width: 180px; padding-left: 20px; padding-right: 20px;
}
* html #zusatzinfo { width: 220px; }
/* Bild links, Text rechts */
#inhalt #info div.bildlinks { 
width: 190px; padding-top: 6px;
float: left;
}
#inhalt #info div.textrechts { 
width: 298px; /* 2 px Reserve */
float: right;
}


/* Content 2-spaltig in #inhalt */
#info.home { width: 450px }
#zusatzinfo.home { width: 410px; padding-top: 0; }
* html #zusatzinfo.home { width: 450px; }
#zusatzinfo.home #karte {  
width: 410px; height: 315px;
position: relative; 
background: transparent url(karte.gif) no-repeat center 40px;
}

/* nur eine Spalte */
#infobilder { width: 900px; padding-top: 15px; } /* Extra id für IE6 notwendig, da maximal 1 class pro id! */
#infobilder img { float: left; margin: 0; padding: 0; cursor: pointer; width: 150px; }
* html #infobilder img {margin: 0 -3px;}

/* subnav */
#subnav ul { list-style-type: none; }
#subnav ul.sub { padding-left: 15px; font-size: 85%; }
#subnav ul li { padding: 0.3em 0; }
#subnav ul li a, #subnav ul li a.on  { 
display: block;
text-decoration: none;
font: bold 0.8em Georgia, serif;
color: #666;
}
#subnav ul li a:hover, #subnav ul li a.on { color: #45859c; }

/* info */
#info h2, #info h3, #info p, #info ul { 
padding: 0 40px 20px 20px; 
}
#info img { margin-left: 20px; margin-bottom: 20px; } /* muss margin (statt padding) sein, damit der IE richtig darstellt */
#info h2, #info h3 { 
font: normal 1.4em Georgia, serif;
}
#info h3 { 
font-size: 1.08em; font-weight: normal;
color: #037f2e;
padding-bottom: 5px;
}
#info h2.home, #info p.home {
padding-left: 0;
}
#info p, #zusatzinfo p { 
font-size: 0.8em; line-height: 1.5em; 
}


/* Textblock mit Hintergrundbild: */
#info div.mitbg {
width: 470px;
}
#info div.mitbg p, #info div.mitbg ul { padding-right: 0px; }


#info p.bildtxt { 
font-size: 0.7em; line-height: 1.2em;
margin-top: -15px;
}
#info p.link { margin-top: -10px; }
#info p.teaser { font-family: Georgia, serif; }
#info p strong { color: #777; }
#info ul, #info ol {
margin-left: 16px;
font-size: 0.8em; line-height: 1.3em;
}
#info ol { margin-left: 44px; }

/* 2 Spalten für Berdörfer-Startseite */
#visual #bergdorf-links { width: 218px; margin-top: 15px; float: left; }
#visual #bergdorf-rechts { width: 218px; margin-top: 15px; float: right; }



/* ----- Links ----- */
#info a, #zusatzinfo a {
color: #45859c;
text-decoration: none;
}
#info img.download { 
clear: left;
float: left;
border: 1px solid #45859c; 
margin-right: 20px; 
margin-left: 0;
}
#info a.download {
display: block;
font-size: 0.8em;
line-height: 1.5em;
margin: 5px 20px;
}
#zusatzinfo a { 
font: normal 1.0em/1.2em Verdana, sans-serif; 
}
#visual #bergdorf-links a, #visual #bergdorf-rechts a { 
display: block;  padding: 1px 2px 2px 10px;
color: #45859c; background: transparent; 
text-decoration: none; font-weight: bold;
}
#visual a { font-size: 0.8em; }
#info ul li a { }
#info a:hover, #zusatzinfo a:hover { text-decoration: underline; }
#visual #bergdorf-links a:hover, #visual #bergdorf-rechts a:hover { text-decoration: underline; }

/* zusatzinfo */
/* ------------------------- */
/* für Homepage : */
#zusatzinfo h2 {
font-family: Georgia, serif;
font-size: 1.3em; font-weight: normal;
color: #037f2e;
padding-bottom: 10px;
}
#zusatzinfo.home p { margin-bottom: 10px; }
#zusatzinfo h3 {
font: bold 0.8em Verdana, sans-serif;
padding-bottom: 8px;
}
#zusatzinfo p.link {
font-size: 0.7em; margin: 0 0 8px 0;
}
#zusatzinfo img { margin-bottom: 20px; }
#zusatzinfo ul { 
list-style-type: none; 
font-size: 0.8em;
padding-bottom: 20px;
}