@charset "utf-8";
@import url(/includes/fonts/fontawesome/all.css);
@import url(/includes/fonts/opensans/all.css);
@import url(/includes/css/general.css);
@import url(/includes/jquery3/slick/slick.css);
@import url(/includes/jquery3/slick/slick-theme.css);

* {box-sizing:border-box}
body {background:#07a}
input:focus,
textarea:focus,
.mystyled:active{box-shadow: 0 0 10px #fc0;}
.error{box-shadow: 0 0 10px #f00;border:1px solid #f00;}
.center ol,
.center ul {margin-left:20px}
button {cursor:pointer}

hr{border: 1px solid #801d18;}
body .ui-datepicker select.ui-datepicker-month,
select {border:1px solid #333;padding:7px;color:#666 !important;-moz-appearance: unset;background:url(/includes/img/select.png) center right no-repeat #fff;height:43px;padding-right:25px;}
body .ui-datepicker select.ui-datepicker-year {height:auto;padding:0;border:1px solid #333;color:#666 !important;-moz-appearance: unset;background:url(/includes/img/select.png) center right no-repeat #fff;}
select:disabled {background-color:#eee;}
textarea,
input[type="date"],
input[type="time"],
input[type="text"],
input[type="email"],
input[type="tel"]{height:43px;border:1px solid #999;padding:7px;color:#666;margin-top:5px}
#map_canvas {height:500px;}
.slick-dots {display:none !important;}

.imageleft {float: left!important;margin: 5px 40px 30px 0;padding: 3px;border: 1px solid #fb0;width:auto!important;max-width:100%;}
.imageright {float: right!important;margin: 5px 0 30px 40px;padding: 3px;border: 1px solid #fb0;width:auto!important;max-width:100%;}



input[type="checkbox"] {-webkit-appearance: checkbox !important;-moz-appearance: checkbox !important;-ms-appearance: checkbox !important;-o-appearance: checkbox !important;appearance: checkbox !important;width:auto;}
input[type="radio"] {-webkit-appearance: radio !important;-moz-appearance: radio !important;-ms-appearance: radio !important;-o-appearance: radio !important;appearance: radio !important;width:auto;}

header {width:100%;max-width:1280px;margin:0 auto;padding:0 20px;}
header .metanavi {height:20px;background-color:#fb0;position:relative;margin-bottom:30px}
header .metanavi ul {position:absolute;right:0;top:0;background:#fb0;border-bottom-left-radius:20px;padding:20px 20px 10px 20px;list-style:none;display:flex}
header .metanavi ul li:after {content:'|';margin:5px;color:#07a}
header .metanavi ul li:last-child:after {display:none}
header .metanavi ul li a {display:inline-block;text-decoration:none;color:#07a;font-weight:bold}
header .logotel {display:flex;justify-content:space-between;align-items:flex-end}
header .logotel a {color:#fff;font-size:30px;font-weight:bold;text-decoration:none}
header .logotel a[href^="tel:"] {padding-bottom: 10px;}
header .logotel a[href^="tel:"]:before {content:'\f879';font-family: 'Font Awesome 5 Free';font-weight:bold;margin-right:10px;}
header .navimainbild {background:#fb0;padding:20px;display:grid;grid-template-columns:1fr 3fr;grid-gap:20px }
header .navimainbild nav {background:#fff;}
header .navimainbild nav .burger {display:none}
header .navimainbild nav .navi {}
header .navimainbild nav .navi ul {list-style:none}
header .navimainbild nav .navi ul.openburger:last-child,
header .navimainbild nav .navi ul:last-child {display:none !important;}
header .navimainbild nav .navi ul li {background:#07a;border-bottom:1px solid #fb0}
header .navimainbild nav .navi ul li a {padding:5px 30px;display:block;color:#fff;text-decoration:none;font-size:22px;}
header .navimainbild nav .info {padding:10px 30px}
header .navimainbild nav .info * {font-size:12px}
header .navimainbild nav .info span {display:block;font-size:24px;margin-bottom:10px}
header .navimainbild nav .info table {width:100%}
header .navimainbild nav .info a {text-decoration:none}
header .navimainbild .mainslider {overflow:hidden;position:relative}
header .navimainbild #mainslider{clear:both;position:relative;top:0;left:0;width:100%;aspect-ratio: 4 / 3;overflow:hidden;}
header .navimainbild #mainslider .zone {width:100%;height:100%;}
header .navimainbild #mainslider.small .zone {width:calc(100% - 300px);}
header .navimainbild .slick-arrow {display:none !important;}
header .navimainbild #mainslider a {position:relative;display:inline-block;}
header .navimainbild #mainslider a .slidertext {position:absolute;bottom:0;left:0;border-top:1px solid #fb0;background:#07a;display:flex;justify-content:space-between;padding:10px;width:100%}
header .navimainbild #mainslider a .slidertext * {color:#fff;font-size:12px;}
header .navimainbild #mainslider:hover .step_left,
header .navimainbild #mainslider:hover .step_right {display:block;cursor:pointer}
header .navimainbild #mainslider .neu {width:0;height:0;position:absolute;top:0;left:0;border-right:75px solid transparent;border-top:75px solid #b11;}
header .navimainbild #mainslider .neu span {color:#fff;position:absolute;top:-60px;left:8px;transform: rotate(-45deg);font-weight:bold}
header .navimainbild .step_left div,
header .navimainbild .step_right div {font-family: "Font Awesome 5 Free";font-weight:bold;padding:10px;color:#fb0;font-size:50px}
header .navimainbild .step_left {position:absolute;left:0;top:50%;border-radius:0 100% 100% 0;background:#fffa;display:none}
header .navimainbild .step_right {position:absolute;right:0;top:50%;border-radius:100% 0 0 100%;background:#fffa;display:none}
header .slick-slide img {height:100%;width:auto}

.reisesuche {width:100%;max-width:1240px;margin:1px auto 50px;padding:0 0;}
.reisesuche .container {margin:0 auto 0;padding:20px;text-align:center;position:relative;max-width:75%;height:90px;background:#fb0;display:grid;grid-template-columns:1fr 3fr 1fr;grid-gap:10px;transition: height 1s;}
.reisesuche .container:before{content:' ';position:absolute;width:20px;height:100%;left:-20px;top:0;background-image:linear-gradient(to top right, transparent 0%, transparent 50%, #fb0 50%, #fb0 100%)}
.reisesuche .container:after{content:' ';position:absolute;width:20px;height:100%;right:-20px;top:0;background-image:linear-gradient(to top left, transparent 0%, transparent 50%, #fb0 50%, #fb0 100%)}
.reisesuche.open .container {height: 170px;}
.reisesuche span {color:#07a;font-size:24px;line-height:26px;display:inline-block;margin-right:10px}
.reisesuche span span {font-size:14px;display:block;float:none;line-height:18px;cursor:pointer}
.reisesuche span span:after {content:'\f054';font-family:'Font Awesome 5 Free';font-weight:900;margin-left:5px;display: inline-block;transition:transform 0.75s}
.reisesuche.open span span:after {transform: rotate(90deg);}
.reisesuche input,
.reisesuche select {width:190px;border:1px solid #000;margin-top:0}
.reisesuche button {height:43px;white-space:nowrap;background:#07a;border:none;color:#fff;cursor:pointer}
.reisesuche .zeilezwei button {display:none}
.reisesuche .allereisen {text-decoration:none;display:inline-block;height:43px;background:url(/includes/img/kalender.png) center left no-repeat #ddd;width:140px;margin-right: 2px;padding-left:50px;text-align:left;line-height:42px;border: 1px solid #000;}
.reisesuche .zeileeins {display:grid;grid-template-columns:1fr 1fr 1fr;grid-gap:10px}
.reisesuche .zeilezwei {display:none;grid-template-columns:1fr 1fr 1fr;grid-gap:10px;grid-column: 2;}
.reisesuche.open .zeilezwei {display:grid}
.reisesuche .zeilezwei br {display:none}

.h1container {width:100%;max-width:1280px;margin:50px auto 0;padding:0 20px;}
.h1container.gelb {margin-top:0;background-image:linear-gradient(to right, transparent 0%, transparent 20px, #fb0 20px, #fb0 calc(100% - 20px), transparent calc(100% - 20px), transparent 100%) }
.h1container div {margin:0 auto;text-align:center;position:relative;max-width:75%;height:100px;background:#fff;display:flex;justify-content: space-around;align-items:flex-end;}
.h1container div:before{content:' ';position:absolute;width:20px;height:100%;left:-20px;top:0;background-image:linear-gradient(to bottom right, transparent 0%, transparent 50%, #fff 50%, #fff 100%)}
.h1container div:after{content:' ';position:absolute;width:20px;height:100%;right:-20px;top:0;background-image:linear-gradient(to bottom left, transparent 0%, transparent 50%, #fff 50%, #fff 100%)}
.h1container div h1 {color:#07a;hyphens:auto}

.contentcontainer {width:100%;max-width:1280px;margin:0 auto;padding:0 20px;}
.contentcontainer .center {width:100%;background:#fff}
.contentcontainer .center.homepage {width:100%;background-image:url("/includes/img/hpbg.png");background-position: top center;background-repeat:no-repeat;background-size:contain}
.contentcontainer .center.homepage .inhalt {max-width:calc(75% + 40px);margin:0 auto;text-align:center;padding:50px 25% 0 0;}
.contentcontainer .center .inhalt {max-width:calc(100% - 60px);margin:0 calc(12.5% - 20px) 0;padding:30px 0}
.contentcontainer .center .inhalt h2:first-child {border-bottom:1px solid #07a;color:#07a;font-weight:bold;margin-bottom:20px;margin-top:0}
.contentcontainer .center .inhalt h2 {border-bottom:1px solid #07a;color:#07a;font-weight:bold;margin-bottom:20px;margin-top:60px}
.contentcontainer .center .inhalt h3 {color:#07a;font-weight:bold;margin-bottom:10px;margin-top: 40px;}
.contentcontainer .center .inhalt p {margin-bottom:20px}
.contentcontainer .center .inhalt p + h2 {margin-top:40px}
.contentcontainer .center .inhalt ul {margin-left:20px;margin-bottom:20px}

.contentcontainer .reisesuche {margin:0 auto;background:#fff;padding-top:30px}
.contentcontainer .reisesuche .container:before{background-image:linear-gradient(to bottom right, transparent 0%, transparent 50%, #fb0 50%, #fb0 100%)}
.contentcontainer .reisesuche .container:after{background-image:linear-gradient(to bottom left, transparent 0%, transparent 50%, #fb0 50%, #fb0 100%)}

.contentcontainer .center .reisehauptdetails {max-width:calc(100% - 60px);margin:0 calc(12.5% - 20px) 0;padding:30px 0;display:grid;grid-template-columns:2fr 1fr;grid-gap:30px}
.contentcontainer .center .reisehauptdetails .intro {margin-bottom:50px}
.contentcontainer .center .reisehauptdetails p {margin-bottom:30px}
.contentcontainer .center .reisehauptdetails p strong,
.contentcontainer .center .reisehauptdetails p b {color:#07a}
.contentcontainer .center .reisehauptdetails .laenderinformation {display:block}
.contentcontainer .center .reisehauptdetails .laenderinformation h3 {display:block;border-bottom:1px solid #07a;font-weight:bold;color:#07a;margin-bottom:20px}
.contentcontainer .center .reisehauptdetails .laenderderreise {margin-bottom:60px}
.contentcontainer .center .reisehauptdetails .laenderderreise a {display:inline-block;margin-right:10px;padding-right:5px;background:#ccc;text-decoration:none;color:#fff;height:32px;line-height:25px;margin-bottom:10px}
.contentcontainer .center .reisehauptdetails .laenderderreise a span {padding:5px;display:inline-block;position:relative;top:-8px}
.contentcontainer .center .reisehauptdetails .laenderderreise a img {height:30px;position:relative;left:1px;top:1px;margin-right:5px}

.reisedetails .preise .preis {display:block;}
.reisedetails .preis .normpreis {color:#000;width:540px;border-bottom: 1px dotted #ccc;position:relative;}
.reisedetails .preis .fbpreis {width:300px;border-bottom: 1px dotted #ccc;position:relative;margin-left:240px;font-size:80%}
.reisedetails .preis .fbpreis .title,
.reisedetails .preis .normpreis .title {display:inline;margin-bottom:-1px;background:#fff;padding-right:10px;color:inherit;line-height:20px;vertical-align:bottom;max-width:300px;}
.reisedetails .preis .fbpreis  .preis,
.reisedetails .preis .normpreis .preis {color:#444;margin-bottom:-5px;background:#fff;position:absolute;right:0;bottom:3px;padding-left:10px;}
.reisedetails .preise {position:relative;padding-bottom: 120px;}
.reisedetails .leistungen {padding-bottom: 120px;}
.reisedetails h2 {color:#07a;}

.contentcontainer .center .rightbox .dauer {display:grid;grid-template-columns:40px 1fr;margin-bottom:3px;grid-gap:3px}
.contentcontainer .center .rightbox .dauer .tage {background:#07a;color:#fff;padding:3px;text-align:center;font-size:75%}
.contentcontainer .center .rightbox .dauer .tage b {color:inherit;display:block;font-size:150%;text-align:center}
.contentcontainer .center .rightbox .dauer .datum {background:#07a;color:#fff;line-height:42px;text-align:center;}
.contentcontainer .center .rightbox .dauer .alttermine {grid-column:1 / span 2}
.contentcontainer .center .rightbox .dauer .alttermine select {width:100%;}
.contentcontainer .center .rightbox .bilder {display:grid;grid-template-columns:1fr 1fr;grid-gap:3px;max-width:100%}
.contentcontainer .center .rightbox .bilder a {display:block;}
.contentcontainer .center .rightbox .bilder a.full {grid-column: auto / span 2;text-decoration:none}
.contentcontainer .center .rightbox .bilder img {width:100%;max-width:100%;height:auto;display:block}
.contentcontainer .center .rightbox .aktion {display:grid;grid-template-columns:1fr 1fr;grid-gap:1px;margin-top:3px;margin-bottom:3px}
.contentcontainer .center .rightbox .aktion a {background:#999;color:#fff}
.contentcontainer .center .rightbox .aktion a:hover {background:#07a}
.contentcontainer .center .rightbox .aktion a.laender {font-family:'Font Awesome 5 Free';font-weight:900;text-align:center;color:#fff;font-size:35px;line-height:50px;text-decoration:none}
.contentcontainer .center .rightbox .aktion a.pdf {text-decoration:none;color:#fff;line-height:50px;padding:0 10px;font-size:25px;text-align:center}
.contentcontainer .center .rightbox .aktion a.pdf:before {content:'\f019';font-family:'Font Awesome 5 Free';font-weight:900;margin-right:5px}
.contentcontainer .center .rightbox .aktion a.mail {font-family:'Font Awesome 5 Free';font-weight:900;font-size:45px;line-height:50px;color:#fff;text-decoration:none;text-align:center}
.contentcontainer .center .rightbox .leistungen {background:#ddd;padding:5px}
.contentcontainer .center .rightbox .leistungen h3 {color:#07a;margin:10px 10px}
.contentcontainer .center .rightbox .leistungen ul {margin-left:20px;}
.nl_senden_in,
.nl_senden_out,
.contentcontainer .booking_btn {background:#fb0;border:1px solid #07a;color:#07a;display:block;text-align:center;text-decoration:none;padding:10px;margin-top:10px;font-weight:bold}

.tabcontrol_box{border-bottom: 2px solid #07a;height: 39px;margin: 80px 0 40px;}
.tabcontrol{height: 35px !important;display: inline-block;padding: 0 5px;background: #ddd;margin-right: 2px;margin-bottom: 0;cursor: pointer;}
.tabcontrol.aktive{background: #07a;border-width: 2px;border-style: solid;border-color: #07a;margin-bottom: -1px;height: 37px !important;}
.tabcontrol div{display:block;color:#07a;line-height:28px;}
.tabcontrol.aktive div{color:#fff;line-height:28px;font-weight:bold;}
.tabcontrol.aktive:hover{background: #07a;}
.tabcontrol:hover{background:#07a;}
.tabcontrol:hover div{color:#eee}
.schaltertitel{display:none}

.homepageboxen {margin:100px calc(12.5% - 20px) 0;padding-bottom:50px}
.homepageboxen .ueberschrift {display:block;border-bottom:1px solid #07a;text-align:center;margin-bottom:40px;color:#07a;font-weight:bold;font-size:30px;background: #fffa;}
.homepageboxen .boxen {display:grid;grid-template-columns: 1fr 1fr;grid-gap:50px;}
.homepageboxen .boxen a {background:#fb0;display:grid;grid-template-columns:40% 60%;text-decoration:none;box-shadow:0 0 10px #000}
.homepageboxen .boxen a:nth-child(even) {grid-template-columns:60% 40%;}
.homepageboxen .boxen a .img {background-size:cover;background-position:center center;min-height:280px}
.homepageboxen .boxen a .infos {margin:10px;background:#fff;padding:10px 20px}
.homepageboxen .boxen a:nth-child(even) .img {order:2}
.homepageboxen .boxen a:nth-child(even) .infos {order:1}

.homepageboxen .boxen a .infos .titel {font-weight:bold;color:#07a;font-size:20px;margin-bottom:20px;display:block}
.homepageboxen .boxen a .infos .text * {hyphens:auto}

footer {width:100%;max-width:1280px;margin:0 auto;padding:0 20px;}
footer .center {background:#666;color:#fff;padding:20px calc(12.5% - 20px);}
footer .footer_boxes {display:grid;grid-template-columns:38% 24% 38%;grid-gap:50px}
footer .footer_boxes * {color:#fff;font-size:12px}
footer .footer_boxes p {margin-bottom:10px;display:block}
footer .footer_boxes h3 {margin-bottom:10px;font-size:18px}
footer .footer_boxes a {text-decoration:none}
footer .footer_boxes .footer_system * {font-size:10px;color:#fff;text-decoration:none}
footer .footer_boxes .footer_system #bildrechte {font-size:8px;color:#fff;width:100%;margin:15px 0 0}
footer .footer_boxes .footer_system ul {list-style:none;display:flex;margin-bottom:5px;margin-left:0}
footer .footer_boxes .footer_system ul li:after {content:'|';margin:2px;color:#fff}
footer .footer_boxes .footer_system ul li:last-child:after {display:none}

#k3dCarousel{height:240px;position:relative;margin:70px auto;max-width:930px;}
#k3dCarousel a {overflow: visible !important;}
#k3dCarousel img{border:none;box-shadow: 0 0 4px #999;display:block;max-width:100%;}
.stat_img img{display:block!important;}
.stat_img img.b1{position:absolute;top:0;left:0;}
.stat_img img.b2{position:absolute;top:0;left:255px;}
.stat_img img.b3{position:absolute;top:0;right:0;}
#k3dCarousel .left{width:10px;height:100px;background:url(/includes/img/carousel_links.png) center no-repeat;}
#k3dCarousel .right{width:10px;height:100px;background:url(/includes/img/carousel_rechts.png) center no-repeat;}

.normaltable {width:100%;margin-top:30px;border-collapse:collapse}
.normaltable th,
.normaltable td {border:1px solid #ccc;padding:3px;hyphens: auto;font-size:12px}
.normaltable th {background:#ddd}
.normaltable caption {font-weight:bold;font-size: 150%;}

#content_laender {display:grid;justify-content:space-between;grid-template-columns:30% 30% 30%; grid-template-rows: auto;grid-column-gap:5%}
#content_laender a {box-shadow: 0 0 5px #999;text-decoration:none;margin-bottom:20px}
#content_laender a img {display:block;width:100%;height:auto}
#content_laender a .name {display:block;font-size:26px;line-height:30px;width:100%;text-align:center;padding:10px 5px 0;font-weight:bold;color:#448;}
#content_laender a .beschreibung {display:block;font-size:18px;line-height:24px;width:100%;text-align:center;margin-bottom:20px;color:#999}
#content_laender a .lastline {display:flex;justify-content: flex-end}
#content_laender a .lastline span{background:#ea0;padding:5px;border-left:1px solid #fff;color:#444;}
#content_laender a .lastline img.flagge {height: 35px !important;width: auto;}

.reiseliste {}
.reiseliste .zone {display:grid;justify-content:space-between;grid-template-columns:30% 30% 30%; grid-template-rows: auto;}
.reiseliste .zone .new_year {grid-column: 1 / span 3;border-bottom: 3px solid #07a;padding-top: 30px;margin-bottom: 25px;font-weight: bold;color: #07a;font-size: 120%;}
.reiseliste .zone h3 {grid-column:1 / span 3}
.reiseliste .listenhilfe {grid-column:1 / span 3}
.links .reiseliste .zone {grid-template-columns:47.5% 47.5%;grid-column-gap:5%;grid-template-rows: auto;}
.reiseliste.oncountry .zone {grid-template-columns:47% 47%;}
.reiseliste .zone h3 {clear:both;margin:40px 0;display:block;grid-column:1 / span 2}
.reiseliste.oncountry .zone h3 {grid-column:1 / span 2}
.reiseliste .listenhilfe {grid-column:1 / span 2}
.reiseliste.oncountry .listenhilfe {grid-column:1 / span 2}
.reiseliste .listenhilfe .monatjumplist a {float:none;height:auto;margin-left:5px;text-decoration:underline;white-space:nowrap;box-shadow:none;font-size:75%}
.reiseliste .trenner.jahr {display:none}

.reiseliste .zone a {text-decoration:none;width:100%;position:relative;height:380px;margin-bottom:35px;box-shadow:0 3px 3px #666;}
.reiseliste .zone a .img {width:calc(100% - 20px);height:260px;display:block;background-position: center center;background-size:cover;margin-left:10px}
.reiseliste .zone a .empf {position:absolute;left:0;top:0;background:#fb0;color:#07a;padding-left:5px;display:none}
.reiseliste .zone a .empf:after {content:'';display:inline-block;height:0;width:0;border-style: solid;border-width: 25px 25px 0 0;border-color: #fb0 transparent transparent transparent;position:absolute;right:-25px}
.reiseliste .zone a .preis {position:absolute;right:10px;top:250px;background:#fb0;transform:rotate(-10deg);padding:5px;border-radius:5px;box-shadow: 0 0 3px #333;text-align:right}
.reiseliste .zone a .preis small {display:block;font-size:75%;line-height:75%}
.reiseliste .zone a .preis.fastausgebucht {top:235px}
.reiseliste .zone a .preis.ausgebucht {top:245px}
.reiseliste .zone a .backtext {display:none;position:absolute;top:44px;left:10px;width:calc(100% - 20px);height:calc(100% - 127px);background:rgba(0,0,0,.3);z-index:1;padding:5px;hyphens:auto}
.reiseliste .zone a .info {display:table;position:absolute;top:297px;padding:10px 0 0 0;width:100%;}
.reiseliste .zone a .info .title {padding:0 4px 4px 4px;background:#fff;width:100%;display:flex;font-size:24px;line-height:24px;color:#07a;font-weight:bold;text-align:center;height:75px;overflow:hidden;max-height:75px;align-items:center;justify-content:center;}

.reiseliste .zone a .backtext,
.reiseliste .zone a .img {backface-visibility: hidden;transition: 2s;transform-style: preserve-3d;position:relative;background-color:#fff}
.reiseliste .zone a .backtext {transform: rotateY(180deg);display:block;position:absolute;overflow:hidden;font-weight:300;background:#fff}
.reiseliste .zone a:hover .img {transform: rotateY(180deg);}
.reiseliste .zone a:hover .backtext {transform: rotateY(0);}

.reiseliste .zone a .subinfo {display:flex;background:#fff;justify-content:space-between;padding:2px 0}
.reiseliste .zone a .subinfo .datum {font-size:16px;line-height:28px;padding:6px 0 6px 6px}
.reiseliste .zone a .subinfo .status {border-left:1px solid #07a;white-space:nowrap;font-size:12px;line-height:14px;padding:6px 50px 6px 6px;position:relative;color:#583;font-weight:bold}
.reiseliste .zone a .subinfo .status span {border:2px solid #583;width:30px;height:30px;border-radius:50%;display:inline-block;position:absolute;right:10px;top:6px}
.reiseliste .zone a.gesichert .subinfo .status {color:#583}
.reiseliste .zone a.gesichert .subinfo .status span {background-color:#583}
.reiseliste .zone a.restplatz .subinfo .status {color:#583}
.reiseliste .zone a.restplatz .subinfo .status span {background-color:#583}
.reiseliste .zone a.ausgebucht .subinfo .status {color:#b11}
.reiseliste .zone a.ausgebucht .subinfo .status span {background-color:#b11}
.reiseliste .zone a.anfrage .subinfo .status {color:#07a}
.reiseliste .zone a.anfrage .subinfo .status span {background-color:#07a}

.reiseliste .zone a .neu {width:0;height:0;position:absolute;top:44px;left:10px;border-right:75px solid transparent;border-top:75px solid #b11;}
.reiseliste .zone a .neu span {color:#fff;position:absolute;top:-60px;left:8px;transform: rotate(-45deg);font-weight:bold}

.allInOneKontakt {}
.allInOneKontakt h3{margin-top:50px;font-size:18px;line-height:24px;border-bottom:1px solid #801d18;font-weight:300;margin:30px 0 10px}
.allInOneKontakt .bereiche ul {list-style:none;}
.allInOneKontakt .bereiche ul li {float:left;width:33%;display:block}
.allInOneKontakt select,
.allInOneKontakt textarea,
.allInOneKontakt input[type="text"],
.allInOneKontakt input[type="tel"],
.allInOneKontakt input[type="time"],
.allInOneKontakt input[type="date"],
.nl_email_in, .nl_email_out,
.allInOneKontakt input[type="email"]{width:46%;margin-right:20px;position:relative}
.allInOneKontakt input[type="checkbox"]{margin-right:20px;}
.allInOneKontakt input[name="grund_plz"] {width:calc(14% - 4px);margin-right:0}
.allInOneKontakt input[name="grund_ort"] {width:32%}
.allInOneKontakt select {border-color:#999}
.allInOneKontakt label {display:inline;font-weight:300;font-size:14px}
.allInOneKontakt button {width: 46%;margin:0 auto;display:block;background:#fb0;border:1px solid #07a;color:#07a;font-weight:bold;padding:10px;cursor:pointer}
.allInOneKontakt .zusatzfelder {margin-bottom:40px}

validationhelp {position:absolute;margin-left:-40px;font-weight: bold;font-size: 25px;margin-top:13px}
.allInOneKontakt select.valide + validationhelp,
select + validationhelp {margin-left:-65px}

input[name="grund_plz"] + validationhelp {margin-left:-20px}
input[type="checkbox"] + validationhelp {margin-left:-20px !important;margin-top:0px}

.nltxt {font-size: 12px;line-height: 14px;}

.allInOneKontakt .optional + validationhelp:before{content:'*'}
.allInOneKontakt .selectone + validationhelp:before{content:'?'}
.allInOneKontakt .pflicht + validationhelp:before{content:'!';color: #f00;}
.allInOneKontakt .valide + validationhelp{margin-left:-44px}
.allInOneKontakt .valide + validationhelp:before{content:'✓';color: #060;}
.allInOneKontakt input[type="checkbox"].error + label {color:#f00}
.allInOneKontakt input:invalid {box-shadow:none}
.allInOneKontakt .datenschutzklausel {width: 43%;display: inline-block;font-size: 12px;line-height: 14px;}
.allInOneKontakt .datenschutzklausel label {font-size:inherit;line-height: inherit;}
.allInOneKontakt .katalogliste {text-align: center}
.allInOneKontakt .katalogliste .katalog {position:relative;text-decoration:none;display: inline-block;}
.allInOneKontakt .katalogliste .katalog img {transform: rotate(-5deg);box-shadow: -5px 10px 10px #444;transition: transform 0.5s}
.allInOneKontakt .katalogliste .katalog:hover img {transform:rotate(0);}
.allInOneKontakt .katalogliste .katalog span {font-family:'Kalam';display: block;margin-top: 20px;max-width: 200px;text-align: center;margin-left:35px;position:relative}
.allInOneKontakt .katalogliste .katalog span:before {content:'\f019';font-family:'Font Awesome 5 Free';font-weight:900;font-size:25px;position:absolute;left: -25px;line-height: 40px;top:10px;color:#801d18}
.allInOneKontakt textarea {height: 200px;}

.stornostaffel img {display:none}
.stornostaffelstufen {display:none;}
.stornostaffelstufen table th,
.stornostaffelstufen table td {border:1px solid #ccc;padding:0 3px}

/* BLOG */
#blogliste .eintrag:hover {box-shadow:0 0 5px #666}
#blogliste .eintrag {margin:20px 0;padding:10px;border:1px solid #ddd;position:relative;display:grid;grid-template-columns:1fr 2fr;grid-gap:20px;text-decoration:none}
#blogliste .eintrag .left img {width:100%;height:auto}
#blogliste .eintrag .left .details {color:#07a;font-size:12px;display:block}
#blogliste .eintrag .left .details span {width:70px;display:inline-block;color:#333;font-size:10px;line-height:20px}
#blogliste .eintrag .right h3 {margin:5px 0 0;font-size:22px;line-height:25px;color:#07a;}
#blogliste .eintrag .right h4 {margin:5px 0 15px;}
#blogliste .eintrag .right span {height:78px;overflow:hidden;display:block;font-size:16px;line-height:19px;}

.blogdetails {display: grid;grid-template-columns: 2fr 1fr;grid-gap: 30px;max-width: calc(100% - 60px);margin: 0 calc(12.5% - 20px) 0;padding: 30px 0;}
.blogdetails .rightbox .author {background:#ddd;padding:5px;border-top:2px solid #fff;border-bottom:2px solid #fff}
.blogdetails .rightbox .backtooverview {background:#07a;color:#fff;display:block;text-decoration:none;text-align:center;padding:10px}

@media (max-width:1290px) and (min-width: 681px)  {
    body header .navimainbild {grid-template-columns:1fr}
    body header .slick-slide img {display:block;width:100%;height:auto;}
    body header .navimainbild nav .navi ul {display:none}
    body header .navimainbild nav .navi .burger {display:block;background:#07a;text-align:center;color:#fff;font-size:30px;padding:5px;cursor:pointer;border-bottom:1px solid #fb0}
    body header .navimainbild .info {display:none}
    body header .navimainbild .info.openburger {display:block}
    body header .navimainbild nav .navi ul.openburger:last-child,
    body header .navimainbild nav .navi ul.openburger {display:block !important;}
    body header .logotel {display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;padding-top:20px}
    body header .logotel img {max-width:100%;margin-left:20px}
    body header .logotel a:last-child {font-size: 20px;text-align: right;padding-right: 20px;}

    body .reisesuche.open,
    body .reisesuche.open .container {height:auto;}
    body .reisesuche .container .zeilezwei {grid-column:auto;grid-template-columns:1fr;grid-gap:0}
    body .reisesuche {max-width:100%;width:100%;margin-left:0;left:0;position:relative;padding:0}
    body .reisesuche .container {text-align:center;grid-template-columns:1fr;grid-gap:0}
    body .reisesuche .container span {float:none;margin-right:0}
    body .reisesuche.open button {order:1;margin-top:10px}
    body .reisesuche .zeileeins {margin-top:20px;display:none;}
    body .reisesuche button {display:none;}
    body .reisesuche .zeilezwei {margin-top:0;padding-left:0;text-align:center;display:none}
    body .reisesuche.open {height:500px}
    body .reisesuche.open .zeileeins,
    body .reisesuche.open .zeilezwei,
    body .reisesuche.open button {display:block}
    body .reisesuche.open .zeilezwei button {display: block;position: relative;bottom: 0;top: 10px;right: 0;left: 0;width: 100%;}
    body .reisesuche select,
    body .reisesuche input {margin-top:10px;display:block;width:100%}
    body .reisesuche .allereisen {display:none}

    body .reiseliste .zone {grid-template-columns:49% 49%}
    .reiseliste .zone .new_year {grid-column:1 / span 2}
    x.body .reisehauptdetails .reisedetails {grid-row:2}
    body .contentcontainer .center .reisehauptdetails {grid-template-columns:1fr 1fr;}

    body .homepageboxen .boxen {grid-template-columns:1fr}
    body .homepageboxen .boxen a {grid-template-columns:45% 55%;}

    body .allInOneKontakt .zusatz_mietbus,
    body .allInOneKontakt .grunddaten {display:grid;grid-template-columns:1fr 1fr;grid-gap:20px}
    body .allInOneKontakt .zusatz_mietbus h3,
    body .allInOneKontakt .grunddaten h3 {grid-column:1 / span 2}
    body .allInOneKontakt select,
    body .allInOneKontakt textarea,
    body .allInOneKontakt .datenschutzklausel,
    body .allInOneKontakt input[type="text"],
    body .allInOneKontakt input[type="email"],
    body .allInOneKontakt input[type="time"],
    body .allInOneKontakt input[type="tel"]{width:100%;margin-right:0;margin-top:0}
    body .allInOneKontakt .bereiche ul li {width:50%}

    body footer {padding:0;}
    body footer .footer_boxes {grid-template-columns:2fr}
    body footer .footer_boxes .footer_system {grid-column:1 / span 2}
}

@media (max-width:680px) {
    body header {padding:0}
    body header .metanavi {display:none}
    body header .navimainbild {grid-template-columns:1fr}
    body header .slick-slide img {display:block;width:100%;height:auto;}
    body header .navimainbild nav .navi ul {display:none}
    body header .navimainbild nav .navi .burger {display:block;background:#07a;text-align:center;color:#fff;font-size:30px;padding:5px;cursor:pointer;border-bottom:1px solid #fb0}
    body header .navimainbild .info {display:none}
    body header .navimainbild .info.openburger {display:block}
    body header .navimainbild nav .navi ul.openburger:last-child,
    body header .navimainbild nav .navi ul.openburger {display:block !important;}
    body header .logotel {display:grid;grid-template-columns:1fr 1fr;grid-gap:20px;padding-top:20px}
    body header .logotel img {max-width:100%;margin-left:20px}
    body header .logotel a:last-child {font-size: 20px;text-align: right;padding-right: 20px;}
    body .h1container div h1 {font-size: 25px;}

    body .contentcontainer {padding:0}
    body #k3dCarousel {display:none}

    body .reisesuche.open,
    body .reisesuche.open .container {height:auto;}
    body .reisesuche .container .zeilezwei {grid-column:auto;grid-template-columns:1fr;grid-gap:0}
    body .reisesuche {max-width:100%;width:100%;margin-left:0;left:0;position:relative;padding:0}
    body .reisesuche .container {max-width:100%;width:100%;margin-left:0;text-align:center;grid-template-columns:1fr;overflow: hidden;grid-gap:0}
    body .reisesuche .container span {float:none;margin-right:0}
    body .reisesuche .container:before,
    body .reisesuche .container:after {display:none}
    body .reisesuche.open button {order:1;margin-top:10px}
    body .reisesuche .zeileeins {margin-top: 20px;display: block;}
    body .reisesuche .zeilezwei {margin-top:0;padding-left:0;text-align:center}
    body .reisesuche.open {height:500px}
    body .reisesuche.open .zeilezwei button {display: block;position: relative;bottom: 0;top: 10px;right: 0;left: 0;width: 100%;}
    body .reisesuche select,
    body .reisesuche input {margin-top:10px;display:block;width:100%}
    body .reisesuche .allereisen {display:none}

    body .h1container.gelb {background:#fb0}
    body .reiseliste .zone {grid-template-columns:1fr}
    .reiseliste .zone .new_year {grid-column:1}
    body .reisehauptdetails .reisedetails {grid-row:2}
    body .contentcontainer .center .reisehauptdetails {grid-template-columns:1fr;}

    body validationhelp {margin-left:-20px}
    body select + validationhelp {margin-left:-40px}
    body .grunddaten {display:flex;flex-direction: column;}
    body .allInOneKontakt .bereiche ul li {float:none;width:95%}
    body .allInOneKontakt select,
    body .allInOneKontakt textarea,
    body .allInOneKontakt .datenschutzklausel,
    body .allInOneKontakt input[type="text"],
    body .allInOneKontakt input[type="email"],
    body .allInOneKontakt input[type="tel"]{width:100%;margin-right:0}
    body .allInOneKontakt .datenschutzklausel {display:block;margin-top:20px}
    body .allInOneKontakt button {width:100%}
    body .allInOneKontakt span.grund_plz {width:100%}
    body .allInOneKontakt span.grund_ort {width:100%}

    .buchungsrahmen{padding-top: 40px;}
    .buchungsrahmen input,
    .normal_form input {height:21px;line-height:21px;font-size:18px;float:none;padding: 2%;margin: 1% auto;width: 95%;border: 1px solid #CCC;clear: both;}
    .buchungsrahmen input[type="checkbox"] {width:auto;}
    .buchungsrahmen textarea:focus,
    .buchungsrahmen input:focus {box-shadow:0 0 5px #eb6909;}
    .buchungsrahmen label {display:none;}
    .buchungsrahmen .rightbox {float: right;margin-top: -65px;margin-right: 50px;}
    .buchungsrahmen .reisetext {margin-bottom:30px;}
    .buchungsrahmen .mystyled {display: inline-block;width: 90px;}
    .buchungsrahmen .mystyled.versicherung {width:100%;top: 7px;}
    .buchungsrahmen .mystyled.versicherung .myliste {width:100%;}
    .buchungsrahmen .teilnehmerzahl {margin-bottom:20px;}
    .buchungsrahmen .teilnehmerzahl .mystyled {width:100%;top:7px;}
    .buchungsrahmen .teilnehmerzahl .mystyled .myliste {width:100px;}
    .buchungsrahmen textarea,
    .normal_form textarea{width:96%;height:100px;padding: 1%;line-height:21px;font-size:18px;border: 1px solid #CCC;}
    .buchungsrahmen .person {padding:10px;margin:25px 0;box-shadow:0 0 5px #999;}
    .person .mystyled, .person input {float:left;clear:none;}
    .person input[type="checkbox"] {width:auto;margin-right:10px;}
    .person .abfahrtsort {width: 90%;}
    .person .abfahrtsort .myliste {width: 90%;font-size:18px;}
    .person .alter {margin-left:10px;width:70px}
    .person .alter .myliste {width:60px;}
    .person .anrede .myliste {width:100px;}
    .person .leistungen {display:block;margin:0;padding:10px 0 0;margin-bottom:20px;width:100%}
    .person .leistungen .org{color:#eb6909}
    .person .leistungen .first {margin-top:10px;display: block;}
    .person .leistungen.passiv {display:none;}
    .person .preisdotted {border-bottom: 1px dotted #BBB;position: relative;}
    .person .preisdotted .title {margin-bottom: -1px;background: #fff;display: inline-block;padding-right: 10px;line-height: 20px;}
    .person .preisdotted .preis {position: absolute;right: 0;bottom: -1px;background: #fff;padding-left: 10px;}
    .person .preisdotted .preisfb {display:inline-block;color:#eb6909;cursor:pointer;padding:1px 2px;margin:0 80px 0 20px;}
    .person .perspreis {border:none;border-top:1px solid #000;font-weight:bold;}
    .grouprabatt {float:right;width:600px;display:none;}
    .endpreis {width:100%;border-top:1px solid #000;font-weight:bold;}
    .grouprabatt .preis,
    .endpreis .preis {float:right;}
    .booking_btn.checkback {background:#666;color:#fff}
    .error {border:2px dotted #00378b !important;}
    .agbred {margin-left:10px;}
    .taxiservice {display: block;}
    .taxiservice span {margin-left:10px;}

    body .buchungsrahmen h2 {margin-top:40px !important;}
    body .buchungsrahmen .buchungstep6 textarea,
    body .buchungsrahmen .buchungstep6 select,
    body .buchungsrahmen .buchungstep6 input,
    body .buchungsrahmen .buchungstep6 .werte .grund_ort input,
    body .buchungsrahmen .buchungstep6 .werte span {width:100%}
    body .buchungsrahmen .buchungstep6 .werte .grund_hausnr,
    body .buchungsrahmen .buchungstep6 .werte .grund_plz {width:40%}
    body .buchungsrahmen .buchungstep6 .werte {display:flex;flex-wrap:wrap;}
    body .buchungsrahmen .buchungstep6 .werte .grund_strasse,
    body .buchungsrahmen .buchungstep6 .werte .grund_ort {width:60%}

    body .contentcontainer .center.homepage .inhalt {padding-right:0}

    body .homepageboxen .boxen {grid-template-columns:1fr}
    body .homepageboxen .boxen a {grid-template-columns:1fr !important;}
    body .homepageboxen .boxen a .infos {order:2 !important;}

    body #blogliste .eintrag {grid-template-columns:1fr}
    body .blogdetails {grid-template-columns:1fr}

    body footer {padding:0;}
    body footer .footer_boxes {grid-template-columns:1fr}
}