/**************/
/*links*/
/*************/

a:link {
    color:#414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;
    }
a:visited {                                                                                                 d
    color:414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a:hover {
    color : #2D4AC7;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a.zweite:link {
    color:#414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a.zweite:visited {
    color:#414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a.zweite:hover {
    color : #E95D00;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;
}
a.gbook:link {
    color:#414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a.gbook:visited {
    color : #828282;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;

}
a.gbook:hover {
    color:#414242;
    text-decoration : none;
    background-color : transparent;
    font-weight:400;
}

a.dritte:link {
    color : #E55D00;
    text-decoration : none;
    background-color : transparent;
    font-weight:700;
}
a.dritte:visited {
    color : #E55D00;
    text-decoration : none;
    background-color : transparent;
    font-weight:700;
}
a.dritte:hover {
    color : red;
    text-decoration : none;
    background-color : transparent;
    font-weight:700;
}
a.igt:link img, a.igt:visited img {
    border: 1px solid #000;
}
a.igt:hover img {
    border: 1px solid #4C85BD;
}
.lki8:hover{
  opacity: 0.7;
  }

.title55{
   margin: 0;
    padding: 0;
    font-size: 1.6em;
    line-height: 0em;
    color:#2C348A;
    font-weight:400;
    text-align:left;

}
.title55 i{
    padding-right:12px;
}
/*Film*/
.video8{
    width:100%;
    max-width:549px;
    height:auto;
    border-radius:8px;
    padding-top:24px;
}
.gbuch18{
    background:#d1dbe8;
    Padding:14px;
    border-radius:12px;
}

/**************/
/*partner*/
/*************/
.flxb8{
    display:flex;
    flex-wrap:wrap;
    width:100%;
    margin-top:36px;
}
.flxit8{
    width:45%;
    text-align:center;
    background:#e7f0f8;
    padding:12px;
    border-radius:8px;
    line-height:1.6em;
    margin:12px 12px 0 0;
}
.flxit8:nth-child(2n){
    margin-right:0;
}
.flxit8 a:link,.flxit8 a:hover, .flxit8 a:visited{
    text-decoration: none;
    display:inline-block;
    color:#4c4b4b;
}
.flxit8 a:hover{
    opacity:0.7;
}
.flxit8 strong{
    font-size:1.2em;
}
.flxit8 img{
    padding-top:12px;
    min-width:240px;
    height:auto;
}

.box7{
    margin:14px 0;
}
#mapImage{
    width:100%;
    height:auto;
}

/**************/
/*AUX*/
/*************/
.se9{
    display:none;
}

 b{
     color:#E95D00;;
 }

ul {
    margin: 0;
    margin-top:-5px;
    margin-left:5px;
    padding: 0;

    }
li {
    letter-spacing: -0.5px;
    margin: 0;
    margin-bottom:4px;
    padding: 0;
    list-style-type: none;
    }
.ctbx li{
    list-style-type:square;
    margin-left:15px;
}
.clear {
    clear: both;
}
html, body {
    background:#f3f5f6;
    overflow : auto;
    margin: 0;
    padding: 0;
    height: 100%;
    border: none;
    color:#545555;
    font-size: 1em;
    line-height: 1.4em;
    font-family: "Source Sans 3", sans-serif;
    font-optical-sizing: auto;
    font-weight:400;

}


/*************/
/*fonts */
/*************/

h1 {
    margin: 0;
    padding: 0;
    font-size: 1.6em;          /* etwas kleiner als früher, aber klarer Titel */
    line-height: 1.25em;
    color:#124395;
    letter-spacing:-0.01em;
    font-weight:800;
    padding-bottom:13px;
}

h2 {
    margin: 0;
    padding: 0;
    font-size: 1.25em;         /* alle H2 (alt + neu) gleich gross */
    line-height: 1.3em;
    color:#124395;
    letter-spacing:-0.01em;
    font-weight:800;
    margin-bottom:12px;
}

h3 {
    margin: 0;
    padding: 0;
    font-size: 1.05em;         /* leicht über Fliesstext */
    line-height: 1.4em;
    text-align:left;
}



.ct8{
    -moz-hyphens: auto; /*auto umbruch im Content*/
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;

}
.sm7{
    font-size:0.70em;
    line-height: 1.5em;
}
/*************/
/* div-Grid */
/*************/
#wrappr{
    bottom: 0;
    position: absolute;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    height: 100%;
    bottom: 0;
    z-index: 80;

}
#hmb3{
    display:none;
}
.hmbnav{
    display:none;
}


#halign {
    position:relative;
    margin:auto;
    width:100%;
 	max-width:1360px;
    bottom: 0;
    z-index: 90;
    background:#fff;


}
/*************/
/*callaction */
/*************/
#menu5{

    position:fixed;
    bottom:1%;
    left:1%;
    width:18%;
    Background:#001fa4;
    color:#fff;
    padding:18px 12px 0 12px;
    z-index:99999999;
    font-size:1.5em;
    font-weight:600;
     border-radius:12px;

}
#menu5 a{
   color:#fff;
   display:block-inline;

}
#menu5 a:hover{
    opacity:0.7;
}

.flxbkca{
    display:flex;
    flex-wrap:wrap;
    width:90%;
    justify-content: space-between;
    align-items: center;
}
.flxbkca i:first-child{
    font-style:normal;
    font-size:0.8em;
    font-weight:600;
    width:100%;
    margin-bottom:24px;
}
.flxbkca i:nth-child(2){
    padding-left:12px;

}

/*************/
/*Template */
/*************/
#tmplate{
    text-align:left;
    width:100%;

}
.logo1{
display:none;
}
.logo, .logoboot{
    width:100%;
    position:absolute;
    margin:0 0 0 0;
    height:auto;
}
#tmplate .clear{
 margin-top:-3.2%;
 }
 .hmnu:first-child{
     margin-bottom:16px;
 }

.hmnu a {
    display:block;
    padding-left:18px;
}
.hmnu span, a:link, a:visited {
    margin:0 3.8% 0 0;
    font-size: 0.9em;
    font-weight:400;
}

#hmb3{
    display:none;
}
/**************/
/*templatebild*/
/*************/
.hb-hero-picture {
    display: block;
    max-width: 1450px;   /* oder deine reale Bildbreite */
    margin: 0 auto;
}

.hb-hero-picture img {
    display: block;
    width: 100%;
    height: auto;
}



/*************/
/*Filter Boote*/
/*************/
.sortlist5{
    background-color:#F3F3F5;
    padding:12px 0 12px 8px;
    margin-bottom: 18px;
}
.sortlist5 strong{
    color:#2C348A;
    font-weight:400;
}
.sortlist5 select{
    width: 18%;
    box-sizing: border-box;
    border: 2px solid #ccc;
    border-radius: 4px;
    font-size: 11px;
    background-color: #F3F3F5;
    text-align:left;
    padding:5px 4px 5px 4px;
    margin-top:2px;
    }
.sortlist5 input{
    margin-top:8px;
    color:#2C348A;

}
.sortlist5 select:nth-child(3){
    width: 20%;
    }
/*************/
/*subcontainer*/
/*************/
#subcont{
    width:83%;
    background-color:#fff;

    margin:0 0 0 10%;

}


/*************/
/*wplft*/
/*************/

#wplft{
    float:left;
    width:18%;
    min-width:190px;
    margin-top:24px;
    display:block;
    line-height:1.45em;
}
#wplft hr, .hr8{
     border-top: 0px solid black;
}

/*************/
/*wpmid*/
/*************/
#wpmid{
    float:left;
    width:74%;
    margin-left:6%;
}
.ctbx11{
margin-top:24px;
}
.ctbx22{
    padding-left:33px;
    margin-bottom:20px;
}
.ctbx{
    font-size:1.05em;
    line-height:1.4em;
    letter-spacing:0.02em;
    margin-top:16px;

}
.yellowbox{
background:#ffd700;
padding:12px 8px 16px 12px;
border-radius:8px;
}
.yellowbox a{
    color:#000;
    margin:0;
}
.yellowbox a:hover{
    color:#df9e87;
}
.marker{
    background:#d1dbe8;
    padding: 8px 12px;
    border-radius: 8px;
    

}

.pct1{
    display:block;
    width:549px;
    height:auto;
    margin: 32px 0 5px 0;
    border-radius:8px 0 0  8px;
}
.picthd{
    background:#f2f4f5;
    border-radius:8px;
}
.picthd a {
    padding:0;
    margin:0;
}

.pct22{
    display:block;
    width:704px;
    height:auto;
    margin:15px 0 20px 0;
     border-radius:8px 0 0  8px;

}
.pct102{
    display:block;
    height:auto;
    margin: 3px 0 3px 0 ;
}

.sbx1{
    float:left;
    margin-right:18px;
}



.sblnk3{
    float:left;
    min-width:240px;
}



/*************/
/*footer*/
/*************/
#footer{
 background:#e2e4e5;
 position:relative;
 margin:auto;
 width:100%;
 max-width:1360px;

}
.flxb34{
    display:flex;
    width:100%;
    min-height:300px;
}
.fxb34{
    width:32%;
    padding:3% 2%;
}
.flxb34 i{
    margin-right:8px;
}
.flxb34 a:link,.flxb34 a:visited {
    color:#2C348A;
}
.flxb34 a:hover{
     color:#e95d00;
}
.fxb34 a:hover{
    opacity:0.7;
}
.pct2{
   margin-bottom:24px;
}
 .fxb34:first-child{
    width:24.5%;
}
 .i2i{
  font-size:1.2em;
  margin:12px 8px 12px -2px;
}

.thrd img{
    width:100%;
    max-width:195px;
    height:auto;
}
.flxb35{
    display:flex;
    width:100%;
    align-items: center;

}
.flxb35 div:last-child{
    padding-left:18px;
}
.flxb35 i{
    margin-bottom:12px;
}


/**************/
/*GAESTEBUCH*/
/*************/
.bc67{
    background-color:#EDEDED;
    padding:2%3%2%4%;
    margin-bottom:3%;
    font-size:small;
    color:#828282;
}
.bc67 hr{
    border-top: 1px dotted #C9C7C7;

}
.bc68{
    font-size:medium;
    color:#000;
}
.bc70{
    background-color:#F2E19C;
    padding:2%3%2%4%;
    margin-bottom:3%;
    margin-top:-3%;
    font-size:small;
    color:#828282;
}
.bc70 hr{
    border-top: 1px dotted #888686;

}
/******************/
/*HAUSBOOT DETAIL*/
/****************/
.boat ul{
    padding:0;
    margin:0;

}
.boat li{
    list-style-type:disc;
    padding:0;
    margin: 0 0 8px 16px;
    font-size:0.95em;
    line-height:1.2em;

}
.boat td{
    font-size:0.95em;
    line-height:1.2em;
    padding-bottom:8px;

}

.bobx5{
    width:100%;
    border-top:2px #2C348A solid;
    margin:-12px 0 0 0;
}
.tmboat{
    margin:4px 0 0 0;
    width:100%;
    height:auto;
}
.tmboat1{
    width:100%;
    height:auto;

}
.tmboat3{
    width:69.2%;
    height:auto;
    float:right;
}
.galboat{
    width:100%;
    padding-bottom:4px;
    margin-bottom:4%;
    display: -webkit-flex;
 	display:flex;
    justify-content:space-between;
    border-bottom:2px #2C348A solid;
}
.galboat a{
    padding:0;
    margin:0;
}
.boat h3{
    margin: 0;
    padding: 0;
    font-size: 1.4em;
    line-height: 1.5em;
    color:#2C348A;
    font-weight:400;
    text-align:left;
    margin-bottom:4px;


}
.dtbo6{
    padding:12px 0 12px 0;
    border-bottom:2px #2C348A solid;
}
.dtbo6 ul{
    padding:0;
    margin:0;
}
.dtbo6 li{
    list-style-type:none;
    padding:0;
    margin: 0 0 8px 0;

}
.footd2{
    position:relative;
    margin:-7% 0 0 0;
    text-align:right;
    font-size:0.95em;
    line-height:1.2em;
}
.footd2 span{
    margin-left:24px;
}


/*****************/
/*HAUSBOOT LISTE*/
/***************/
.boat{
    width:100%;
    /*background-color:fuchsia;*/
    margin-bottom:8%;
}
.boat h2{
    margin: 0;
    padding: 0;
    font-size: 1.4em;
    line-height: 1.5em;
    color:#2C348A;
    font-weight:400;
    text-align:left;
    margin-bottom:15px;

}
.pclgbo1{
    width:9.75%;
    height:auto;
    float:right;
    margin:4px 14px 0 0;
}
.bobx1{
    background-color:#E3E3E3;
    width:100%;
    border-top:2px #2C348A solid;
    margin:-12px 0 0 0;
    display: -webkit-flex;
 	display:flex;
    justify-content:space-between;

}
.bolft{
    /*background-color:aqua;*/
    width:29.9%;
}
.pclgbo2{
    padding:9.5% 8% 0 8%;
    width:83.9%;
    max-width:181px;
    height:auto;
}
.bomid{
    /*background-color:lime;*/
    padding-top:18px;
    width:42%;
    border-bottom:1px #AEAEAE dashed;

}
.borgh{
    padding-top:18px;
    /*background-color:orange;*/
    width:22.2%;
    font-size:0.90em;
}
.borgh strong{
    font-size:1.1em;

}
.pclgbo3{
    padding:18% 0 0 0;
    width:100%;
    height:auto;
}
.pclgbo3:hover{
    opacity: 0.7;
}

.bobx2{
    background-color:#E3E3E3;
    display: -webkit-flex;
 	display:flex;
    justify-content:space-between;
    padding-top:12px;
    padding:12px 0 18px 0;

}
.bobx2 .bomid{
    padding-top:0;
    font-weight:400;
    border: 0;
    /*background-color:aqua;*/
}
.bobx2 .bomid strong{
    font-size:0.85em;
}

.bobx2 .borgh{
    padding-top:0;
    font-size:0.85em;
    font-weight:700;
    /*background-color:orange;*/
}

.bobx2 .bolft{
    font-size:0.85em;
    font-weight:600;
    text-align: center;
    /*background-color:green;*/
}

.pclgbo4{
    margin-top:3%;
    width:55.5%;
    height:auto;
}
.jasmin{
        float:right;
        margin-top:15px;
        margin-right:8px;
        overflow:hidden;
        -webkit-animation: fadeinout 6s linear forwards;
        animation: fadeinout 6s linear forwards;
        opacity: 0;
}

@-webkit-keyframes fadeinout {
    50% { opacity: 0; }
}

@keyframes fadeinout {
    100% { opacity: 1; }
}

/**************/
/*Bestellform*/
/*************/
.assex{
   background:#fff;
   border:1;
   padding:4px;
   border-radius:4px;
}

.label3{
   font-style:normal;
   font-size:0.8em;
   background:#f2f2f2;
   margin:8px 0 12px 0;
   padding:0;
}
.button {
    background-color: #a6d74a;
    border: none;
    color: #000;
    padding: 16px 32px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
    border-radius:8px;

    font-size:1em;
    letter-spacing:0.002em;

}
.button:hover{
    opacity:0.7;
    transition: all .4s;
    -moz-transition: all .4s;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    background-color: #d74a65;
    color:#fff;
}
.adresse p{
    font-style:normal;
    font-size:0.8em;
    background:#f2f2f2;
    margin:8px 8px 12px 0;
    padding:12px 12px;
    border-radius:6px;
}

.adresse h2{
    color:#96ba52;
    font-weight: 600;
    font-size: 1.5em;
    letter-spacing: .02em;
    padding-bottom: 6px;
    margin-bottom:0;
}
.assex2{
    background:#fff;
    border:0;
    padding:4px 8px;
    border-radius:4px;
    font-size:1.2em;

}
/*Captcha*/
.spz83v{
    float:left;
    border-radius:8px;
}

.spz83q{
    padding: 12px;
    margin: 0 18px 0 0;
    font-size:1.6em;
    background:red;
    background-color:#96ba52;
    float:left;
    border-radius:8px;
}
.spz83q:hover{
    opacity:0.7;
     transition: all .4s;
    -moz-transition: all .4s;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    background-color: #d74a65;
    color:#fff;
}

.flok1{
   float:left;
   margin-left: 18px;
   font-size:1.2em;
   line-height:2.3em;
   padding:0 12px;
   border-radius:8px;
}
.spz84d{
    clear: both;
    padding:24px 0 36px 0;
}
#xa23 a{
    display:inline-block;
    width:100%;
    text-decoration:none;
    color:#fff;
}
/*************/
/*contentlink*/
/*************/
.ctlnk34{
    font-size:1.3em;
    color:#fff;
    background:#2c348a;
    margin-bottom:12px;
    padding: 8px 12px 14px 12px;
    border-radius:12px;
}
.ctlnk34 a:link, .ctlnk34 a:visited{
    color:#fff;
}
.ctlnk34 a:hover{
    color:#e95d22;
}

.ctlnk34 i{
    font-size:1.6em;
    margin-right:12px;
}


/*************/
/*Artikelbox*/
/*************/
.bxart{
    margin:18px 0 0 0;
}
.bxlftart{
    margin:0 0 0 30px;
    padding-top:60px;
    float:left;
}
.pcbxart{
    width:63.49%;
    height:auto;
    margin:0 0 0 0;
    float:right;
}

/*Layout 1*/
.pclt1{
    float:right;
    margin-left:18px;
}
.txlt1{
    margin-top:-24px;
}


/*************/
/*wprht*/
/*************/
#wprht{
    float:right;
    width:24.37%;


}
.ctbx1{
    margin: 0 0 38px 0;

}


/*************/
/*Galerie*/
/*************/
.gal1{
    width:88.6%;
    margin:-50px 0 0 33px;
    padding:7% 0 0 7%;
    background-color:#EEEBEB;

 }

.gal1 img{

    width:100%;
    height:auto;

}
.gal1sp{
    float:left;
    	width:26%;
    padding-right:7%;
    padding-bottom:7%
}

/*************/
/*Layout 5*/
/*************/
.pct16{
    width:355px;
    height:auto;
}

.box30{
margin-top:3%;
}
.bxrg30{
    float:right;
}
.bxlf30{
    float:left;
}

/********** neuer Container Reisebild **************/
.picthd {
    background:#f2f4f5;
    border-radius:8px;
    padding-bottom:24px;
}

/* Link im Container nicht aufblähen */
.picthd a {
    padding:0;
    margin:0;
}

/*************/
/* BILD + LEGENDE (SRF, etc.) — PREMIUM LAYOUT */
/*************/

.picthd-legend-layout {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;          /* Text & Bild vertikal zentriert */
    justify-content: space-between;
    gap: 24px;
    margin-top: 12px;
}

/* TEXTBLOCK LINKS */
.picthd-legend-text {
    flex: 1 1 0;
    min-width: 0;                 /* verhindert „Abschneiden“ bei schmaleren Breiten */
    font-size: 0.95rem;
    line-height: 1.5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding:14px;
}

/* BILD RECHTS */
.picthd-legend-img {
    flex: 0 0 auto;               /* Bild behält seine natürliche Breite */
}

.picthd-legend-img img {
    height: auto;
    width: auto;
    max-width: 420px;             /* Bild bleibt in natürlicher Größe, max. 420px */
    display: block;
    border-radius:12px 0 0 12px;
}

/* Standard ist: Text links, Bild rechts – so wie bisher */

/* Ab einer bestimmten Breite: jeden zweiten Reise-Abschnitt spiegeln */


/* MOBILE / MITTEL: Elemente untereinander ab ca. 1150px */

@media (max-width: 1250px) {
    .picthd-legend-layout {
        flex-direction: column-reverse;
        align-items: flex-start;
        gap: 8px;
        margin-top: 24px;
    }

    .picthd-legend-text {
        width: 100%;
        padding:12px 12px 4px;    /* genug Platz nach unten, damit nix „abgeschnitten“ wirkt */
    }

    .picthd-legend-img {
        width: 100%;
    }

    .picthd-legend-img img {
        max-width: 100%;
        width: 100%;
        border-radius: 0 0 8px 8px;  /* unten schön abgerundet */
    }

    .picthd {
        margin-bottom:24px;
    }
}
@media (min-width: 1150px) {
    .ctbx:nth-of-type(even) .picthd-legend-layout {
        flex-direction: row-reverse;
    }

    .ctbx:nth-of-type(even) .picthd-legend-img img {
        border-radius: 0 12px 12px 0;
    }
}
/* EXTRA-FINETUNING für sehr kleine Screens */
@media (max-width: 490px) {

    .picthd-legend-layout {
        margin-top: 4px;
        gap: 4px;
    }

    .picthd-legend-text {
        padding: 10px 10px 4px;
        font-size: 0.9rem;          /* minimal kleiner */
        line-height: 1.45;
    }

    .picthd-legend-text ul {
        padding-left: 18px;         /* etwas weniger Einrückung */
        margin-bottom: 4px;
    }

    .picthd-legend-text li {
        max-width:90%;
        margin-bottom: 2px;
    }

    .picthd-legend-img img {
        max-width: 100%;
        width: 100%;
        border-radius: 0 0 8px 8px;
    }

    /* Button etwas kompakter, damit er nicht so dominant wird */
    .picthd-legend-text .hb-individuell-cta a {
        padding: 6px 14px;
        font-size: 0.9rem;
    }
}


/*************/
/* PREIS-TABELLE / ANGEBOT                  */
/*************/

.hb-preise {
    margin: 24px 0 32px;
}

/* graue Card wie beim Reisebild */
.hb-preise-box {
    background: #f2f4f5;
    border-radius: 8px;
    padding: 14px 14px 16px;
    margin-top: 8px;
}

/* Wrapper für horizontales Scrollen auf kleinen Screens */
.hb-preise-table-wrapper {
    width: 100%;
    overflow-x: auto;
}

/* Tabelle */
.hb-preise-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 640px;
    font-size: 0.94rem;
}

/* Allgemeine Header-Zellen */
.hb-preise-table thead th {
    border-bottom: 2px solid #d0d0d0;
    padding: 6px 8px;
    text-align: center;
    vertical-align: middle;
}

/* erste Headerzeile: Saison A–E */
/* Header-Zeile 1: Saison A–E */
.hb-preise-head-row1 th {
    background: #f7f7f7;        /* vorher: #ffffff → jetzt leichtes Grau */
    font-weight: 700;
    font-size: 0.95rem;
    text-align: center;
    padding: 10px 8px;
    border-bottom: 1px solid #d0d0d0;
}

/* Header-Zeile 2: die Datumsbereiche */
.hb-preise-head-row2 th {
    background: #f0f0f0;       /* etwas dunkleres, ruhiges Grau */
    font-weight: 400;
    font-size: 0.8rem;
    color: var(--hb-text-muted);
    text-align: center;
    padding: 6px 8px;
}

/* Linke Headerzelle (Boot / Personen) angleichen */
.hb-preise-table thead th[rowspan="2"] {
    background: #f7f7f7;       /* gleiche Farbe wie Saison A–E */
    font-weight: 700;
    text-align: left;
    padding-left: 8px;
}


/* Body-Zellen */
.hb-preise-table tbody td {
    border-top: 1px solid #dddddd;
    padding: 6px 8px;
    vertical-align: middle;
}

/* Boot/Personen-Spalte darf umbrechen, linksbündig */
.hb-preise-table td:first-child {
    white-space: normal;
    text-align: left;
}

/* Preis-Spalten: rechtsbündig, festes Schema */
.hb-preise-table tbody td:nth-child(n+2):nth-child(-n+6) {
    text-align: right;
    white-space: nowrap;
}

/* CTA-Spalte */
.hb-preis-cta {
    white-space: nowrap;
    text-align: right;
}


/* Button im Tabellenkontext etwas kompakter */
.hb-preis-cta .hb-individuell-cta {
    margin: 0;
}

.hb-preis-cta .hb-individuell-cta a {
    font-size: 0.86rem;
    padding: 5px 12px;
}

/* Hinweis unter der Tabelle */
.hb-preise-hinweis {
    margin: 10px 2px 0;
    font-size: 0.85rem;
    color: var(--hb-text-muted);
}

/* Mobile / schmale Screens: Box etwas luftiger, Tabelle per Scroll */
/* Mobile / schmale Screens: Tabelle als Karten darstellen */
@media (max-width: 1024px) {

    .hb-preise-box {
        padding: 12px 10px 14px;
    }

    /* Tabelle nicht mehr breit erzwingen */
    .hb-preise-table {
        font-size: 0.9rem;
        min-width: 0;
    }

    /* Tabellenkopf ausblenden – wir erzeugen Labels per :before */
    .hb-preise-table thead {
        display: none;
    }

    .hb-preise-table tbody tr {
        display: block;
        padding: 8px 0 10px;
        border-top: 1px solid #dddddd;
    }

    .hb-preise-table tbody tr:first-child {
        border-top: none;
    }

    .hb-preise-table tbody td {
        display: block;
        width: 100%;
        padding: 2px 0;
        text-align: left;
        white-space: normal;
    }

    /* Boot / Personen oben, etwas hervorgehoben */
    .hb-preise-table tbody td:first-child {
        font-weight: 700;
        margin-bottom: 4px;
    }

    /* Saison-Zeilen mit Label davor */
    .hb-preise-table tbody td:nth-child(2)::before {
        content: "Saison A: ";
        font-weight: 600;
    }
    .hb-preise-table tbody td:nth-child(3)::before {
        content: "Saison B: ";
        font-weight: 600;
    }
    .hb-preise-table tbody td:nth-child(4)::before {
        content: "Saison C: ";
        font-weight: 600;
    }
    .hb-preise-table tbody td:nth-child(5)::before {
        content: "Saison D: ";
        font-weight: 600;
    }
    .hb-preise-table tbody td:nth-child(6)::before {
        content: "Saison E: ";
        font-weight: 600;
    }

    /* CTA unten als Abschluss der Karte */
    .hb-preis-cta {
        margin-top: 6px;
        text-align: left;
    }

    .hb-preis-cta .hb-individuell-cta {
        margin-top: 2px;
    }
}

/*************/
/* SAISON-LEGENDE UNTERHALB DER TABELLE */
/*************/

.hb-preise-legende {
    margin-top: 14px;
    padding: 10px 14px;
    background: #f7f7f7;
    border-radius: 6px;
    font-size: 0.9rem;
}

.hb-preise-legende ul {
    margin: 6px 0 0 0;
    padding-left: 18px;
}

.hb-preise-legende li {
    margin-bottom: 4px;
}

.hb-preise-legende strong {
    color: #333;
}

/*************/
/* REISE-ETAPPEN (Tag 1, Tag 2, ...)      */
/*************/

.hb-etappe {
    margin: 20px 0;
    padding: 14px 16px 16px;
    border-radius: 8px;
    background: #f7f8f9;
    border: 1px solid #e0e0e0;
}

/* obere & untere Linie wie im Screenshot */
.hb-etappe {
    border-top: 2px solid #d5d5d5;
    border-bottom: 2px solid #d5d5d5;
}

/* Kopfzeile mit Icon + Titel */
.hb-etappe-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.hb-etappe-icon i {
    font-size: 1.1rem;
    color: var(--hb-orange-dark);
}

.hb-etappe-title {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    color: #124395;
}

/* Liste der Tagespunkte */
.hb-etappe-list {
    margin: 0;
    padding-left: 20px;
}

.hb-etappe-list li {
    margin-bottom: 4px;
}

/* Mobile leicht kompakter */
@media (max-width: 680px) {
    .hb-etappe {
        padding: 10px 12px 12px;
    }

    .hb-etappe-title {
        font-size: 1rem;
    }
}




/*************/
/*icons*/
/*************/
.ic1{
   margin: 0 8px -2px 0;

}
.ic2{
   margin: 2px 0 12px 0;
   width:100%;
   height:auto;
}
/*************/
/*submnu*/
/*************/
.submnu  {

 padding: 8px 0 0 18px;
}

/*************/
/*ssubmnu*/
/*************/
.cont5{
    position:relative;
    margin:-18px 0 24px 20px;
    font-size: 0.95em;
    line-height: 2.2em;

}

/*Special*/
#element {

    width: 800px;
    height: 522px;
    position: relative;
}
#element1 {
        position: relative;
}
#element2 {
        position: relative;
}

.panel {
    position:absolute;
    top:145px;
    left:183px;
    width:52.63%;
    min-width:498px;
    max-width:801px;
    height:auto;
    background-image:url('../_tmc_daten/Image/hd_tmpc.png');
    z-index:15;
    display: none;
}
.panel1 {
    position:absolute;
    top:10%;
    width:100%;
    height:auto;
    min-width:550px;
    max-width:801px;
    z-index:15;
    border:0px;
    display: none;
}

/*************/
/* Screen 1240px bis 1400px)*/
/*************/
@media screen and (max-width: 1400px) {

#wrappr{
        /*background-color:fuchsia;*/
}
#halign {
 	max-width:1200px;

 }
 .pct4{
    width:24%;
    height:auto;
    float:right;
    margin-right:0;

}

.lftbox1{
    float:left;
    max-width: 36.47%;
    margin-right:2%;



}
.lftbox2{
    float:left;
    max-width: 41.47%;


}
.lftbox3{
    float:left;
    width:63%;
    font-weight:600;


}

/*************/
/*Layout 5*/
/*************/
.pct16{
    width:315px;
    height:auto;
}

/*****************/
/*HAUSBOOT LISTE*/
/***************/

.borgh strong{
    font-size:1.0em;

}
/******************/
/*HAUSBOOT DETAIL*/
/****************/
.galboat{
    width:100.5%;
}

.tmboat1{
    width:98%;
    height:auto;
}


}/*end*/
/*************/
/* Screen 1000px bis 1240px Tablet Landscape und kleinere Desktopscreens (IPAD 1024px)*/
/*************/
@media screen and (max-width: 1243px) {

 #wrappr{
     overflow-x: hidden;
}


 #halign {
    max-width:1000px;
 }
#wpmid{
    max-width:66%;
}

h1 {
    font-size: 1.7em;
}
h2{
    font-size: 1.3em;
    margin-bottom:15px;
    letter-spacing:-0.1pt;
}
h3{

    letter-spacing:-0.1pt;
}
.pct3{

    width:15%;
    height:auto;
    margin: -18px 0 24px 24px;
}
.pct22{
    width:100%;
    height:auto;
}
.lftbox3{
    width:66%;
}


/*****************/
/*HAUSBOOT LISTE*/
/***************/

.boat{
    font-size:0.95em;
}
.borgh strong{
    font-size:0.85em;

}
.flxb34{
    display:flex;
    flex-wrap:wrap;
    width:100%;

}
.fxb34:first-child{
    width:28%;
}
.fxb34:last-child{
    width:93%;
}
.flxb35 div:nth-child(2){
    margin-left:12%;
}



}/*end*/
@media screen and (max-width: 1024px) {

/*************/
/*callaction */
/*************/
#menu5{
    position:fixed;
    bottom:-24px;
    left:0;
    width:100%;
    Background:#001fa4;
    color:#fff;
    padding:0px 12px 0 12px;
    z-index:99999999;
    font-size:1.7em;
    font-weight:600;
    border-radius:0;

}
#menu5 a{
   color:#fff;
   display:block-inline;

}
#menu5 a:hover{
    opacity:0.7;
}

.flxbkca{
    display:flex;
    flex-wrap:inherit;
    width:88%;
    justify-content: space-between;
    align-items: center;
}
.flxbkca i:first-child{
    font-style:normal;
    font-size:0.8em;
    font-weight:600;
    width:auto;
    padding-top:24px;
}
.flxbkca i:nth-child(2){
    padding-left:0;

}

}/*end*/

@media screen and (max-width: 1024px) {


}/*end*/

/*************/
/* Screen kleine Tablets  */
/*************/
@media screen and (max-width: 1000px) {

   html, body {
   	font-size:1.2em;
    line-height: 1.5em;
}

h1 {
    font-size: 1.4em;
}
h2{
    font-size: 1.2em;
    margin-bottom:15px;
    letter-spacing:-0.1pt;
}
h3{
    font-size: 1.0em;
    letter-spacing:-0.1pt;
}
#hmb3{
    position:absolute;
    display:block;
    top:0.5%;
    left:92%;
    margin: 0 0 0 0;
    z-index:888;
}

.hmbnav{
    background-color:#DDDDDD;
    display:none;
    position: absolute;
    top: 4%;
    width:83%;
    padding:18px;
    z-index:900;

}
#wplft{
    display:none;

}
 #wpmid{
     width:113%;
    max-width:113%;
    padding-top:1%;
    margin-left:-8%;
}
.pct3{
display:none;
}
.lftbox1{
    margin-left:48px;

}
.ctbx{
    margin-bottom:110px;
}

.flxb34 div:nth-child(2){
    width:48%;
}

/*****************/
/*HAUSBOOT LISTE*/
/***************/

.boat{
    width:100%;
    font-size:1.0em;
}
.borgh strong{
    font-size:1.0em;

}
.sortlist5 select{
    width: 25%;
    }



}/*end*/
@media screen and (max-width: 991px) {
#hmb3{
    top: 0.2%;

}

}/*end*/

/*************/
/* Screen 500px bis 762px Mobilephone  */
/*************/
@media screen and (max-width: 768px) {

  #halign {
    width:100%;

 }

#wpmid{
    width:114%;
    max-width:114%;



}

 .gal1{
    margin:-50px 0 0 0;
}
.lftbox1{
    float:left;
    max-width: 32.47%;
    margin-right:0.5%;


}
.lftbox2{
    float:left;
    max-width: 54%;


}
.lftbox3{
    float:left;
    width:66%;
    font-weight:600;


}
.pct4{
    width:31%;
    height:auto;
    float:right;
    margin-right:0;

}

.pct1{
    width:100%;
    height:auto;
}

#hmb3{
    position:absolute;
    top:0.17%;
    left:93%;
    margin: 0 0 0 0;
    z-index:888;
}

#hmb3 img{
    width:72%;
    height: auto;

}
.hmbnav{
    top: 1%;

}
.flxb34{
    flex-direction: row-reverse;
}
.flxb34 div:first-child{
    width:100%;
}
.flxb34 div:nth-child(2){
    width:95%;
    padding-left:5%;
    margin-bottom:48px;
}
.logo, .logoboot{
    width:160%;
    min-width:160%;
    max-width:160%;
    overflow:hidden;
}
#footer{
    margin-bottom:56px;
}




/*****************/
/*HAUSBOOT LISTE*/
/***************/

.boat{
    width:100%;
    font-size:1.0em;
}
.borgh strong{
    font-size:1.0em;

}
}/*end*/
@media screen and (max-width: 700px) {
.flxit8{
    width:98%;
    margin-right:0;
}

}/*end*/

/*************/
/* Screen 0px bis 500px Mobilephone  */
/*************/
@media screen and (max-width: 500px) {



.sortlist5 select{
    width:30%;
    }


#wpmid{
    width:113%;
    margin-top:16px;
}
.logo, .logoboot{
    width:200%;
    min-width:200%;
    max-width:200%;
}

h1 {
    font-size: 1.4em;
}
h2 {
    font-size: 1.1em;
}

h3{
    font-size: 1.1em;
    margin: 0;
    padding:0;
}

#hmb3{
    top:0.07%;
    left:90%;
    margin: 0 0 0 0;
    z-index:888;
}

#hmb3 img{
    width:25px;
    height: auto;
}
.hmbnav{
    width:85%;
    font-size:1.5em;
    line-height:1.8em;
    top:0.8%;

}
 html, body {
   	font-size: 1.0em;
    line-height: 1.5em;
}
.adress{
    padding:24px 0 0 0;
    font-size:0.85em;
}

.lftbox1{
    float:inherit;
    max-width: 100%;
    margin-left:24px;


}
.lftbox2{
    float:inherit;
    max-width: 100%;
    margin: 36px 0 0 24px;


}
.pct4{
    width:31%;
    height:auto;
    float:right;
    margin-right:8px;

}
.sblnk3{
    float:left;
    min-width:100%;
}

.submnu  {

 margin: 24px 0 0 18px;
}

/*Layout 1*/
.pclt1{
    float:inherit;
    margin-left:0px;
}
.ctbx22{
    padding-left: 0;

    margin-bottom:20px;
}
.ctbx{
    margin-bottom:12px;
    }


/*****************/
/*HAUSBOOT LISTE*/
/***************/
.boat{
    margin-bottom:60px;
}
.pclgbo1{
    width:18.75%;
    height:auto;
    float:right;
    margin:8px 14px 0 0;
}

.bobx1, .bobx2{
    justify-content:flex-start;
    flex-wrap: wrap;

}
.bolft{
    width:100%;
}
.pclgbo2{
    padding:14px 0 0 0;
    width:100%;
    max-width:580px;
    height:auto;
}
.bomid{
    padding:15px 12px 8px 12px;
    width:95%;
    border-bottom:0px #AEAEAE dashed;

}
.borgh{
    padding:15px 12px 8px 12px;
    width:95%;
    font-size:0.90em;
}
.pclgbo3{
    position:relative;
    float:right;
    max-width:140px;
    margin-top:-80px;

}
.bobx2 .bolft{
    padding: 0 0 0 12px;
    text-align: left;
    width:95%;
    margin-bottom:20px;

}
.pclgbo4{
    position:relative;
    margin-top:-25px;
    margin-right:12px;
    max-width:120px;
    float:right;
}
.bobx2 .bomid{
    margin-bottom:16px;
}



}/*end*/
@media screen and (max-width: 414px) {
#hmb3{
    top:0.1%;
    left:90%;
    margin: 0 0 0 0;
    z-index:888;
}

#hmb3 img{
    width:22px;
    height: auto;
}
.hb-hero-picture img{
    min-height:190px;
}

}/*end*/
@media screen and (max-width: 375px) {

h1{
    font-size:1.2em;
}
#wpmid{
    margin-top:0;
}

#menu5{
    font-size:1.5em;
    }

#hmb3{
    top:0.09%;
    left:90%;
    margin: 0 0 0 0;
    z-index:888;
}

#hmb3 img{
    width:22px;
    height: auto;
}
.hb-hero-picture img{
    min-height:180px;
}
}/*end*/
@media screen and (max-width: 320px) {
.hb-hero-picture img{
    min-height:160px;
}
#hmb3{
    top:0.07%;
    left:90%;
    margin: 0 0 0 0;
    z-index:888;
}

}/*end*/

/*************/
/* hausboot 2025 – farben & basis        */
/*************/

:root {
    --hb-orange: #f28a20;
    --hb-orange-dark: #d97712;
    --hb-orange-light: #fff4e9;

    --hb-text-dark: #333333;
    --hb-text-muted: #555555;
    --hb-text-blue: #124395;
}



/*************/
/* STARTANGEBOTE – kartenlayout          */
/*************/

#startangebote .hb-startangebote {
    margin: 24px 0 32px;
}

.hb-startangebote-intro {
    margin: 0 0 16px;
}

.hb-startangebote-title {
    margin: 0 0 10px;
}

/* Hinweistext unter den Startangeboten */
.hb-startangebote-hinweis {
    font-size: 0.85rem;
}

.hb-individuell-hinweis {
    font-size: 0.86rem;
}


/*************/
/* FAHRGEBIETE & EMPFEHLUNGEN – CARDS    */
/*************/

#fahrgebiete {
    margin: 24px 0 32px;
}

/* gleiche Gridlogik für Startangebote & Fahrgebiete */
.hb-grid,
.hb-area-list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.8rem;
    margin-top: 2rem;
}
/* Grundzustand: Beschreibung gekürzt */
.hb-area-desc {
    display: -webkit-box;
    -webkit-line-clamp: 4;   /* Anzahl sichtbarer Zeilen */
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: all 0.35s ease;
}

.hb-area-desc.is-expanded {
    -webkit-line-clamp: unset;
}
.hb-area-desc.is-expanded::after {
    display: none;
}

/* Button-Styling */
.hb-more-toggle {
    border:0;
    border-top: 1px solid #a8a7a7;
    padding: 0;
    margin: 1em 0 0.5rem 0;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 500;
    color: #d97712;
    text-decoration: none;
    background:transparent;
    text-align:right;
}


@media (min-width: 720px) {
    .hb-grid,
    .hb-area-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1050px) {
    .hb-grid,
    .hb-area-list {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Card-Grundstil – wie im neuen Design */
.hb-area {
    background: #d1dbe8;
    border: 1px solid #f0f0f0;
    border-radius: 16px;
    padding: 1.25rem 1.25rem 1.2rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    display: flex;
    flex-direction: column;
}

.hb-area:hover {
    transform: translateY(-3px);
    box-shadow: 0 7px 18px rgba(0,0,0,0.10);
}

/* Bild oben, bündig mit Card-Rand */
.hb-area-img {
    margin: -1.25rem -1.25rem 1.0rem;
    border-radius: 16px 16px 0 0;
    overflow: hidden;
}

.hb-area-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;
}

/* Titel & Text */
.hb-area h3 {
    font-size: 1.05rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    line-height: 1.35;
    color: var(--hb-text-dark);
}

.hb-area p {
    margin: 0 0 0.7rem;
    color: var(--hb-text-muted);
}

/* Preiszeile in Startangeboten (optional) */
.hb-area-price {

    margin-top: 0.1rem;
    margin-bottom: 0.7rem;
    color: var(--hb-text-dark);
}

.hb-area-price strong {
    margin: 0 0.25rem;
}

/* Linkzeile unten mit Icon, in Orange */
.hb-area-link {
    margin-top: auto;
    padding-top: 0.6rem;
}

.hb-area-link a {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-weight: 600;
    font-size: 0.92rem;
    color: var(--hb-orange-dark);
    text-decoration: none;
}

.hb-area-link a:hover {
    text-decoration: underline;
}

.hb-area-link i {
    font-size: 0.9rem;
}


/*************/
/* INDIVIDUELL PLANEN – FÜR ABENTEURER   */
/*************/

#individuell-planen {
    margin: 24px 0 40px;
}

.hb-individuell {
    padding: 16px 18px 18px;
    background: #fafafa;
    border-radius: 12px;
    border: 1px solid #e8e8e8;
}

.hb-individuell-title {
    margin: 0 0 0.8rem;
    font-size: 1.28rem;
    line-height: 1.3;
    color: var(--hb-text-dark);
}

.hb-individuell-layout {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 4px;
}

.hb-individuell-text p {
    margin: 0 0 0.7rem;
}

.hb-individuell-list {
    margin: 0.2rem 0 0.8rem 1.2rem;
    padding: 0;
}

.hb-individuell-list li {
    margin-bottom: 0.25rem;
}

/* Bild rechts, dezent, nicht zu dominant */
.hb-individuell-img {
    flex: 1.2;
}

.hb-individuell-img img {
    width: 100%;
    display: block;
    border-radius: 12px;
    object-fit: cover;
    max-height: 220px;
}

/* CTA-Button */
.hb-individuell-cta {
    margin-top: 0.8rem;
}

.hb-individuell-cta a {
    display: inline-block;
    font-weight: 600;
    padding: 7px 16px;
    border-radius: 999px;
    border: 1px solid var(--hb-orange-dark);
    background: var(--hb-orange-dark);
    color: #ffffff;
    text-decoration: none;
    font-size: 0.94rem;
}

.hb-individuell-cta a:hover {
    background: var(--hb-orange);
    border-color: var(--hb-orange);
    color: #ffffff;
}

/* kleiner Hinweistext unterhalb */
.hb-individuell-hinweis {
    margin: 0.9rem 0 0;
    font-size: 0.86rem;
    color: var(--hb-text-muted);
    max-width: 720px;
}

/* Responsive: Bild rechts nur auf breiten Screens */
@media (min-width: 860px) {
    .hb-individuell-layout {
        flex-direction: row;
        align-items: stretch;
    }

    .hb-individuell-text {
        flex: 2;
    }
}

@media (max-width: 680px) {
    .hb-individuell {
        padding: 14px 12px 16px;
    }

    .hb-individuell-title {
        font-size: 1.2rem;
    }
}
/*************/
/* KATALOGBLOCK / MESSEN                   */
/*************/

.hb-katalog-cta {
    margin: 24px 0 32px;
}

/* gelbe Box moderner, wie eine Card */
.hb-katalog-cta .yellowbox {
    background: #ffd800;
    border-radius: 16px;
    padding: 16px 18px 14px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.hb-katalog-cta .yellowbox h3 {
    margin-bottom: 6px;
}

.hb-katalog-cta .yellowbox p {
    margin-bottom: 0.6rem;
}

/* Messen-Liste etwas kompakter */
.hb-katalog-cta .yellowbox ul {
    margin: 4px 0 0;
    padding-left: 1.2rem;
}

.hb-katalog-cta .yellowbox li {
    margin-bottom: 2px;
}

/* Links unter der Box – flexibler CTA-Bereich */
.hb-katalog-links {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
}

/* Standardboxen im Linkbereich nicht mehr als „Blöcke“ */
.hb-katalog-links .sbx12,
.hb-katalog-links .sbx13 {
    margin: 0;
}

/* Link-Optik wie bei den neuen Bereichen */
.hb-katalog-links .ic {
    display: flex;
    flex-direction: column;


    gap: 0.5rem;
    font-weight: 600;
    text-decoration: none;
    font-size: 0.96rem;
}

/* Erste Zeile (Katalog) in Orange, Rest in Blau */
.hb-katalog-links .sbx12:first-child .ic {
    color: var(--hb-orange-dark);
}

.hb-katalog-links .sbx13 .ic,
.hb-katalog-links .sbx12:last-child .ic {
    color: var(--hb-text-blue);
}

.hb-katalog-links .ic:hover {
    text-decoration: underline;
}

.hb-katalog-links .ic i {
    font-size: 1.05rem;
}