html,body{
         background-color: #F0F8FF;
         margin:0px;
         padding:0px;
         }

#mittig {
         /* */
         margin-top:0px;
         margin-left:auto;
         margin-right:auto;
         padding:0px;
         width:988px;
         background-image:url(bilder/dunkelbleu.png);
         }

#text   {
         padding-left:20px;
         padding-right:20px;
         bottom:2px;
         }

#text ul li
         {
         font-family : helvetica, verdana, tahoma, arial, sans-serif;
         font-size:12pt;
         line-height: 22px;
         word-spacing:2pt;
         }

/* - - - - Navigation über dem Text - - -  */
ul#navigation {
    margin: 0;
    padding:0;
    text-align: center;
    background-color:#253650;
    }

  ul#navigation li {
    list-style: none;
    display: inline;
    padding: 0;
    margin: 0;
    }

  ul#navigation a, ul#navigation span {
    float: left;
    width: 162px;
    text-decoration: none;
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:12pt;
    margin: 0;
    padding-top: 12px;
    padding-bottom: 12px;
    border-left:#1C5D88 dotted 1px;
    color: #1C5D88;
    background-color: #BBC9DC;
  }

  ul#navigation a:hover, ul#navigation span {
    border-left:#1C5D88 dotted 1px;
    color:#D0E1F5;
    background-color:#3A5C89;
  }

  ul#navigation div {
     clear: left;
  }

/* - - - - infozeile unter Text - - - #7395B0; - */

#adresse {
    float:left;
    width:380px;
    text-align: center;
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    margin: 0;
    padding-top: 10px;
    padding-bottom:10px;
    color: #95B7DF;
    background-color: #3A5C89;
    }

#linkbox {
    float:right;
    width:608px;
    margin: 0;
    padding:0;
    }

 ul#infozeile {
    margin: 0;
    padding:0;
    text-align: center;
    background-color:#3A5C89;
  }

  ul#infozeile li {
    list-style: none;
    display: inline;
    padding: 0;
    margin: 0;
  }

  ul#infozeile a, ul#infozeile span {
    float: left;
    width: 120px;
    text-decoration: none;
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    margin: 0;
    padding-top: 10px;
    padding-bottom: 10px;
    border-left:#D0E1F5 dotted 1px;
    color: #7395B0;
    background-color: #3A5C89;
    }

  ul#infozeile a:hover, ul#infozeile span {
    border-left:#D0E1F5 dotted 1px;
    color:#D0E1F5;
    background-color:#3A5C89;
  }

  ul#infozeile div {
     clear: left;
  }

/* - - - - Navigation im Text- - - - */

#preisbox {
    float:left;
    width:200px;
    margin:0;
    padding:0;
    border-left:#1C5D88 dotted 1px;
    border-right:#1C5D88 dotted 1px;
    }

#buchungsbox {
    float:right;
    width:180px;
    margin: 0;
    padding:0;
    }

#auswahlbox {
    float:left;
    width:200px;
    height: 180px;
    margin:0;
    padding:0;
    }

ul#auswahl {
    margin: 0;
    padding:0;
    text-align: center;
    background-color:#253650;
  }

  ul#auswahl li {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  ul#auswahl a {
    display:block;
    text-decoration: none;
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:12pt;
    margin: 0;
    padding-top: 12px;
    padding-bottom: 12px;
    border-top:#1C5D88 dotted 1px;
    color: #1C5D88;
    background-color: #BBC9DC;
  }

  ul#auswahl a:hover {
    color:#D0E1F5;
    background-color:#3A5C89;
  }

#ergaenzungsbox {
    float:right;
    width:742px;
    height: 180px;
    margin: 0;
    padding:0;
    }

  ul#ergaenzung {
    width: 740px;
    margin: 0;
    padding:0;
  }

  ul#ergaenzung li {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  ul#ergaenzung a, ul#ergaenzung span {
    display:block;
    text-decoration: none;
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:12pt;
    word-spacing:2pt;
    margin: 0;
    padding-top: 12px;
    padding-bottom: 12px;
    border-top:#1C5D88 dotted 1px;
    color: #181C18;
   }

  ul#ergaenzung a:hover, ul#ergaenzung span {
    color:#181C18;
  }

div.link{
 background-color: #DEEAF8;
 margin:10px;
 border:1px solid #003478;
 font-family: verdana, arial, helvetica, sans-serif;
 font-size:8pt;
 color : #181C18;
 width: 240px;
 text-align:left;
 }

div.arr{
 background-color: #DEEAF8;
 margin:10px;
 padding:10px;
 border:1px solid #003478;
 font-family: verdana, arial, helvetica, sans-serif;
 font-size:10pt;
 color:#181C18;
 text-align:left;
 }

/* - - - - allgemeine Formate im Text - - - - */


p {
 font-family: helvetica, verdana, arial, sans-serif;
 font-size:12pt;
 color :#181C18;
 line-height: 22px;
 padding-right:10px;
 word-spacing:2pt;
 }

p.linie {
 font-family: verdana, arial, helvetica, sans-serif;
 color :#181C18;
 font-size:9pt;
 padding-top:10px;
 border-top: 1px solid #003478;
 text-align:center;
 }

p.klein {
 font-family: verdana, arial, helvetica, sans-serif;
 color : #181C18;
 font-size:9pt;
 }

p.box {
 padding: 0 10px 10px 10px;
 }


p.mittig {
 font-family: helvetica, verdana, arial, sans-serif;
 font-size:12pt;
 color:#181C18;
 /* padding-top:10px; */
 text-align:center;
 word-spacing:2pt;
 }

p.zeile  {
 clear:left;
 font-size:4pt;
 line-height:8px;
}

h1 {
 font-family: helvetica, verdana, arial, ubuntu, sans-serif;
 font-size:16pt;
 color:#181C18;
 letter-spacing:0,8pt;
 text-shadow: 1px 1px 2px #9F9F9F;
 }

h2 {
 font-family: helvetica, verdana, arial, ubuntu, sans-serif;
 font-size:14pt;
 color:#003478;
 word-spacing:2pt;
 }

.klein {
 font-family: verdana, arial, helvetica, sans-serif;
 font-size:9pt;
 color:#181C18;
 }

.hervor {
 font-style:normal;
 font-weight:800;
 color:#181C18;
 }

.italic {
 font-style : italic;
 color:#181C18;
 }

/* - - - - Links im Text - - - - */

a:link{color:#003478;}

a:visited{color:#181C18;}

a:hover{color:#003478;}

a:link.linie {
 color: #7395B0;
 border-bottom:1px solid #666699;
 text-decoration: none;
  }

a:visited.linie {
 color: #7395B0;
 border-bottom:1px solid #666699;
 text-decoration: none;
  }

a:hover.linie {
 color: #7395B0;
 border-bottom:1px solid #666699;
 text-decoration: none;
  }


/* - - - - Dreispaltiger Text - - - - */

   div#linkebox {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: left;
    width: 300px;
    margin: 0;
    padding: 0;
    text-align: center;
    color:#181C18;
    word-spacing:2pt;
    border:1px solid #9F9F9F;
    background-color: #DEEAF8;
  }

   div#rechtebox  {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: right;
    width: 300px;
    margin: 0;
    padding: 0;
    text-align: center;
    color:#181C18;
    word-spacing:2pt;
    border:1px solid #9F9F9F;
    background-color: #DEEAF8;
  }

  div#mittlerebox {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    margin: 0 323px 0 324px;
    padding: 0;
    text-align: center;
    color:#181C18;
    word-spacing:2pt;
    border:1px solid #9F9F9F;
    background-color: #DEEAF8;
  }

/* - - - - Vierspaltiger Text ----- Reihenfolge der DIVs links_zwo_drei_zwo */

   div#links {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: left;
    width: 228px;
    height: 500px;
    margin: 0 9px 0 0px;
    padding: 0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }

   div#zwo {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: left;
    width: 228px;
    height: 500px;
    margin: 0 8px 0 1px;
    padding:0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }


  div#drei {
    font-family: helvetica, verdana, arial, sans-serif;
    float: right;
    font-size:10pt;
    width: 228px;
    height: 500px;
    margin: 0 0 0 0px;
    padding: 0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }

/* - - - - Vierspaltige Angebote ----- Reihenfolge der DIVs aussenlinks_mittendrin_aussenrechts_mittendrin */

   div#aussenlinks {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: left;
    width: 228px;
    height: 280px;
    margin: 0 9px 0 0px;
    padding: 0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }

   div#mittendrin {
    font-family: helvetica, verdana, arial, sans-serif;
    font-size:10pt;
    float: left;
    width: 228px;
    height: 280px;
    margin: 0 8px 0 1px;
    padding:0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }


  div#aussenrechts {
    font-family: helvetica, verdana, arial, sans-serif;
    float: right;
    font-size:10pt;
    width: 228px;
    height: 280px;
    margin:0 0 0 0px;
    padding: 0;
    color:#181C18;
    word-spacing:2pt;
    border:#1C5D88 dotted 1px;
    background-color: #DEEAF8;
  }

/* - - - - Zoom im Text - - - - */

.zoom {
 font-family: helvetica, verdana, arial, sans-serif;
 font-size:12pt;
 line-height:22px;
 color:#181C18;
 word-spacing:2pt;
 }

.zoom a img {
 float:left;
 height:94px;
 width:125px;
 margin:5px 10px 0px 0px;
 border-bottom:1px solid #9F9F9F;
 border-right:1px solid #9F9F9F;
 }

.zoom img:hover {
 width:350px;
 height:245px;
 position:relative;
 z-index:1;
 box-shadow: 5px 5px 7px #9F9F9F, -5px -5px 7px #FFFFFF;
 }

.zoom a:hover img {
 width:350px;
 height:245px;
 border-bottom:1px solid #9F9F9F;
 border-right:1px solid #9F9F9F;
 position:relative;
 z-index:1;
 }

.zoom a:hover {
 padding:0px;
 }

/* - - - - Zoom medium - - - - */

.zoomm {
 font-family: helvetica, verdana, arial, sans-serif;
 font-size:12pt;
 line-height:22px;
 color:#181C18;
 word-spacing:2pt;
 }

.zoomm a img {
 float:left;
 height:134px;
 width:200px;
 margin:5px 10px 0px 0px;
 border-bottom:1px solid #9F9F9F;
 border-right:1px solid #9F9F9F;
 }

.zoomm img:hover {
 width:350px;
 height:245px;
 border:1px solid #9F9F9F;
 position:relative;
 z-index:1;
 box-shadow: 5px 5px 7px #9F9F9F, -5px -5px 7px #FFFFFF;
 }

.zoomm a:hover img {
 width:350px;
 height:245px;
 border:1px solid #9F9F9F;
 position:relative;
 z-index:1;
 }

/* - - - - Zoom large - - - - */

.zooml {
 font-family: helvetica, verdana, arial, sans-serif;
 font-size:12pt;
 line-height:22px;
 color:#181C18;
 word-spacing:2pt;
 }

.zooml a img {
 float:left;
 height:134px;
 width:200px;
 margin:5px 10px 0px 0px;
 border-bottom:1px solid #9F9F9F;
 border-right:1px solid #9F9F9F;
 }

.zooml img:hover {
 width:672px;
 height:448px;
 border:1px solid #9F9F9F;
 position:relative;
 z-index:1;
 box-shadow: 5px 5px 7px #9F9F9F, -5px -5px 7px #FFFFFF;
 }

.zooml a:hover img {
 width:672px;
 height:448px;
 border:1px solid #9F9F9F;
 position:relative;
 z-index:1;
 }