/* CSS fuer Wohnungen - Flensburg / developed by Roschek und Diercks */

/* Globales */
body, body * {margin:0; padding:0; color:#17265E; font:normal 12px/14px Arial, Helvetica, sans-serif;}
body{background:url(../images/grafik-hintergrund-seite.gif) repeat-x;}
ul {list-style-type:none;}
a {text-decoration:none;}
p, .zusammenfassung, .schaltflaeche, .container ul, .bildergalerie {margin:0 9px 5px 9px;}
.fix {visibility:hidden; height:0; clear:both;}
p {line-height: 16px;}

/* Weiten */
#navigation, #zusatzspalte {width:150px;}
#content, #kopf {width:520px;}
#bereichsbilder, h1, .introtext, #einespalte, #mailergebnis, #kopfzeile {width:486px; clear:both;}
#linkespalte {width:200px; float:left;}
#rechtespalte {width:280px; float:left;}
.container {width:100%;}

/* Positionierung */
#navigation, #zusatzspalte, #content, #logo, #kopfzeile, #fotohaufen {position:absolute; left:50%;}
#content {margin:20px 0 0 -260px; background:url(../images/grafik-hintergrund-wrapper.png) repeat-y; z-index:1;}
.teaser, #bereichsbilder, .introtext, #linkespalte, #einespalte, #mailergebnis, #wohnungswahl {position:relative; left:17px;}
#rechtespalte {margin-left:24px;}
#kopf, #bereichsbilder, .introtext, #einespalte, #mailergebnis, .container, iframe, #preise {margin-bottom:5px;}
#navigation {margin:200px 0 0 -390px;}
#logo {margin:40px 0 0 -230px;}
#kopfzeile {margin:10px 0 0 -243px; z-index:4; color: #000;}

/* Links */
a.blank, span.blank {background:url(../images/target-blank.gif) 0 -2px no-repeat;}
a.blank {padding-left:15px; height:14px; display:block;}
a.blank:hover {background-position: 0 -17px;}
.introtext a, a.blank, a.mehr, a.fliesstext {color:#CC0000;}
.introtext a:hover, a.blank:hover, a.mehr:hover, a.fliesstext:hover {color:#FF0000;}
a.mehr {font-weight:bold; display:block;}

/* links zu anderen Seiten */
.screenshots {clear:both; height:auto;}
.screenshots a {display:block; float:left; width:131px;}
.screenshots img {border:1px solid #666666;}
.screenshots span {display:block; width:100%; text-align:center; font-size:10px;}

/* Schaltfl?chen */
.schaltflaeche150 {font-weight:bold; color:#CC0000; background:url(../images/schaltflaeche-150.gif) no-repeat; line-height:18px; width:150px; height:22px; text-align:center; display:block;}
.schaltflaeche150:hover {background-position:0 -23px; line-height:20px; color:#FF0000;}
.schaltflaechepdf, .schaltflaechebuchen {font-weight:bold; color:#CC0000; line-height:30px; width:185px; height:37px; text-align:center; display:block;}
.schaltflaechepdf {background:url(../images/schaltflaeche-pdf.gif) no-repeat;}
.schaltflaechebuchen {background:url(../images/schaltflaeche-buchen.gif) no-repeat;}
.schaltflaechebuchen:hover,
.schaltflaechepdf:hover {background-position:0 -37px; line-height:32px; color:#FF0000;}

/* Rahmen */
.introtext, .container {border-bottom:1px solid #CCCCCC;}
.introtext, #einespalte .container {background:url(../images/grafik-hintergrund-h1p.gif) repeat-y;}
#linkespalte .container {background:url(../images/grafik-hintergrund-h2pl.gif) repeat-y;}
#rechtespalte .container {background:url(../images/grafik-hintergrund-h2pr.gif) repeat-y;}

/* Kopf */
#kopfzeile {text-align:right;}
#kopfzeile * {font-size:10px; color:#000; margin-left:10px;}
#kopf {height:145px; background:url(../images/grafik-hintergrund-kopf.png) no-repeat; clear:both; padding-top:12px;}
#logo {width:180px; height:40px; z-index:2;}
#bereichsbilder {height:93px; display: none;}
#bereichsbilder * {float:left;}
#bereichsbilder img {margin-left:3px;}

/* Überschriften */
h1, h2, h3 {font-weight:bold; height:25px; text-indent:9px; padding-top:7px; clear:both;}
h1, #einespalte h2 {background:url(../images/grafik-hintergrund-h1.gif) no-repeat;}
h4 {width:204px; height:93px; text-indent:10px; font-size:0em; background:url(../images/grafik-hintergrund-bereich.gif) no-repeat;}
#linkespalte h2 {width:200px; background:url(../images/grafik-hintergrund-h2-links.gif) no-repeat;}
#rechtespalte h2, h3 {width:280px;}
#rechtespalte h2 {background:url(../images/grafik-hintergrund-h2-recht.gif) no-repeat;}
#rechtespalte h3 {padding-top:15px;}

/* Zusatzsplate rechts */
#zusatzspalte {height:560px; margin:100px 0 0 250px; backgro und:url(../images/rechtespalte-start.jp) no-repeat;}
#wohnungen #zusatzspalte,
#aktivitaeten #zusatzspalte,
.formular #zusatzspalte {height:400px; padding:16px 0 0 0; margin-top:200px;}
.legende * {padding-left:2px; margin-bottom:6px;}
.legende img {margin:0 2px -6px 0;}
dl.legende * {text-indent:4px;}
dl.legende a {margin-left:-2px;}
dl.legende {margin-top:-20px;}
dl.legende dt {font-weight:bold; margin-top:20px;}
dl.legende dd {margin-bottom:2px;}

/* Navigation (siehe auch: Wohnungen-nav.css) */
#navigation {height:400px; text-indent:10px; padding:16px 0 0 0;}

/* Bildergalerien und Urlaubsziele */
.bildergalerie li {margin-right:2px;}
.bildergalerie img {padding:1px; border:1px solid #CCCCCC;}
.bildergalerie a:hover img { border:1px solid #CC0000;}
.hinweis {font-size:10px; display:block;}

/* Fusszeile */
#fusszeile { height:20px; text-align:right; padding:15px 11px; background: #fff url(../images/grafik-hintergrund-fuss.png) no-repeat; clear:both; }
#copyright {font-size:10px; color:#AAAAAA;}
#copyright:hover {text-decoration:none; color:#666666;}

/* Formular und Impressum */
#mailergebnis * {color:#FFFFFF; font-weight:bold; text-align:center; padding:5px 0;}
#mailergebnis {background:#00CC00;}
#mailergebnis.fehler {background:#CC0000; padding:20px 0; }
#maildaten .mitteilung,
#maildaten .wohnungen {padding-top:10px;}
#maildaten .mitteilung .label {float:left;}
#maildaten .mitteilung .text {width:290px; float:left;}
#kontaktformular, #maildaten {margin:8px;}
#kontaktformular input, #kontaktformular textarea, #wohnungswahl div {width:280px; margin:0 0 5px 0; border:1px solid #CCCCCC;}
#kontaktformular label {display:block; margin:0; border-width:0;}
#kontaktformular .fehler {border:1px solid #CC0000;}
#kontaktformular label.fehler {border-width:0; color:#CC0000;}
#maildaten li {clear:both;}
#maildaten .label {display:block; width:140px; float:left;}
#pflichthinweis {display:inline; float:right; margin:2px 5px 0 0;}
#persangaben {float:left; width:290px; overflow:hidden;}
.telefonnummern {font-weight:bold;}
.adressdaten label {width:40px; display:block; float:left;}
.adressdaten .telefonisch,
.adressdaten .perfax,
.adressdaten .permail {margin-top:10px;}


/* Chechboxen f?r Wohnungen im Formular */
#wohnungswahl {width:180px; float:left; left:5px;}
#wohnungswahl div {width:175px; margin:5px 0;}
#wohnungswahl span {width:100%; background:#CCCCCC; color:#000000; display:block;}
#wohnungswahl .zusammenfassung {padding:2px;}
#wohnungswahl .checkbox {width:20px; margin:0; border-width:0;}

/* Preistabelle */
#preise {width:280px; border:1px solid #CCCCCC; background:#FFFFFF; border-width:1px 1px 0 1px;}
#preise * {border-bottom:1px solid #CCCCCC; text-align:center; padding:2px 0;}
#preise th {background:#d1e6ff; font-weight:bold;}

/* ?bersichtsseite Wohnungen */
.uebersicht #einespalte div {width:158px; float:left;}
.uebersicht #einespalte .container {background:url(../images/grafik-hintergrund-158.gif) repeat-y;}
.uebersicht #einespalte .container h2 {background:url(../images/grafik-hintergrund-158-h2.gif) no-repeat;}
.uebersicht #einespalte .container * {margin:0;}
.uebersicht #einespalte .zusammenfassung,
.uebersicht #einespalte .schaltflaeche150,
.uebersicht #einespalte .container a,
.uebersicht #einespalte .container p,
.schaltflaeche150,
.schaltflaechebuchen,
.schaltflaechepdf {margin:0 0 5px 4px;}
#spalteeins,
#spaltezwei {margin-right:6px;}

/* ?bersichtsseite Aktivitaeten */
#aktivitaeten #spalteeins .container,
#aktivitaeten #spaltezwei .container,
#aktivitaeten #spaltedrei .container {height:190px;}
#aktivitaeten * .container p {font-size:10px; line-height:10px;}