/*  =========================================================
Datei: riel.css
Media: screen, projection 

Datum: 15. Juli 2006
                                   
1. Allgemeine Selektoren 
   - Block-Elemente
   - Inline-Elemente
   - Allgemeine Klassen
   - Non-Layout IDs  
                              
2. Layoutbereiche 
   - Wrapper 
   - Kopfbereich   
   - Navibereich   
   - Textbereich   
   - Fussbereich   

3. Spezielle Seiten 
   - Kontaktformular 

========================================================== */

/* ===============================

   =1. Allgemeine Selektoren

=============================== */
html, body{
    margin:0;
    padding:0;
    text-align:center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    text-decoration: none;
    background-image: url(../gifs/site/pageback.gif);
    background-repeat: repeat;
	font-size:100%;
}

/* ===============================
   =Block-Elemente 
=============================== */
h1 {
    color: #666666;
    margin-left: 5px;
    line-height: 1.2em;
    margin-right: 3px;
    font-size: 0.6em;
}
h2 {
    font-size: 0.8em;
    color: #666666;
    text-align: left;
    font-weight: bold;
    line-height: 2.2em;
    padding-left: 70px;
}
h3 {
    font-size: 0.7em;
    color: #FFFFFF;
    font-weight: bold;
    text-transform: uppercase;
    background-color: #666666;
    text-align: center;
    display: block;
    line-height: 1em;
    padding-top: 2px;
    padding-bottom: 2px;
}
h4 {
    font-size: 0.7em;
    color: #666666;
    margin-left: 3px;
    text-align: left;
    font-weight: normal;
    padding-left: 70px;
    padding-right: 30px;
    line-height: 1.4em;
}
h5 {
	font-size: 0.7em;
	color: #666666;
	margin-left: 3px;
	text-align: left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding: 0px 30px 0px 70px;
	line-height: 16px;
}
p {
    font-size: 0.8em;
	color: #333333;
	line-height: 0.8em; }
.headline {
    font-size: small;
    font-weight: bold;
    color: #000000;
}
/* ===============================
   =Inline-Elemente 
=============================== */
a {
    font-size: 0.8em;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-weight: bold;
    line-height: 1.3px;
}
a:link, a:visited {
    text-decoration: none;
    font-size: 0.7em;
    font-weight: bold;
}
a:hover, a:active {
    text-decoration: none;
    color: #000000;
}
/* ===============================
   =Classes allgemeiner Art 
=============================== */
.clear {clear: both;}


/* ========================================

  =2. LAYOUTBEREICHE

========================================= */ 
/*+++++++++++++++++++++++++ Kontaktfeld +++++++++++++++++++++++*/
#kontaktfeld {
	width: 560px;
	line-height: 0.8em;
	bottom: 30px;
	margin-bottom:20px;
}
#kontaktfeld .rahmen {
	border-top: 2px solid #FFCC00;
	margin-left:75px;
	padding-top:10px;
	width:450px;
	line-height: 0.9em;
}
#kontaktfeld .pfeil {
	float:left;
	margin-right:10px;
	margin-bottom:100px;
}
#kontaktfeld a:link, #kontaktfeld a:hover, #kontaktfeld a:visited {
	font-size: 0.8em;
	color:#000000;
}
.kontaktname {
    color: #333333;
    font-weight: bold;
    font-size: 0.7em;
}
.kontaktdetail {
	color: #666666;
	font-size: 0.7em;
}
.kontakt {
    color: #666666;
    font-weight: bold;
    font-size: 0.7em;
    line-height: 1.4em;
}
/* +++++++++++++++++++++++++++ HAUPT-CSS ++++++++++++++++++++++++*/ 
#pagewidth{
	width:960px;
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	height:550px;
} 

#header{
	height:90px;
	width:100%;
	background-color:#FFCC00;
	padding-top: 5px;
 } 
#leftcol{
    width:190px;
    float:left;
    position:relative;
    margin-left:-190px;
    margin-right:1px;
    background-color: #CCCCCC;
 }
#navi {
    background-image: url(../gifs/navi/naviga.gif);
    height: 31px;
    border-bottom: 8px solid #FFFFFF;
    background-repeat: repeat;
}
#outer{
	background-color: #FFFFFF;
	width: auto;
	border-top: 0px solid white;
	border-right: 190px solid #CCCCCC;
	border-bottom: 0px solid white;
	border-left: 190px solid #CCCCCC;
 } 
 
#rightcol{
	width:190px;
	float:right;
	position:relative;
	margin-right:-190px;
	margin-left:1px;
	background-color: #CCCCCC;
} 
#footer{
    height:25px;
    width:100%;
    background-color:#FFCC00;
    text-align: center;
    color: #666666;
    vertical-align: middle;
} 
 
#inner{margin:0; width:100%;}
 
#maincol{
    float: left;
    width: 100%;
    margin: 0 -8px 0 -2px;
    overflow: auto;
    color: #333333;
 }
 
#maincol2 {
	float: left;
	width: 100%;
	margin: 0 -8px 0 -2px;
	color: #333333;
	position: relative;
 } 
#homeflash {
	height:148px;
	padding-left:1px;
}
#banner-ad {
	z-index:10;
	position: absolute;
	top:210px;
}
*html #banner-ad {
	left:25px;
}
html*#banner-ad {
	left:25px;
}
#banner-ad {
	margin-left:54px;
	left:25px;
}

#outer>#inner { 
border-bottom: 1px solid #FFFFFF;  
}
 
.clr{clear:both;}
 
.content{
    padding-left: 1px;
} /*padding for content */ 
.contentim {
    padding-left: 1px;
}
.contentim a:link, .contentim a:hover, .contentim a:visited {
	color:#000000;
}
/* ################## Aktiv Seiten ###############*/
.content .links1 {
	float:left;
	width:300px;
	font-size: 0.7em;
	margin: 30px 0 20px 40px;
	line-height:1.4em;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #FFCC00;
	padding-right: 8px;
}
*html .content .links1 {
	margin-left:20px;
}
.content .uschrift {
	font-size:larger;
	font-weight: bold;
	color: #000000;
}
.content .kastenu {
	background-color:#333333;
	font-weight: bold;
	color:#FFFFFF;
	display: block;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 5px;
	width: 170px;
	margin-left: 5px;

}
.content .links2 {
	float:left;
	width: 170px;
	font-size: 0.7em;
	margin: 30px 0 20px 0px;
	line-height:1.4em;
}
.content .einzug {
background-color:#CCCCCC;
	width:150px;
	padding-left:5px;
	line-height: 2em;
	font-size: 0.7em;
	font-weight: bold;
	margin-left: 5px;
}

.content .download {
	list-style:none;
	width:130px;
	padding-right: 30px;
	display: block;
	margin:0 0 10px 10px;
}
.content .download a:link, .content .download a:visited {
	background-image: url(../gifs/buttons/C_down_p.gif);
	background-repeat: no-repeat;
	list-style:none;
	color:#CCCCCC;
	height:30px;
	padding:2px 40px 20px 22px;
	font-size:1em;
}
.content .download a:hover, .content .download a:active {
	background-image: url(../gifs/buttons/C_down_hi.gif);
	background-repeat: no-repeat;
	width: 83px;
	height: 23px;
	color:#FFFFFF;
	font-size:1em;
}
.content .ctrennlinie {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF;
	margin-right: 5px;
	margin-bottom:10px;
}
.content .linksbund {
	width: 150px;
	margin-left:5px;
}
/* ------------------------------------ */
#header .content{padding-bottom:0;} /*padding bottom 0 to remove space in IE5 Mac*/ 

/* +++++++++++++++++++ infobereich +++++++++++++++++++++++*/ 
#infos {
    padding-left: 12px;
    font-size: 0.8em;
}
*+html #infos {
	margin-top:-20px;
}
html*#infos {
	margin-top:-20px;
}
.ikasten {
	height:138px;
	width:261px;
	margin-bottom:20px;
	float:left;
	position: relative;
	bottom: -20px;
} 
.ikasten .ibild {
	width:155px;
	height:108px;
	float:left;
}
.ikasten .inavi {
	width:106px;
	height:98px;
	background-color:#CCCCCC;
	float:left;
	padding-top: 10px;
}
.ikasten .iunten {
	background-color:#FFCC00;
	height:10px;
	width:261px;
}

#news {
	border: 1px solid #666666;
	margin: 5px;
}
*html #news {
	width: 170px;
}
#news .n_hi {
	background-color: #CC0000;
	color: #000000;
	padding-bottom: 5px;
	text-align: center;
}
#syltlogo {
	background-image: url(../gifs/site/Sylt-Logo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	width: 160px;
	height: 90px;
	margin-bottom: 5px;
}

.aligncenter {
    text-align: center;
}
.punkte {
    border-top-width: 1px;
    border-top-style: dotted;
    border-top-color: #666666;
}
#table {
    line-height: 14px;
    width: 540px;
}

#table td{
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 16px;
}

#table th {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    line-height: 16px;
    border-bottom-width: 3px;
    border-bottom-style: solid;
    border-bottom-color: #FFFFFF;
}

/*calender */
 #calContainer {
    width: 190px;
    bottom: -130px;
    position: relative;
}
 #calContainer2 {
    width: 190px;
	bottom:20px;
    position: relative;
}
 #calContainer3 {
    width: 190px;
}
.month, .nav{
    background-color: #666666;
    color: #EAEAEA;
    font-size: 0.8em;
    border-top-width: 2px;
    border-bottom-width: 2px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-color: #666666;
    border-bottom-color: #666666;
}
*html .month {
	text-align:center;
}
.nav{
    cursor: hand;
}
.dayHeader{
    color: #666666;
    border-bottom: 1px solid #666666;
    font-weight: bold;
    font-size: 0.7em;
    background-color: #CECECE;
}
.empty{
    background-color: white;
}
.days{
    color: #666666;
    background-color: #EFEFEF;
    font-size: 0.7em;
    text-align: center;
    border-top-width: 4px;
    border-bottom-width: 4px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-color: #EFEFEF;
    border-bottom-color: #EFEFEF;
}
.date{
    color: #FFFFFF;
    font-weight: bold;
    background-color: #CC0000;
    font-size: 0.7em;
    text-align: center;
}
/*Ende calender */

#inhalt {
    width:560px;
    float:left;
    background-color:#FFFFFF;
    height: 480px;
    left: 190px;
    padding: 0px 0px 0px 0px;
    clear: both;
    overflow: auto;
}

#FormularS {
    background-color: #FFFFCC;
    font-size: 0.7em;
    font-weight: bold;
    color: #666666;
    border-bottom-width: 2px;
    border-bottom-color: #666666;
}

/*----------------------------------------------- */

#form-wrapper {
	float: left;
	background-color: #FFFFCC;
	padding-left: 70px;
}
form {
	font-size: 0.7em;
	padding-top: 20px;
	width: 490px;
}
form div.name {
float: left;
width: 210px;
}

form div.phone {
	float: right;
	width: 210px;
	margin-right: 30px;
}

label {
display: block;
color: #333333;
margin: 0 0 3px;
}

label span {
color: #a00;
}

input, select, textarea {
display: block;
margin: 0 0 10px;
padding: 0;
border: 1px solid #ccc;
color: #333333;
}

.subject {
	margin-bottom: 10px;
	padding-top: 5px;
}

input, textarea { padding: 2px; }

textarea {
width: 288px;
height: 120px;
margin: 0 0 18px;
}

/* hide from IE5-Mac \*/
* html #contact form textarea { width: 285px; }
/* stop hiding from IE5-mac */

input#name { width: 180px; }
input#phone { width: 180px; }
input#email { width: 180px; }
select#subject { width: 200px; }

input#submit { border: none; }

input.hidden { display:none; }

.punkte {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFCC00;
	margin-bottom: 15px;
	margin-right: 40px;
}

.anfahrt {
	width: 310px;
	margin-left: 0px;
	background-position: right;
	text-align: right;
	margin-right: 30px;
	float: right;
}
.anreise {
	text-align: left;
	font-size: 0.8em;
	font-weight: bold;
	float: left;
	margin-left: 60px;
	height:150px;
}
.anreise a:link {
	color: #CC0000;
}
.anreise a:hover {
	color:#000000;
}
.halterr {
	margin-left: 10px;
}

 /*submenu styles*/ 
h2.first {margin: 0; color: #FFFFFF;}
#p7swapmenu {
	position: absolute;
	width: 190px;
}

#p7swapmenu ul {
	margin: 4px 0px 0px -40px;
	line-height: 0.2em;
}
*html #p7swapmenu ul {
	margin: 4px 0px 0px 0px;
}
#p7swapmenu li {
	list-style-type: none;
}

.closed a, .open a, .visited a {
	background-position: 0px 50%;
	background-color: #999999;
	display: block;
    border-bottom: 1px solid #CCCCCC;
	background-repeat: no-repeat;
	padding: 9px 5px 8px 12px;
	margin-top:2px;
}
*html .closed a {
	margin-top:0px;
	margin-top /**/:-15px;
	padding-top: 5px;
}
*html .open a {
	margin-top:0px;
	padding-top: 5px;
}
*html .visited a {
	margin-top:0px;
	padding-top: 5px;
}

.closed a:hover, .open a:hover {
    color: #FFFFFF;
    background-image: url(../gifs/buttons/pf_hi3.gif);
    background-color: #CC0000;
}

.closed a {
	background-image: url(../gifs/buttons/pf_p.gif);
	text-indent: 17px;
	background-color: #999999;
	color: #CCCCCC;
}

.open a {
	background-image: url(../gifs/buttons/pf_hi3.gif);
	text-indent: 17px;
	background-color: #CC0000;
	color: #FFFFFF;
	background-position: left center;
	background-repeat: no-repeat;
}

.closed ul a, .open ul a, .open ul a:hover {
    background-image: url(../gifs/buttons/pf_hi.gif);
    background-repeat: no-repeat;
    background-position: 0% 50%;
    border: 0;
    font-weight:normal;
    padding: 0 0 0 12px;
    margin: 0 0 0 16px;
    text-indent: 17px;
    background-color: #FFFFFF;
}

.open ul a:hover {
background-color : #cc0000; 
letter-spacing : 0.1em; 
color : #ffffff; 
background-image : url(../gifs/buttons/pf_hi3.gif); 
} 

#p7current {
    font-weight: bold;
    color: #FFFFFF;
    background-color: #CC0000;
}

.teams {
    color: #666666;
    font-weight: bold;
    font-size: 0.7em;
    line-height: 2em;
    text-decoration: underline;
    padding-left: 0px;
}
h6 {
    font-size: 0.6em;
    color: #666666;
    text-align: left;
    margin-left: 5px;
    margin-right: 5px;
}
.abnews {
	padding-top: 5px;
	padding-bottom: 5px;
}

/*impressum*/
#Imp {
	text-decoration: none;
	font-weight: bold;
}

#Imp a:link, #Imp a:visited {
	text-decoration: none;
	font-size: 0.7em;
	font-weight: bold;
	color: #666666;
	line-height: 12px;
}

#Imp a:hover, #Imp a:active {
    text-decoration: none;
    color: #000000;
}
.Stil1 {
	color: #333333;
}

 /*printer styles*/ 
@media print{ 
/*hide the left column when printing*/
#leftcol{display:none;} 
#outer{border-left:0;} 

/*hide the right column when printing*/
#rightcol{display:none;} 
#outer{border-right:0;} 
}

.ein_datum {
	height: 18px;
	width: 25px;
	float:left;
	margin-right:10px;
	voice-family:"\"}\"";
	voice-family:inherit;
	height:12px;
}
*html .ein_datum {
	height /**/: 20px;
	width /**/: 30px;
	margin-bottom: 10px;
}
.ein_klappe {
	height: 18px;
	width: 120px;
	voice-family:"\"}\"";
	voice-family:inherit;
	height:12px;
	margin-bottom:0px;
}
div>.ein_klappe {
	margin-bottom:20px;
	height:22px;
}
*html .ein_klappe {
	height /**/: 22px;
	width /**/: 120px;
}
.ein_pers {
	height: 18px;
	width: 35px;
	margin-right:10px;
	voice-family:"\"}\"";
	voice-family:inherit;
	height:12px;
}
*html .pers {
	height /**/: 22px;
	width /**/: 40px;
}
input {
	border: 1px solid #666666;
}
input .check {
	width:10px;
	height:10px;
}
#robotKeywords {
	display:none;
}.strip_gelb {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFCC00;
	height: 10px;
	margin-top: 10px;
}
.strip_sw {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #000000;
	height: 10px;
}
.ueber_agb {
	color: #FFFFFF;
	background-color: #000000;
	width: 450px;
	padding-top: 2px;
	padding-bottom: 2px;
	padding-left: 5px;
	font-weight: bold;
	margin-top: 30px;
}
.black {
	font-weight: bold;
	color: #000000;
}
.spacer {
	width:20px;
}
#fluganreise {
	font-size: 0.7em;
	padding-left: 40px;
	width: 480px;
}
#fluganreise .gera {
	height:16px;
	width:480px;
	background-color: #FFCC00;
	padding-left: 5px;
	font-weight:bold;
	font-size:0.85em;
	color:#000000;
	padding-top: 4px;
}
#fluganreise .ue {
	font-weight:bold;
	text-decoration: underline;
}
#fluganreise a:link, #fluganreise a:visited {
	font-size:0.8em;
	color:#666666;
	text-decoration: underline;
}
#fluganreise a:hover {
	font-size:0.8em;
	color:#000000;
	text-decoration: underline;
}
/* ++++++++++++++++++ IMMO +++++++++++++++++++++++ */
.headlinemaster {
	font-weight: bold;
	color: #666666;
	text-decoration: underline;
	font-size: 0.9em;
}

.headlinedetail {
	color: #333333;
	font-size: 0.75em;
	line-height: 0.8em;
}
*html .headlinedetail {
	line-height:1.2em;
	padding-top:-5px;
}
#immo-content {
	float: left;
	width: 100%;
	margin: 0 -8px 0 -2px;
	color: #333333;
	position: relative;
 } 
#immo-content .preis {
    color: #333333;
    font-weight: bold;
    font-size: 0.8em;
}
#Dinhalt {
	width:560px;
	float:left;
	background-color:#FFFFFF;
	padding: 0px;
	clear: both;
	overflow: scroll;
	position: relative;
	height: 550px;
}
#immoinhalt {
	width:560px;
}
#immo-content .s1 {
	width: 500px;
	background-color: #FFCC00;
	background-position: top;
	position: relative;
	float: left;
	left: 40px;
	padding: 2px 0 2px 20px;
	height: 100px;
	margin-bottom: 20px;
}
/* Target Firefox 3 */
.s1, x:-moz-any-link, x:default {
width: 500px;
	background-color: #FFCC00;
	background-position: top;
	position: relative;
	float: left;
	left: 40px;
	padding: 2px 0 2px 20px;
	height: 100px;
	margin-bottom: 20px;
}
.s2, x:-moz-any-link, x:default {
	background-color: #FFFFFF;
	width: 443px;
	float: left;
	height: 100px;
	position: relative;
	line-height:1em;
}
.s2 .objbild, x:-moz-any-link, x:default {
	height:100px;
	width:133px;
	float: left;
	background-color: #999999;
}
.s2 .ortue, x:-moz-any-link, x:default {
	width:178px;
	height:17px;
	margin:5px 0 0 0;
}
.stext, x:-moz-any-link, x:default {
	font-size: 0.8em;
	vertical-align: top;
	width: 270px;
	text-align: left;
	float: left;
	margin-left: 30px;
}
/* IE 7 */
* + html .s1 {
width /*\**/: 500px;
	background-color /*\**/: #FFCC00;
	background-position /*\**/: top;
	position /*\**/: relative;
	float /*\**/: left;
	left /*\**/: 40px;
	padding /*\**/: 2px 0 2px 20px;
	height /*\**/: 100px;
	margin-bottom /*\**/: 20px;
}
* + html .s2 {
	background-color: #FFFFFF;
	width: 443px;
	float: left;
	height: 100px;
	position: relative;
	line-height:1em;
}
* + html .s2 .objbild {
	height:100px;
	width:133px;
	float: left;
	background-color: #999999;
}
* + html .s2 .ortue {
	width:178px;
	height:17px;
	margin:5px 0 0 0;
}
* + html .stext {
	font-size: 0.8em;
	vertical-align: top;
	width: 270px;
	text-align: left;
	float: left;
	margin-left: 30px;
}


#immo-content .s2 {
	background-color: #FFFFFF;
	width: 443px;
	float: left;
	height: 100px;
	position: relative;
	line-height:1em;
	border: 1px solid #039;
}

#immo-content .s2 .objbild {
	height:100px;
	width:133px;
	float: left;
	background-color: #999999;
}
#immo-content .s2 .ortue {
	width:178px;
	height:17px;
	margin:5px 0 0 0;
}
#immo-content .stext {
	font-size: 0.8em;
	vertical-align: top;
	width: 270px;
	text-align: left;
	float: left;
	margin-left: 30px;
}
*html #immo-content .stext {
	line-height: 1.1em;
}

.team {
	font-size: 0.7em;
	font-weight: bold;
	text-decoration: underline;
	line-height: 2em;
	color: #666666;
	margin-left: 40px;
}
.detail {
	color: #666666;
	font-size: 0.7em;
	margin-left: 40px;
}
/*++++++++++++++++++++++++++++++++
Thumbnail viewing
++++++++++++++++++++++++++++++++*/
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #FFF;
padding: 2px;
left: -1000px;
border: 1px solid gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
width:350px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 5px; /*position where enlarged image should offset horizontally */

}


/*++++++++++++++++++++++++++++++++*/
#expo {
	border: 2px solid #FFCC00;
	width: 470px;
	margin-left: 40px;
	margin-top: 10px;
	padding-left: 5px;            
}
*html #expo {
	width:460px;
}


#expo .result {
	width:115px;
	height:5px;
}
#expo .kdetail {
	color: #330066;
	font-size: 0.8em;
}
#expo a:link, #expo a:visited {
	color: #666666;
	line-height: 12px;
}
#expo a:hover, #expo a:active {
	color: #000000;
}
#expo .Stil2 {color: #FFFFFF}


.objekte {
	margin-left:10px;
	padding-top:20px;
}

.objekte .objektbox1 {
	width:170px;
	height:280px;
	margin-right:10px;
	margin-bottom:20px;
	border: 2px solid #FC0;
	float:left;
}
.objekte .objektbild {
	width:170px;
	height:122px;
	margin:5px 0;
}
.objekte p {
	margin:0 3px 1px 13px;
}
.objekte .ueberschrift {
	font-size:0.75em;
	margin:0 5px 5px 0;
	font-weight:bold;
	color:#000;
	border-bottom:2px solid #FC0;
}

.objekte .preis {
	font-weight:bold;
	font-size:0.7em;
	color:#000;
	text-align:right;
	margin-right:3px;
	margin-bottom:3px;
}