/* Importieren des Stylesheets fuer Farben und Typo */
@import url(/includes/css/color-neu.css);
@import url(/includes/css/typography-neu.css);

/* Normalisieren der Browser Default Styles */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, legend, input, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
}

ol, ul {
	list-style: none;
}

address, caption, cite, code, dfn, em, th, var {
	font-style: normal;
	font-weight: normal;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset, img {
	border: 0;
}

caption, th {
	text-align: left;
}

/* Layout
-------------------------------------------------------------------------------- */
html {
	text-align: center;
}

body {
	width: 1000px;
	margin: 0 auto;
	text-align: left;
}

div#content a.left {
	padding-left: 20px;
}

div#content a.right {
	padding-right: 20px;
}

div#content a.merkzettel {
	padding: 1px 5px;
	padding-right: 20px;
}

div#header {
	position: relative;
}

div#header h1 a {
	display: block;
	height: 123px;
	text-indent: -9999px;
}

div#header h1 a span {
	text-indent: -9999px;
}

body#startseite div#header h1 {
	height: 368px;
}

ul#navsub {
	position: absolute;
	top: 4px;
	left: 5px;
}

ul#language {
	position: absolute;
	top: 4px;
	right: 5px;
}

ul#navsub li, ul#language li {
	float: left;
	padding: 0 5px;
}

div#header a {
	padding-right: 5px;
}

div#navmain {
	position: absolute;
	left: -10px;
	top: -39px;
}

div#navmain ul {
	margin-top: 1em;
	margin-left: 10px;
}

div#navmain li {
	float: left;
	background: transparent url(/media/image/tabnav-right-both.png) no-repeat top right;
}

#content #navmain li.lastitem {
	float: right;
	background: transparent url(/media/image/tabnav-right-active.png) no-repeat top right;
}

#content #navmain li.lastitem a {
	background: transparent url(/media/image/tabnav-left-active.png) no-repeat top left;
	color: #fff;
}

div#navmain li a {
	display: block;
	float: left;
	height: 21px;
	font-size: 110%;
	padding: 0 15px;
	padding-top: 4px;
	background: transparent url(/media/image/tabnav-left-both.png) no-repeat top left;
}

div#navmain li:hover {
	background-position: 100% -25px;
}

div#navmain li a:hover {
	background-position: 0% -25px;
	text-decoration: none;
}

body #navmain ul .active {
	background: transparent url(/media/image/tabnav-right-active.png) no-repeat top right;
}

body #navmain ul .active a {
	background: transparent url(/media/image/tabnav-left-active.png) no-repeat top left;
	color: #fff;
}

body #navmain ul li.active:hover {
	background-position: 100% -26px;
}
body #navmain ul .active a:hover {
	background-position: 0% -26px;
}

/* =content */
div#content {
	position: relative;
	float: left;
	width: 980px;
	min-height: 455px;
	margin: 38px 10px 10px 10px;
	padding: 10px 0;
	display: inline; /* ToDo: Auslagern in ie6.css */
}

body#startseite .start {
	min-height: 232px;
}

div#content h2 {
	margin-bottom: 1em;
}

#breadcrumb {
	margin-bottom: .6em;
}

div#content h2 > span {
	margin-right: 20px;
}

div#left {
	float: left;
	width: 320px; 
}

div#left_info {
	float: left;
	width: 250px;
}

div#left_start {
	float: left;
	width: 290px;
}

div#left_big {
	float: left;
	width: 900px;
}

div#left_karte {
	float: left;
	width: 600px;
}

div#left_karte, div#left_wide {
	float: left;
	width: 590px;
}

div#content .webcam {
	width: 640px;
}

div#left_price {
	margin-top: 30px;
}

div#left > p {
	position: relative;
}

div#left > p > span {
	position: absolute;
	top: 10px;
	right: 25px;
	width: 100px;
}

div#center {
	float: left;
	width: 425px;
	/*margin-top: 30px;*/
}

div#center_reiseinfo {
        float: left;
        width:700px;
		/*margin-left:10px;
        /*margin-top: 30px;*/
}

div#content .ohneBuchungsbox {
	margin-top: 0;
}

div#right {
	float: right;
	width: 210px;
	padding: 5px;
}

div#rightbooking {
	float: right;
	width: 220px;
}

div#rightbooking > div {
	padding: 8px;
}

div#content .webcamright {
	width: 330px;
}

div#right_search, div#right_wide {
	float: right;
	width: 375px;
}

div#right_search > div {
	padding: 10px;
}

ul#buchungsbox {
	position: absolute;
	/*top: 10px;*/
	top: 35px;
	right: 0;
	width: 205px;
	padding: 3px 4px;
}

ul#buchungsbox li {
}

ul#buchungsbox a {
	padding-left: 20px;
}

/* =Bilder der Appartments */
div#left p, div#left ul {
	margin-bottom: 5px;
}

.bigPic {
	width: 300px;
	height: 225px;
	overflow: hidden;
}

#left ul#appartmentthumbnails {
	margin-bottom: 40px;
}

ul#appartmentthumbnails li {
	display: inline;
	margin-right: 4px;
	margin-bottom: 5px;
	width: 72px;
	height: 50px;
	overflow: hidden;
}

/* =content center */
div#center p, div#right_search p, div#left_wide p, div#rightbooking p {
	margin-bottom: 1em;
}

div#center h3, div#left_wide h3 {
	margin-bottom: 1.5em;
}

.prominent {
	padding: .5em;
}
div#content .prominent > p {
	margin-bottom: 0;
}

div#left_wide ol {
	margin-left: 1.7em;
}

div#left_wide ul {
	margin: 0 0 1em 1.7em;
}

/* =suchbox */
div#suchbox {
	position: relative;
	margin-top: 50px;
}

div#navsuchbox {
	position: absolute;
	left: -1px;
	top: -1px;
	width: 210px;
	height: 21px;
}

div#navsuchbox a {
	display: block;
	float: left;
	margin-right: 2px;
	padding: 1px 3px;
}

div#navsuchbox + p {
	font-size: 90%;
}

div#navsuchbox + p a {
	padding-left: 16px;
	background: transparent url(/media/image/icon-delete-small.png) no-repeat left center;
}

div#suchbox > p {
	margin-top: 21px;
	padding: 5px;
}

div#suchbox ul {
	list-style-type: none;
	height: 540px;
	position: relative;
	overflow: auto;
}

div#suchbox ul li {
	padding: 5px;
	clear: left;
	position: relative;
	min-height: 75px;
}

div#suchbox ul li img {
	float: left;
	margin: 5px 5px 0 0;
}

div#suchbox ul li p + p {
	position: absolute;
	right: 5px;
	bottom: 1px;
	font-size: 90%;
	text-align: right;
}
div#suchbox ul li p + p a {
	padding-left: 16px;
	background: transparent url(/media/image/icon-delete-small.png) no-repeat left center;
}

/* =buchungsanfragebox */
div#buchungsanfragebox {
	width: 300px;
	margin: 0 15px 1em 0;
}

div#buchungsanfragebox > div {
	padding: 5px;
}

/* =submenubox */
div.submenubox {
	width: 300px;
	margin-right: 15px;
}

div.submenubox > div {
	padding: 5px;
}

/* =submenubox_info */
div.submenubox_info {
	width: 230px;
	margin-right: 15px;
}

div.submenubox_info > div {
	padding: 5px;
}

/* =teaserContainer */
div.teaserContainer {
	margin-bottom: 1em;
	padding: 10px;
	padding-top: 12px;
}

div.teaserContainer h4 {
	margin-bottom: 5px;
}

div.teaserContainer img {
	float: center;
	margin: 0 5px 5px 0;
}

/* =teaserContainerleft */
div.teaserContainerleft {
	width: 250px;
	margin-bottom: 1em;
	padding: 10px;
	padding-top: 12px;
}

/* =teaserContainerleft_suche */
div.teaserContainerleft_suche {
	width: 230px;
	margin-bottom: 1em;
	padding: 10px;
	padding-top: 12px;
}

/* =teaserContainerleft_small */
div.teaserContainerleft_small {
	width: 230px;
	margin-bottom: 1em;
	padding: 10px;
	padding-top: 12px;
	margin: 0 5px 5px 0;
}

div.teaserContainerleft h4 {
	margin-bottom: 5px;
}

div.teaserContainerleft img {
	float: center;
	margin: 0 5px 5px 0;
}

/* =footer */
div#footer {
	clear: both;
	width: 980px;
	margin: 0 auto;
}

div#footer li {
	float: left;
	padding: 0 5px;
}

div#footer li a {
	padding-right: 5px;
}

/* =clear */
.clear {
	clear: both;
}

/* =Suche und Newsletter */
form#frmAuswahl, form#frmNewsletter {
	padding: 1em .5em 0 .5em;
	margin-bottom: 1em;
}
form#frmAuswahl p, form#frmNewsletter p {
	margin-bottom: 1em;
}
form#frmAuswahl label, form#frmNewsletter label {
	display: block;
	float: left;
	width: 130px;
}

form#frmAuswahlohne, form#frmNewsletter {
	padding: 1em .5em 0 .5em;
	margin-bottom: 1em;
}
form#frmAuswahlohne p, form#frmNewsletter p {
	margin-bottom: .6em;
}
form#frmAuswahlohne label, form#frmNewsletter label {
	display: block;
	float: left;
	width: 130px;
}


form#frmNewsletter .checkbox label {
	display: inline;
	float: none;
	padding-right: 1em;
}
form#frmNewsletter .checkbox input {
	margin-right: .2em;
}
form#frmNewsletter .checkbox + .checkbox > label {
	padding-left: 90px;
}
form#frmNewsletter .checkbox + .checkbox > label + label {
	padding-left: 10px;
}

form#frmAuswahlInteressen {
	width: 90%;
}
form#frmAuswahlInteressen fieldset {
	float: left;
	width: 30%;
	height: 225px;
	margin: 0 3% 1em 0;
}
div#content fieldset#basis {
	width: 100%;
	float: left;
	height: 177px;
}
div#content fieldset#basis p {
	margin-bottom: 1em;
}
form#frmAuswahlInteressen label {
	display: block;
}
div#content fieldset#basis label {
	float: left;
	width: 130px;
}

/* =Auswahlkarte */
#portoferraio, #azzurro, #lacona, #marina, #capoliveri, #west {
	position: absolute;
	width: 300px;
	border: 1px solid #30648d;
	background-color: #F0F4F8;
	padding: 5px;
	z-index: 2;
	left: 200px;
	top: 100px;
}
.infoLayer h4 {
	font-size: 140%;
	margin: 2px 0 .7em 0;
	padding-top: 2px;
	border-top: 1px solid #DAE1E9;
}
.infoLayer p + p {
	border-top: 1px solid #DAE1E9;
	margin-top: 2px;
	padding-top: 2px;
}

/* =Suchergebnisse */
ul#searchresult, ul#faq {
	width: 90%;
}
.lastminute {
	border-top: 1px dotted #DAE1E9;
	margin-top: 1em;
}
ul#searchresult h3 {
	margin-bottom: .7em;
}
ul#searchresult li {
	padding: 15px 5px 15px 5px;
}
ul#searchresult li img {
	float: left;
	margin-right: 5px;
}
p.paging {
	margin: .5em 0 1em 0;
}
p.paging a {
	padding: 0 2px;
}

/* =Formularelemente */
input, select, textarea {
	padding: 1px;
}

/* =Tabelle Preisinformationen */
#pricingTable {
	border-collapse: collapse;
	background-color: #F7F9FB;
	margin-bottom: 10px;
}
#pricingTable th, #pricingTable td {
	padding: 8px 12px;
	color: #24456E;
	border-right: 1px solid #D1DAE4;
}
#pricingTable thead {
	height: 50px;
}
#pricingTable th {
	vertical-align: top;
	font-weight: normal;
	text-align: left;
	color: inherit;
	white-space: nowrap;
}
#pricingTable .odd {
	background-color: #DFEAF3;
}
#pricingTable .borderRight {
	border-right: none;
}

/* Merkzettel: Buchungsanfrage */
#frmBuchungsanfrage #stammdaten, #frmBuchungsanfrage #zeitraum, #frmBuchungsanfrage #personen {
	border: none;
	margin: 0 0 15px 0;
	padding: 0;
}

#frmBuchungsanfrage #stammdaten label, #frmBuchungsanfrage #zeitraum label, #frmBuchungsanfrage #personen label {
	display: block;
	width: 100px;
	float: left;
	margin: 8px 0 0 0;
}

#frmBuchungsanfrage #stammdaten input, #frmBuchungsanfrage #zeitraum input, #frmBuchungsanfrage #personen input {
	width: 300px;
	margin: 5px 0;
}

#frmBuchungsanfrage #stammdaten select {
	margin: 5px 0;
}

/* =frmFaehre */
#frmFaehre #stammdaten, #frmFaehre #auto, #frmFaehre #anreise, #frmFaehre #abreise {
	border: none;
	margin: 0 0 15px 0;
	padding: 0;
}

#frmFaehre #stammdaten label, #frmFaehre #auto label, #frmFaehre #anreise label, #frmFaehre #abreise label {
	display: block;
	width: 140px;
	float: left;
	margin: 8px 0 0 0;
}

#frmFaehre #auto label {
	clear: left;
}

#frmFaehre #stammdaten input, #frmFaehre #auto input, #frmFaehre #anreise input, #frmFaehre #abreise input {
	width: 260px;
	margin: 5px 0;
}

#frmFaehre #auto #anz_erw, #frmFaehre #auto #anz_kids, #frmFaehre #auto #anz_baby, #frmFaehre #anreise #anreisezeit, #frmFaehre #abreise #rueckreisezeit {
	width: 50px;
}

#frmFaehre #stammdaten select {
	margin: 5px 0;
}

.frmSent {
	margin-left: 100px;
	padding: 10px 0 0 0;
}

/* =Webcam Stundenuebersicht */
div#content .webcamright ul li {
	float: left;
	margin: 0 10px 10px 0;
}

/* =FAQ */
#faq {
	padding-bottom: 20px;
	margin-bottom: 2em;
}

/* =Googlemap */
#elbamap {
	width: 300px;
	height: 250px;
}