body{
background-image:url(bilder/background/leuchtturm.jpg);
background-repeat:no-repeat;
background-color:#cc0000;
background-attachment:fixed;
background-position:top left;
}

#wrapper{
width:800px;
height:100%;
background-color:none;
position:relative;
margin:auto;
}

#header{
width:800px;
height:300px;
background-color:white;
}

#headbild{
width:760px;
height:260px;
background-color:none;
top:20px;
left:20px;
position:relative;
}

#hausmarrakesch{
position:absolute;
top:100px;
left:25px;
width:400px;
height:50px;
background-color:none;
z-index:2;
color:#d32b1f;
font-family:Brush Script Std;
font-size:45px;
}

#navi{
width:800px;
height:100px;
background-color:green;
position:relative;
background-color:lightgrey;
height:30px;
font-size:19px;
text-align:center;
z-index:3;
font-family:Tunga;
}

#navi ul {
    padding: 0px;
    margin: 0px;
	border:solid;
	border-width:2px;
	border-color:grey;
}
#navi ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
}
    #navi ul,nav ul li{
    background-color:white;
}
    #navi ul li {
    list-style: none;
    float:left;
}
#navi ul li a {
    text-decoration: none;
    display: block;
    color: #333;
    padding: 8px 34px 8px 34px;
	
}

#navi ul li:hover > ul {
    visibility: visible;
}

#navi ul li ul{

    
    visibility: hidden;
    position: absolute;
}
#navi ul li ul li{
	list-style-type:none;
    float: none;
	width:158px;
	border:none;
	text-align:center;
	
			
}
#navi ul li ul li a:hover{
    color:black;
}


#navi ul {
    padding:0px;
    margin:0px;
 
   
}
#navi ul li {
	list-style: none;
    float:left;
    border-right:1px solid #dfdfdf;
	width:158px;
	text-align:center;
	
}
#navi ul li a {
    text-decoration: none;
    display: block;
    color: #333;
    padding: 8px 34px 8px 28px;
	text-align:center;
	
    -webkit-transition: background 0.3s ease-out 0s;
    -moz-transition: background 0.3s ease-out 0s;
    -o-transition: background 0.3s ease-out 0s;
    transition: background 0.3s ease-out 0s;
}

#navi ul li.cat1:hover a, nav ul li.cat1:hover > ul li a  {
    background-color:#d32b1f;
	text-decoration:none;
	color:white;
}

#navi ul li.cat2:hover a, nav ul li.cat2:hover > ul li a  {
    background-color:#d32b1f;
	text-decoration:none;
	color:white;
}

#navi ul li.cat3:hover a {
    background-color:#d32b1f;
	text-decoration: none;
	width: auto;
	color:white;
}

 #navi ul li.cat3:hover > ul li a {
    background-color:darkgrey;
	text-decoration: none;
	width: auto;
	text-align:left;
	padding-left:15px;
}

#navi ul li.cat4:hover a {
    background-color:#d32b1f;
	text-decoration: none;
	width: auto;
	color:white;
    border-right:1px solid #dfdfdf;
}

#navi ul li.cat5:hover a, nav ul li.cat5:hover > ul li a {
    background-color:#d32b1f;
	text-decoration:none;
	color:white;
	width: auto;
}


#navi ul li:hover > a {
    color: #FAFAFA;
	
}

#navi ul li ul li a {
    color: #FAFAFA;
}

#navi ul li ul li a:hover{
    color: black;
	text-decoration:bold;
    background-color:#d32b1f!important;
}

#wappenm{
position:absolute;
top:380px;
left:620px;
width:110px;
height:120px;
background-color:none;
z-index:2;
background-image:url(bilder/wappen/wappen-marokko.png);
background-repeat:no repeat;
}

#wappenb{
position:absolute;
top:380px;
left:60px;
width:131px;
height:120px;
background-color:none;
z-index:2;
background-image:url(bilder/wappen/borkumwappen.png);
background-repeat:no repeat;
}

#starttext{
top:360px;
left:120px;
width:500px;
height:auto;
font-size:40px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Candara;
}

#sub{
top:410px;
left:120px;
width:500px;
height:150px;
float:left;
font-size:30px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Candara;
}

.marrakesch{
font-family:Candara;
font-size:18px;
}

.bye{
line-height:50px;
}

#intro{
top:480px;
left:70px;
width:600px;
height:150px;
float:left;
font-size:20px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
line-height:20px;
}

#text1{
top:300px;
width:720px;
height:250px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text2{
top:300px;
width:720px;
height:900px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text3{
top:300px;
width:720px;
height:250px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text4{
top:300px;
width:720px;
height:500px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text5{
top:300px;
width:720px;
height:600px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text6{
top:300px;
width:720px;
height:400px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}

#text7{
top:300px;
width:720px;
height:780px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}


#text8{
top:300px;
width:720px;
height:300px;
font-size:60px;
padding:40px;
background-color:#ecbb6b;
opacity:0.6;
z-index:0;
}  /*LÖSCHEN*/

#footer{
width:800px;
height:50px;
background-color:white;
border-top:solid 2px grey;
}

#impressum{
width:100px;
height:50px;
left:350px;
background-color:none;
font-size:18px;
text-align:center;
font-family:Tunga;
position:relative;
top:8px;
}

#impressum a{
text-decoration:none;
color:black;
}

#impressum a:active{
color:grey;
}

#impressum a:hover {
text-decoration:underline;
}


#contact{
top:380px;
left:370px;
width:400px;
height:150px;
float:left;
font-size:20px;
padding:40px;
background-color:none;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
}

#contactinfo{
top:400px;
left:30px;
width:300px;
height:150px;
float:left;
font-size:18px;
padding:40px;
background-color:none;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
text-align:left;
}

.uberschrift{
font-size:20px;
font-family:Candara;
}

.abstand{
line-height:20px;
}

.rechts{
padding-left:66px;
}

.rechts1{
padding-left:14px;
}
  
.rechts2{
padding-left:5px;
}

/* Das Kontaktformular */ 
form {
  background-color:none;
  width: 370px; /* Breite des Formulars */
  padding: 20px;
}
label { /* Beschriftung auf eigener Zeile */
  display: block;
  cursor: pointer; /* Mauszeiger wird zur Hand */
}
input#absender,
textarea {
  width: 300px;
  border: 1px solid #8c8c8c;
  margin-bottom: 1em;
}
textarea {
  height: 7em;
}
input:focus,
textarea:focus {
  background-color:none;
}

#bild1{
top:430px;
left:100px;
width:520px;
height:100px;
float:left;
font-size:60px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Candara;
}

#plan{
top:320px;
left:110px;
width:500px;
height:550px;
float:left;
font-size:60px;
padding:40px;
background-color:none;
text-align:right;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Candara;
}

#impressumtext{
top:330px;
left:110px;
width:500px;
height:150px;
float:left;
font-size:18px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
}

#bib{
top:500px;
left:0px;
width:500px;
height:150px;
float:left;
font-size:18px;
padding:40px;
background-color:none;
text-align:center;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
}

.quelle{
font-size:14px;
}

.bold{
font-weight:bold;
}

#impressumtext a{
text-decoration:none;
color:lightgrey;
}

#impressumtext a:active{
color:grey;
}

#impressumtext a:hover {
text-decoration:underline;
}

#information{
top:360px;
left:0px;
width:680px;
height:250px;
float:left;
font-size:18px;
padding-left:60px;
padding-right:60px;
padding-top:40px;
background-color:none;
text-align:left;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
line-height:20px;
}

#texto{
top:365px;
left:85px;
width:600px;
height:60px;
float:left;
font-size:18px;
padding:20px;
background-color:none;
text-align:center;
color:white;
z-index:1;
opacity:none;
position:absolute;
font-family:Tunga;
line-height:20px;
}

#information{
top:360px;
left:0px;
width:680px;
height:250px;
float:left;
font-size:18px;
padding-left:60px;
padding-right:60px;
padding-top:40px;
background-color:none;
text-align:left;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
line-height:20px;
}

#anreisetext{
top:360px;
left:0px;
width:680px;
height:250px;
float:left;
font-size:18px;
padding-left:60px;
padding-right:60px;
padding-top:40px;
background-color:none;
text-align:left;
color:white;
z-index:0;
opacity:none;
position:absolute;
font-family:Tunga;
line-height:20px;
}

#anreisetext a{
text-decoration:none;
color:lightgrey;
}

#anreisetext a:active{
color:grey;
}

#anreisetext a:hover {
text-decoration:underline;
}

#contactinfo a{
text-decoration:none;
color:lightgrey;
}

#contactinfo a:active{
color:grey;
}

#contactinfo a:hover {
text-decoration:underline;
}