body { margin: 0 auto; max-width: 84em; display: flex; flex-flow: row wrap; font-family: Verdana, Arial, sans-serif; font-size: 0.95em; color: #222222; background-color:#fafafa;}

a {color: #111111; text-decoration: none;}
a:hover {color: #00a8df;}

.sp {display: none;}
.list { list-style: none; margin-left:-20px;}
.listf { list-style: none; margin-left:-40px; min-width:230px;}
.footer_list{ list-style: none; margin-left:-20px; margin-top:30px; margin-bottom:0px;}
.footer_listz{ list-style: none; margin-left:-20px; margin-top:0px; margin-bottom:0px;}
.footer_listd{ margin-top:30px; margin-bottom:0px;}

.inp{ border: 1px solid #cccccc; border-radius: 10px; font-size:1.2em; padding:5px; line-height:1.8em; text-align:right; width:95%; }
.sel{ border: 1px solid #cccccc; border-radius: 10px; font-size:1.0em; padding:10px; padding-right:0px; line-height:2em; text-align:right; width:100%; }
.but{ border: 1px solid #00a8df; border-radius: 10px; font-size:1.0em; padding:5px; line-height:1.8em; text-align:center; width:100%; color:#ffffff;font-weight:bold; background-color:#00a8df; margin-top:10px; }
.but:hover{background-color:#e7f1f8;color:#00a8df;cursor: pointer;}

.buts{ border: 1px solid #00a8df; border-radius: 10px; font-size:1.0em; padding:5px; padding-right:10px; padding-left:10px; line-height:1.8em;  color:#ffffff;font-weight:bold; background-color:#00a8df; margin:5px; margin-top:15px; margin-left:15px;}
.buts:hover{background-color:#e7f1f8;color:#00a8df;cursor: pointer;}

.prov{text-decoration:none;z-index:9999;position:fixed;float:left;line-height:0;right:0;top:10px; opacity: 0.60;}
.prov:hover{opacity: 1;}

dl.grid { display: grid; grid-template-columns: 85px auto; padding:12px;}
dt.m { grid-column: 1; padding: 5px; margin-bottom:10px;}
dd.m { grid-column: 2; padding: 5px;margin-bottom:10px;}
dt.full { grid-column: 1 / span 2; padding: 5px; margin-top:10px;}

dl.angebhalb { display: grid; grid-template-columns: 1fr 1fr; padding:0px; margin:0px; }
dt.l { grid-column: 1 / span 2; margin-bottom:5px;padding:0px; margin:0px;}
dd.r { grid-column: 1 / span 2; margin-bottom:5px;padding:0px; margin:0px;}


dl.halb { display: grid; grid-template-columns: auto 500px; padding:0px; margin:0px; }
dt.lh { grid-column: 1 / span 2; margin-bottom:5px;padding:0px; margin:0px;}
dd.rh { grid-column: 1 / span 2; margin-bottom:5px;padding:0px; margin:0px;}


.bildergal{ display: grid; grid-template-columns: repeat(3, 33.33%); grid-gap: 1px; }
l.bildergal { grid-column: 1;}
m.bildergal { grid-column: 2;}
r.bildergal { grid-column: 3;}

.anghal {height:175px; overflow:hidden;}
.anginh {font-size:0.92em; margin-top:10px;}
.anghalinh {margin-top:2px; line-height:18px; font-size:0.92em; }

dl.schiff { display: grid; grid-template-columns: 175px auto; gap: 0px; padding:0px; margin:0px; margin-top:50px;}
dl.schiff dt { grid-column: 1; padding:5px;  font-weight:bold;margin:0px; padding-right:0px;}
dl.schiff dd{ grid-column: 2; padding:5px; margin:0px; padding-left:0px;}

dl.werb { display: grid; grid-template-columns: 325px auto; padding:0px; margin:0px;}
dl.werb dt { grid-column: 1; padding:3px;  font-weight:bold;margin:0px; padding-right:0px;}
dl.werb dd{ grid-column: 2; padding:3px; margin:0px; padding-left:0px;}

dl.red { display: grid; grid-template-columns: auto 0px; gap: 0px; padding:0px; margin:0px; margin-top:20px; }
dl.red dt { grid-column: 1; margin:0px; padding:10px; padding-bottom:0px; }
dl.red dd{ grid-column: 1; padding:10px; margin:0px; }
.hredsch {margin-top:10px;padding-bottom:15px; font-size:1.2em;}
.redsch {float:left; padding-right:5px; width:100%;}
.redschl {float:right; padding-top:25px;  font-size:1.0em; font-style: italic}



.bgg {background-color:#F3F3F3;}
/* Mobile first - alle Dokument-Blöcke bekommen 100% Breite */

header, article, section, aside, footer {        flex: 1 100%;}

.secthead{flex: 1 100%; font-size: 15.5px;}

article{ padding:5px;}

header { display: flex; flex-flow: row wrap; text-align: left; margin-top:10px; margin-bottom:20px;}
header a {min-height:30px;}

.head {  margin:0 auto; margin-bottom:2px; overflow: hidden; display: flex; flex: 1 100%; height:90px; background-image:url(bilder/kopf3.jpg); background-position:top right; border: 1px solid #cccccc; -webkit-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); -o-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}


.headt{width:100%; text-align:right; padding:5px; font-size:1.3em; font-weight:bold; color:#fafafa;
webkit-text-shadow:   0px 0px 10px #000;-moz-text-shadow:  0px 0px 10px #000; -o-text-shadow:   0px 0px 10px #000; text-shadow:   0px 0px 10px #000;
}



nav { flex: 1 100%;}
nav a { display: inline-block; line-height:2.15em; width: 98%; padding:3px;}
nav .acl { display: inline-block; line-height:2.15em; width: 98%; padding:3px;}
nav .acl:hover {color: #00a8df; cursor: pointer; background-color:#f1f1f1;}


 
 
 

.handyinv { display:none;}
.handyinvinl { display:none;}
.tabinv { display:none;}


section { display: block; background: #FFF; padding:10px; border: 1px solid #cccccc; border-radius: 5px; -webkit-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); -o-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); background-color:#ffffff; line-height:18px; margin-bottom:25px; overflow:hidden; }
section:hover{border-color:#0097c8;}

section h3 {line-height:20px;margin-top:10px; color:#0097c8;}

.edbild {float:left; width: 160px; height:120px; overflow:hidden; margin-right:25px; }
.edbildkl {float:left; width: 160px; height:120px; overflow:hidden; margin-right:5px;}

.icon { float:left; margin-top:2px; margin-right:15px; width:25px; height:25px;}


.sec { display:block; background: #FFF; padding:5px; border: 1px solid #cccccc; border-radius: 5px; -webkit-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); -o-box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); box-shadow:  0 1px 2px rgba(0, 0, 0, 0.1); background-color:#ffffff; line-height:20px; margin-bottom:25px;}
.sec:hover{border-color:#0097c8;}
.sh{ border-bottom: 1px dotted #cccccc; font-weight: bold; line-height:1.8em; color:#0097c8; padding:10px; padding-top:20px;font-size:1.0em; }
.sb{ border-top: 1px dotted #cccccc; margin-top:25px;padding-top:5px;}
.su{ border-bottom: 1px dotted #cccccc; margin-top:25px;padding-top:5px;}

.kopf_obenblau_but { padding:15px; border: 1px solid #0097c8; border-radius: 10px; background-color:#f9fbfd; -webkit-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); line-height:30px;
         -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
         -o-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); }
.kopf_obenblau_but:hover{ border-color:#ff0000; box-shadow: 3px 3px 3px #cccccc;}
.link{color:#0097c8; font-size:1.1em; line-height:1.6em;}
.linkkl{color:#0097c8; font-size:1em; line-height:1.8em;}

.divbutton{cursor: pointer; }
.divbutton:hover {color: #00a8df;}        
         
         

.p10{padding:10px;}
.p5{padding:5px;}
.p25{padding:25px;}
.p25s{ padding:10px;}
.prl15{ padding-right:15px; padding-left:15px;}
.mt3{margin-top:3px;}
.mt10m{margin-top:-15px;}
.ml25{margin-left:25px;}
.mt40{margin-top:40px;}
.mt30{margin-top:30px;}
.mt50{margin-top:50px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mr25{margin-right:25px;}
.mb50{margin-bottom:50px;}
.sw0{font-size:0.65em;}
.sw1{font-size:0.74em;}
.sw2{font-size:0.83em;}
.sw3{font-size:0.92em;}
.sw4{font-size:1em;}
.rot{ color:#ff0000;}
.weiss{ color:#fff;}
.bold{ font-weight:bold;}
a.weiss:hover{ color:#000;}
.klein{ font-size: 0.8em;}
.rechts{ float: right;}
.trechts{ text-align:right;}
.blau { color:#0097c8;}
a.blau { color:#0097c8;}
a.blau:hover{ color:#ff0000;}

.phone { font-size:80px; padding-left:15px; padding-bottom:30px; text-shadow: 1px 1px 2px #000000; margin-top:20px;}
.telnr{font-size: 1.55em; font-weight:bold; }

h1{ font-size:15pt; color:#0097c8; line-height:23pt;}
h2{ font-size:12pt; font-weight:bold; color: #006c8f; margin-bottom:25px;}
h2.absatz{ margin-top:60px; margin-bottom:25px;}
h3{ font-size:12pt; font-weight:bold; color:#0097c8; line-height:30px; margin-top:1px;}
.h3ue {font-size:12pt; font-weight:bold; color:#0097c8; line-height:30px; margin-top:10px; margin-bottom:10px;}

.h3o{height:25px; overflow:hidden;}
.h2o{ font-size:14pt; font-weight:bold; color: #006c8f; margin-bottom:35px;margin-top:75px; margin-bottom:25px;}

.button{
         padding:15px;
         margin-top:30px;
         margin-right:-10px;
         float:right;
         font-size:15px;
         text-align:center;
         border: 1px solid #0097c8;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
         color:#0097c8;
         font-weight:bold;
         background-color:#f9fbfd;
         -webkit-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1);
         -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
         -o-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); 
}


.button:hover{
         background-color:#e7f1f8;
         color:#00a8df;
         cursor: pointer;
}

.buttonsm{
         margin-top:50px;
         padding-top:25px; padding-bottom:25px; 
         font-size:16px;
         text-align:center;
         border: 1px solid #0097c8;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
         color:#0097c8;
         font-weight:bold;
         background-color:#f9fbfd;
         -webkit-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1);
         -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
         -o-box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); box-shadow:  2px 2px 4px rgba(0, 0, 0, 0.1); 
}


.buttonsm:hover{
         background-color:#e7f1f8;
         color:#00a8df;
         cursor: pointer;
}



.buttondisc{
         padding:10px;
         font-size:15px;
         text-align:center;
         width:95%;
         border: 1px solid #0097c8;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
         color:#0097c8;
         font-weight:bold;
         background-color:#ffffff;
         margin-top:25px;

}
.buttondisc:hover{
         background-color:#e7f1f8;
         color:#00a8df;
         cursor: pointer;
}

.preis {
         display: inline;
         text-align:right;
         font-weight:bold;
         float:right;
         width: 175px;
         padding-right: 10px;
         padding-top: 25px;
         margin-left: 25px;
         font-size: 16px;
         line-height:18px;
         margin-top:-25px;
         color:#999;
}

.schnaeppchen{
         font-weight:normal;
         line-height:25px;
}


.bildr{ float:right; margin-top:1px; margin-left:15px; margin-bottom:15px; max-width:180px; height:auto;}
.bildl{ float:left; margin-top:1px; margin-right:15px; margin-bottom:10px; max-width:180px; height:auto;}
.bildg{ float:left; padding:10px; max-width:240px; height:auto;}

.frage {
        cursor: pointer;
        color:#0097c8;
}
.antwort {
  padding-left: 0px;
  padding-top: 15px;
}

.antwort-r {
  display: none;
}

.antwort-r + .antwort {
  max-height: 0;
  opacity:    0;
  overflow:   hidden;
}

.antwort-r:checked + .antwort {
  padding-bottom: 20px;
  max-height: 5000px;
  opacity:    1;

}
.suchblase{
         display:inline-block;
         padding:8px;
         padding-left:15px;
         padding-right:0px;
         margin-right:10px;
         margin-bottom:10px;
         border: 1px solid #cccccc;
         -webkit-border-radius: 15px;
         -moz-border-radius: 15px;
         border-radius: 15px;
         background-color:#ffffff;
         font-size:15px;
}
a.suchblaselink:hover{
         color:#ff0000;
}

/*
aside {
        background: #ebf5d7;
        border-color: #8db243;
}*/

footer {  display: flex; flex-flow: row wrap; margin-top:75px; border:0px; border-top: 1px dotted #bbbbbb; padding-top:25px; font-size:1em; }

footer div { flex: 1 1 0%; justify-content: space-between; margin: 5px; margin-top:0px;}
footer li { min-width:330px; min-height:30px; margin-left:-15px;}
footer * { color:#444;}
footer div:last-child {
  flex: 0 0 120px;
}
/* Smart Phones und Tablets mit mittlerer Auflösung */




@media all and (max-width: 59.9em) {
.stickyhandy{
         position: sticky;
         top: -9px;
         padding-top:0px;
         padding-bottom:0px;
         background-color:#fafafa;
         margin-top:50px; margin-bottom:50px;         

}
.normarg { margin-top:0px; margin-bottom:0px;}
.telnr{font-size: 1.4em; font-weight:bold; }


 #suchfilter{
                 display: none;
                 position:fixed;
                 overflow-y: scroll;
                 overflow-x: auto;
                 top:0px;
                 left:0px;
                 height:100%;
                 background-color:#ffffff;
                 width:100%;
                 padding-top:10px;
                 padding-left:3px;
                 padding-right:3px;
                 z-index:1000;
         }
         #suchnavte {
                top:0px;
                left:0px;
                width:100%;
                height:40px;
                background-color:#006c8f;
                display:none;
                position:fixed;
                z-index:100;
                line-height:30px;
                overflow:hidden;
                padding-top:10px;
                padding-bottom: 10px;
                border-bottom: 2px groove #000000;
                font-size:1.2em;
                text-align:center;

         }
         #suchnavtezw {
                top:0px;
                left:0px;
                width:100%;
                height:40px;
                background-color:#006c8f;
                position:fixed;
                z-index:100;
                line-height:30px;
                overflow:hidden;
                padding-top:10px;
                padding-bottom: 10px;
                border-bottom: 2px groove #000000;
                font-size:1.2em;
                text-align:center;
         }
}

@media all and (min-width: 35em) {
        .head {  background-image:url(bilder/kopf.jpg);}

        header { margin-bottom:40px;}
        .p25s{ padding:25px;}
        h1{ font-size:17pt;}
        h2{ font-size:14pt;margin-bottom:35px;}
        h2.absatz{ margin-top:75px; margin-bottom:25px;}
        .anginh {margin-top:30px;}
        section h3 {line-height:30px;}

        .sec {line-height:28px;}
        section {line-height:28px;}

        .handyinv { display:block;}
        .handyinvinl { display:inline;}
        .link{font-size:16px; line-height:25px;}

        .button{
         margin-top:35px;
         margin-right:10px;
         font-size:16px;
                 }
        
        article {
                order: 2;

        }
        #news {
                order: 3;
        }
        aside {
                /* durch auto werden die beiden asides in eine Zeile gesetzt */

                flex: 1 1 auto;
                order: 4;
        }
        footer {
                order: 5;
        }
}
/* Large screens */

@media all and (min-width: 60em) {

.kopf_obenblau_but { margin-top:50px; margin-bottom:50px;padding:30px;}
nav { min-height: 100%;
height: auto !important;
height: 100%;}

#suchfilter{
                 min-height: 100%;
                 height: auto !important;
                 height: 100%;
}

.sticky{
  position: sticky;
                top: 0;
    min-height: 100%;
    height: auto !important;
    height: 100%;

}

        dl.schiff { margin-top:50px; grid-template-columns: 250px auto;}
        dl.schiff dt { padding:8px; padding-left:10px;}
        dl.schiff dd { padding:8px; }        

        nav { flex-grow: 0; flex-shrink: 0; flex-basis: 300px;  display:block;  padding-right:25px;}
        nav a { display: inline-block; line-height:2.15em; width: 98%; padding:3px;}
        nav a:hover, nav a:focus { background-color:#f1f1f1; }

        article {
                /* Der Article wird 2.5x so breit wie die beiden asides! */

                order: 3;
                flex: 4 1 0%;
        }
        aside {
                flex: 2 1 0%;
        }


        .edbild {width: 240px; height:180px; margin-top:20px;}
        dl.red { grid-template-columns: 275px auto; }
        dl.red dd{ grid-column: 2; padding:10px; margin:0px;}
        .hredsch {margin-top:15px;padding-bottom:25px; }
.redschl {padding-right:10px; float:right; padding-top:30px; }
.redsch {width:240px; padding-right:5px;}
        
        
        .bildr{ max-width:380px;}
        .bildl{ max-width:400px; margin-bottom:0px; margin-right:25px}

        #news {
                order: 2;
                align-self: center;
                height: 120px;
        }
        .handyvis{ display:none; }
        .handysicht{ display:none; }


}

@media all and (min-width: 70em) {
        .tabinv { display:inline;}
        .footer_listz{ margin-top:30px;}
        .footer_listd{ margin-top: 0px;}
        footer li { min-height:23px;}
footer li { min-width:260px; }
        
        
        
        nav{flex-basis:  375px; padding-right:50px;}
        dt.l { grid-column: 1; margin-bottom:5px; padding:0px; margin-right:7px;}
        dd.r { grid-column: 2; margin-bottom:5px; padding:0px; margin-left:7px;}
        
        dt.lh { grid-column: 1; margin-bottom:5px; padding-right:75px; margin-right:5px;}
        dd.rh { grid-column: 2; margin-bottom:5px; margin-left:5px;}
        
        .anghal {height:180px; overflow:hidden;}
        .anghalinh {margin-top:1px; line-height:18px; }
}