/* WIRD NICHT VERWENDET - KANN GELÖSCHT WERDEN -------------------------------------------------- */ /**** xs Extra small devices (portrait phones, less than 576px) ****/ @media (max-width: 575px) { ... } /**** sm Small devices (landscape phones, 576px and up) ****/ @media (min-width: 576px) and (max-width: 767px) { ... } /**** md Medium devices (tablets, 768px and up) ****/ @media (min-width: 768px) and (max-width: 991px) { ... } /**** lg Large devices (desktops, 992px and up) ****/ @media (min-width: 992px) and (max-width: 1199px) { ... } /**** xl Extra large devices (large desktops, 1200px and up) ****/ @media (min-width: 1200px) { ... } /* ENDE - WIRD NICHT VERWENDET - KANN GELÖSCHT WERDEN -------------------------------------------------- */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX FONTS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ @font-face {font-family: 'Quasimoda Reg';src: url('../fonts/Quasimoda-Regular.ttf') format('truetype');} @font-face {font-family: 'Quasimoda Med';src: url('../fonts/Quasimoda-Medium.ttf') format('truetype');} @font-face {font-family: 'Quasimoda SemiBold';src: url('../fonts/Quasimoda-SemiBold.ttf') format('truetype');} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX ROOT XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ :root { --animate-duration: 1800ms; --animate-delay: 0.9s; --main-bg:#FFF; --placeholder:#FFF; --main:RGBA(105,96,85,1); --main-2:RGBA(127,123,120,1); --main-3:RGBA(166,160,156,1); --main-4:RGBA(187,180,174,1); --main-5:RGBA(217,212,205,1); --lightred:RGBA(182,135,125,1); --lightblue:RGBA(203,213,224,1); --h1:transparent; --h2:RGBA(105,96,85,1); --h3:#6a5c67; --brand:#fff; --error:#CC0000; --ok:#9ECB14; --label:#555; --dates:#aaa; --thin-line:#ededed; --fa:#fff; --opacity:RGBA(0,0,0,.2); } /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX webEdition HACK XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ a[href="https://www.webEdition.org"], a[title="This page was created with webEdition CMS"]{display:none;font-size:0px;position:absolute;z-index:-1;bottom:0;height:0;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX SCROLLBAR ENTFERNEN XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ ::-webkit-scrollbar {display: none;} *, ::after, ::before {scrollbar-width: none;-ms-overflow-style: none;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX MISC XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .container-fluid{padding-left:0;padding-right:0;} .scroll.horizontal{position:relative;width:100%;overflow-y:hidden;overflow-x:auto;scrollbar-width: none;-ms-overflow-style: none;} .scroll.horizontal .inner{} .siteload.ani{animation-name: fadeIn;animation-duration: 6s;animation-delay: 0s;/*animation-iteration-count: infinite;*/animation-fill-mode: both;display: block;backface-visibility: visible !important;} .web, .popup{animation-name: fadeIn;animation-duration: 3s;animation-delay: 0s;/*animation-iteration-count: infinite;*/animation-fill-mode: both;display: block;backface-visibility: visible !important;} .popup{animation-duration: 0s;} .admin{font-size:.8rem;color:var(--error);} .container{padding:0;position:relative;min-height:100%;border-radius:0;border:0;} .anker{position:absolute;margin-top:-5rem;} .error{color:var(--error);} .relative{position:relative;} .main-bg{background-color:var(--main-bg);color:var(--main);} .main-bg-1{background-color:var(--main);color:var(--main-bg);} .main-bg-2{background-color:var(--main-2);color:#FFF;} .main-bg-3{background-color:var(--main-3);color:#FFF;} .main-bg-4{background-color:var(--main-4);color:RGB(105,96,85);} .main-bg-5{background-color:var(--main-5);} .main-bg-lightred{background-color:var(--lightred);} .main-bg-lightblue{background-color:var(--lightblue);} article, aside, figure, figure img, figcaption, hgroup, footer, header, nav, section, video, object {display: block} a img {border: 0} img, object, embed {max-width: 100%;} b {font-weight:normal;text-transform:uppercase;} dl,ol,ul{margin:0;padding:0;} li{list-style-type:none;} .text ul{margin-bottom: 1.5rem;text-align: left;} .text li{list-style-type:disc;margin-left:1.5rem;} .loginForm li, .accordeon li, nav li{list-style-type:none;} .absolute, .row.absolute, .listview li .row.absolute{position:absolute;z-index:0;} .absolute.bottom{bottom:0;} .relative{position:relative;} .fixed{position:fixed;} select{-webkit-appearance:none;} .box-shadow{box-shadow:-.3rem .3rem 1rem .3rem var(--box-shadow-40prozent);} a{outline:none;} a:hover{} a, p a, .text li a, a.textlink{color:var(--a);text-decoration:none;} a:hover, p a:hover, .text li a:hover, a.textlink:hover{color:var(--main-2);text-decoration:underline;} li{position:relative;} .underlined{position:relative;border-bottom:1px solid var(--thin-line);} .article.addimg label, .lastrow div label, .underlined div label{margin-top:0;font-size:.8rem;margin-bottom:0;line-height:1;} div label.spez, .lastrow label, .underlined label{margin-top:.7rem;font-size:.8rem;margin-bottom:0;line-height:1;color: var(--label);} .lastrow .form-control, .underlined .form-control{padding-left:0;} .nopad{padding:0;} .on {display: inline-block;} .off {display: none;} .ansprache .scroll{overflow-y: auto;scrollbar-width: none;-ms-overflow-style: none;} .img-responsive{width:100%;height:auto;} .no-break{white-space:nowrap;} .floatRight{float:right;} .floatLeft{float:left;} .trusted-shop{position:absolute;width:5rem;height:5rem;transform: rotate(25deg);} legend{display:none;} .displayNone{display:none;} .clearfix:after {content: ".";display: block; height: 0;clear: both;visibility: hidden;} .clearfix {display: inline-block;} .clearfix[class] { /* ie6 hack */ display: block;overflow: hidden;} .row .cell{display:table;} .row .cell-content{display:table-cell;vertical-align:middle;} table{width: 100%;} td{vertical-align:top;} .nummer{text-align:right;} .bild, .bild img{height:auto} .ci{color:var(--ci);} .text.brand{font-size:inherit;display:inline;color:inherit;font-weight:bold;} .admin.oid{width: auto;position:absolute;left:0;top:0;border-radius:1rem;background:var(--error);color:var(--fa);padding:.2rem .2rem .1rem .2rem;font-size:.8rem;line-height: 1.3;} [type="button"],button{-webkit-appearance: none;} .fa:hover{color:inherit;} .btn-close{opacity:1;background:none;} .btn-close:hover{color:inherit;opacity:1;} .shadowbox.btn-close{color:red;position: absolute;right: .6rem;top: 0px;z-index:99999999;} .dates{font-size: 85%;padding: 0 0rem 1rem;color: var(--dates);overflow:hidden;} .dates div{padding-left:18px;} .dates div.h1{padding-left:0;} .dates div .fa{position:absolute;left:0px;} .ext-link{position:relative;padding-left:20px;margin-bottom:3rem;} .ext-link .fa{position:absolute;left:0px;} .dropdown, .dropup{height:0;} .hint{font-size:.8rem;} .text-align-right{text-align:right;} .textonly li{list-style-type:disc;margin-left:1.2rem;} .btn-cta{background:var(--main);color:var(--main-bg);text-transform:uppercase;float:right;margin-left:1rem;border-radius:0;text-decoration:none;} .ageverification .btn-cta{float:none;} .btn-cta:hover{background:var(--main-bg);color:var(--main);text-decoration:none;} #step2 .label, #step4b .label, #step4d .label{color:var(--main);} #step4 .fa{color:var(--main-bg-3);} .popup.buchungsanfrage .info {padding: 8.5rem 0 0 0rem;} .buchungsanfrage button{margin-bottom:5rem;} .buchungsanfrage .defaultfont{color:#fff;padding-bottom: 2rem;} .buchungsanfrage a{font-weight:bold;text-decoration:underline;} /* HERO -------------------------------------------------- */ .hero{/*background-image:url('/img/content/fotokarussel/IMG-1.jpg');*/animation-name:fadeIn;animation-duration:2s;animation-delay:0s;/*animation-iteration-count:1;*/animation-fill-mode:both;display:block;backface-visibility:visible !important;background-position: 50% 50%;background-repeat:no-repeat;background-size:cover;} .hero{left:0;background-size:contain;background-position:center center;background-size: 100% auto;} .hero .opacity{background:var(--hero-opacity);} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX PADDINGS & MARGINS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .row{--bs-gutter-x: 0;margin:0;} .col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto { padding-right: 0; padding-left:0; } .pad{padding:3rem 3rem 3rem 3rem;} .pad-l{padding-left:3rem;} .pad-t{padding-top:3rem;} .pad-r{padding-right:3rem;} .pad-b{padding-bottom:5rem;} .mar{padding:3rem 3rem 3rem 3rem;} .mar-l{margin-left:3rem;} .mar-t{margin-top:3rem;} .mar-r{margin-right:3rem;} .mar-b{margin-bottom:3rem;} .sidebar{padding-bottom:5rem;} .quote{padding:3rem 3rem 3rem 5rem;} @media (max-width: 575px) { .pad{padding:.6rem;} .pad-l{padding-left:.6rem;} .pad-t{padding-top:.6rem;} .pad-r{padding-right:.6rem;} .pad-b{padding-bottom:8rem;} .mar{margin:.6rem;} .mar-l{margin-left:.6rem;} .mar-t{margin-top:.6rem;} .mar-r{margin-right:.6rem;} .mar-b{margin-bottom:.6rem;} .container{padding-left:.6rem;padding-right:.6rem;} .popup .container{padding-left:0;padding-right:0;} .solo main .container{padding-left:0;padding-right:0;} .sidebar{padding-bottom:.6rem;} .quote{padding:.6rem .6rem .6rem 2rem;} .solo .listview .pad-l{padding-left:.6rem;} .solo .listview .pad-t{padding-top:.6rem;} .solo .listview .pad-r{padding-right:.6rem;} .solo .listview .pad-b{padding-bottom:.6rem;} .solo .listview .pad{padding:.6rem;} } @media (min-width: 576px) and (max-width: 767px) { .pad{padding:1.2rem;} .pad-l{padding-left:1.2rem;} .pad-t{padding-top:1.2rem;} .pad-r{padding-right:1.2rem;} .pad-b{padding-bottom:8rem;} .mar{margin:1.2rem;} .mar-l{margin-left:1.2rem;} .mar-t{margin-top:1.2rem;} .mar-r{margin-right:1.2rem;} .mar-b{margin-bottom:1.2rem;} .container{padding-left:1.2rem;padding-right:1.2rem;} .sidebar{padding-bottom:1.2rem;} .quote{padding:1.2rem 1.2rem 1.2rem 3.5rem;} .solo .listview .pad-l{padding-left:.6rem;} .solo .listview .pad-t{padding-top:.6rem;} .solo .listview .pad-r{padding-right:.6rem;} .solo .listview .pad-b{padding-bottom:8rem;} .solo .listview .pad{padding:.6rem;} } /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX GLOBALS XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ a {transition: all 0.2s ease-in 0s;-webkit-transition: all 0.2s ease-in 0s;text-decoration: none;} a {color:var(--main);} a:hover, a:focus, a:active{color:var(--main-3);text-decoration:none;} body {padding: 0;margin: 0;width: 100%;background: var(--main-bg);font-family: 'Quasimoda Reg', sans-serif;font-size:18px;line-height:1.5;color:var(--main);} h1 {display:none;} h2{font-size: 135%;font-weight:normal;font-family: 'Quasimoda Reg', sans-serif;word-wrap: break-word;margin-bottom:.8rem;} h5 {font-size: 32px;line-height: 51px;color: #fff;font-weight: 400;margin-top: 70px;} .text div{font-size:90%;text-align: justify;} #start {z-index: 2;} #rest{z-index: 1;position:relative;} .background{position:relative;z-index:0;overflow:hidden;} @media (max-width: 767px){ .background{overflow-y:auto;} } #footer{font-size:90%;} #footer a{color:#FFF;} #footer .table1{margin-top:-.5rem;} #footer .table1 td{vertical-align:middle;padding:.5rem} #footer .table1 td:nth-child(1){vertical-align:top;} #footer .table1 td:nth-child(2) img{width:5rem;} #footer .table1 td:nth-child(3) img{width:19rem;} #footer .table1 td:nth-child(4) img{width:19rem;} #footer .table2{margin-top:5rem;} #footer .table2 div:nth-child(1){padding-left:.3rem} #footer .table2 img{width:60px;margin-top:-7px;} #footer .table3{margin-top:1.5rem;} #footer .table3 img{width:50px;margin-top:-12.5px;} @media (max-width: 767px){ #footer {padding-bottom:3rem;} #footer .first, #footer .second, #footer .third, #footer .table2 {margin-top:2rem;} #footer .table1 td:nth-child(1), #footer .table2 div:nth-child(1){padding-left:0} } /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX SIDEBAR XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .sidebar .nav a{color:var(--main);} .sidebar{position:fixed;top:0;z-index:0;padding:2%;} #start .sidebar{position:absolute;z-index:1;padding:2%;} #rest .sidebar{z-index:3;} /* #start .sidebar .nav a{color:#fff;} */ .opener .nav .lang, .opener .navservice a, .opener .sidebar .nav a{color:var(--main-bg);} .video{position:relative;z-index:0;object-fit: cover;width: 100vw;height: 100vh;} .mutebutton{border:0;position:absolute;z-index:9;bottom: 3.1rem;right:3.1rem;width:2rem;height:2rem;background:#fff;border-radius:10rem;} .mute-video{background-image:url('/img/layout/mute.png');background-size:1.5rem;background-repeat:no-repeat;background-position:center center;} .unmute-video{background-image:url('/img/layout/unmute.svg');background-size:1.5rem;background-repeat:no-repeat;background-position:center center;} #start .logo{width:23%;height:auto;position:absolute;left:50%;margin-left:-16.5%;top:25%;} img.logo {width: 100%;height:auto;margin: 5rem 0 3rem;} img.brand{position:relative;width:50%;margin-left:3px} .navservice{position:fixed;bottom:0;padding-bottom:3rem;font-size:14px;} #start .navservice{position:absolute;padding:2%;padding-bottom:1rem;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX NAV XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .navmenu .nav li, .nav{font-size:110%;z-index:2;} .nav .fa-bars{padding:6px 2px 2px 5px;} .nav .lang.chosen{display:inline-block;cursor:pointer;} .nav .lang{display:none;border:0;padding:2px 5px 2px 2px;position: relative;border:0;text-transform:uppercase;} .navmenu{display:none;position:fixed;z-index:3;top:0;left:0;background:var(--main-bg);padding-top:10rem;} .navmenu .btn-close{position:absolute;z-index:1;right:30px;top:30px;cursor:pointer;width:35px;height:auto;} .navmenu li{text-align:center;font-size:130%;text-transform:uppercase;} .navmenu .lang li{text-align:left;} .navmenu a{display:inline-block;} .navmenu .title{font-size:150%;margin-top:2rem;} @media (max-height: 575px) { .navmenu{padding-top:5rem;} } .absolute .next-relative, .next-horizontal, .back-horizontal {width: 100px;height: 100px;cursor: pointer;border-radius:10rem;background:rgba(255,255,255,1);display:inline-block;text-align: center;} .absolute .next-relative{bottom: 2.5rem;left: 50%;margin-left: -50px;position: relative;font-size:30px;z-index:0;} #start .next-relative{text-align:center;padding-right:0;} .next-horizontal, .back-horizontal {top:50%;margin-top:-50px;position: absolute;font-size:30px;} .next-horizontal {z-index:1;right: -4rem;left: auto;} .back-horizontal {z-index:1;right: auto;left: -4rem;} .next-relative .fa{position: absolute;top:10px;left:42px;} .next-horizontal .fa{position: absolute;top:35px;right:68px;} .back-horizontal .fa{position: absolute;top:35px;left:70px;} a.next-relative, a.next-horizontal, a.back-horizontal{color:var(--main);} a.next-relative:hover, a.next-horizontal:hover, a.back-horizontal:hover{color:var(--main-4);} .absolute .next-relative{display:none;} .opener .absolute .next-relative{display:inline-block;} @media (max-width: 767px){ .absolute .next-relative {display:none;} .next-horizontal, .back-horizontal {top:auto;bottom:3rem;margin-top:-50px;} .next-horizontal{z-index:3;} } /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX POPUP XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ html.popup, .popup body{background:var(--main-bg);} .popup .info{padding:8.5rem 0;} .popup .logo img{margin-top:7rem;} .popup table{border:1px solid var(--main);width:100%;} .popup table tr:nth-child(1) td{background:var(--main);color:#FFF;} .popup table td{border-top:1px solid var(--main);border-right:1px solid var(--main);padding:.3rem;vertical-align:middle;} .popup table p{text-align:left;} .ageverification, .ageverification main{background:var(--main);color:#FFF;text-transform:uppercase;} .ageverification .navservice a{text-transform:none;color:#fff;} .ageverification img{width:50%;margin-top:30%;margin-bottom:5rem;} .ageverification .btn-cta{margin-top:1rem;font-size:100%;background:var(--main-bg);color:var(--main);border-radius:10rem;width:4.1rem;height:4.1rem;-webkit-appearance: button;vertical-align: middle;} .ageverification a.btn-cta{padding:1.1rem 0 0 0rem;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .label{position: absolute;z-index: 9;top: 1.8rem ;text-transform:uppercase;color:#fff;font-size:110%;} #step4 .label, #step4c .label{color:RGB(105,96,85);} .label-weine{position: absolute;z-index:1;top: 1.7rem ;right:0;font-size:90%;width:auto;font-weight:bold;} .label-weine.brand{width:13%;} .content-a {display: table;width: 100%;height: 100vh;table-layout: fixed;overflow: hidden;} .text li p{margin-bottom:.4rem;} .content-b {position:absolute;bottom:0;overflow:auto;} @media (max-width: 767px){ .content-b {padding-top:11rem;} #start .content-b {padding-top:0;} } #step2 .content-b, #step4 .content-b, #step4b .content-b, #step4c .content-b .text, #step6 .content-b .text, #step6a .content-b .text, #step8 .content-b .text, #step8a .content-b .text{height:100%;padding-top:11rem;} #step4c .spacer-p{display:none;} #step4c .content-b .text{padding-top:3rem;margin-top:3rem;} #step4d .content-b .text{height:100%;padding-top:6rem;} #step4d .content-b {bottom:auto;} #step6 .content-b .text{padding-left:1rem;padding-right:1rem;margin-right: 4%; margin-top: 2rem; padding: 1rem;} #step6a .content-b .text{padding-left:6rem;padding-right:6rem;} #step6b span.brand, #step6c span.brand{border-bottom:3px solid var(--lightred);} .weine .content-b{padding-top:6rem;} .weine h2{margin-bottom:-5px;} .weine #step9 h2{margin-bottom:.8rem;} .weine .text{margin-top:5rem;} .weine a:hover{color:inherit;} #step3 .content{background:var(--main-4);} #step7 .content-b{bottom:auto;} #step7 .text{margin-right:4%;margin-top:2rem;padding:1rem;} #step7 .pad{} #step7a .areablanco{display:none;} #step9 .text{margin-bottom:17%;margin-right:6%;padding:1rem;} #step9c .text{color:var(--main);} #step9c .label, #step9d .label, #step9e .label, #step9f .label{color:var(--main);} #step4 {background-position:60% 100%!important;} #step4d td{padding:0 1rem 1rem 0;} #step11 .content-b{position:relative;} #step11 .content-b .text {padding-left: 6rem;padding-right: 6rem;padding-top: 6rem;z-index: 2;} #step11 .carousel{overflow:hidden;} #step11 .carousel .back-horizontal{} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX PARZELLEN XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ #image-map{width:100%;height:100%;z-index:1;position: relative;display: inline-block;} #step7a{top:0;bottom:auto;} #step7 .absolute{bottom:-6.9rem;} #img-parzellen{position:relative;z-index:0;background-size:cover;} area:hover{background:#FFF;fill:#FFF;} .maparea:hover{background:#000;border:1px solid red;} .areatext{bottom:0;right:0;} .areablanco{display:none;} #Kohlplatz-text.areatext, #Orchideen-Wiese-text.areatext, #Untere-Leit-text.areatext{left:0;bottom:0;} .areatext, .areaimg{display:none;position:absolute;z-index:1;cursor:pointer;} .areatext{width:30%;padding:2rem;font-size:90%;text-align:justify;} .areatext h2{text-transform:uppercase;} /* #Plaesl-img{top:199px;left:57px;} */ #Neuanlage-img{top:453.5px;left:104px;} #Beim-Huettl-img{top:555px;left:281px;} #Kohlplatz-img{top:630px;left:709px;} #Untere-Leit-img{top:400px;left:406.5px;} #Orchideen-Wiese-img{top:407px;left:802px;} #Grosse-Leit-img{top:362.5px;left:371.5px;} #Kelleracker-img{top:249.5px;left:383.5px;} #Ziggelwiese-img{top:168.5px;left:284px;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX Media ???? XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ .media {display: inline-block;float: none;max-width: 540px;text-align: justify;width: 100%;margin-top: 40px;box-sizing: border-box;padding: 0 40px;} .media a {display: inline-block;vertical-align: middle;text-align: center;width: 33.33%;float: left;} .media:after {content: "";display: inline-block;width: 100%;} .media span {display: block;font-size: 28px;line-height: 30px;font-weight: 300;color: #fff;text-transform: uppercase;margin-top: 25px;} .media a:hover span {color: #0b9545;} /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXX FIX SCREENS upto 575px XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ /* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */ @media (max-width: 575px) { html, body{overflow-x:hidden;} .mutebutton{bottom: 5rem;right:2%;} #start .logo{width:40%;} #start .navservice{right:1%;bottom:auto;top:0;padding:0;display:inline-block;position:relative;width:100%;text-align: right;} .nav{float:right !important;} .nav .lang li{float:right;padding-left: .5rem;} .d-flex{display:inherit !important;} .next-horizontal, .back-horizontal{display:none;} .label{top:.5rem;} h2{margin-top:1rem;} .content-a{height:auto !important;} .popup table.recycle_me{font-size:75%;} #start {overflow:hidden;} #start .sidebar{position:fixed;right:0;} #step2 .content-b{padding-top:0;} #step2 .content-b, #step3 .content-b, #step4 .content-b{position:relative;} #step3 .content-b{background:var(--main-4);padding-top:7rem;} #step2 .content-b .bild{padding-right:0;} #step2 .content-b .text, #step4 .content-b .text{padding-right:.6rem;padding-top:.6rem;} #step4 .content-b{padding-top:0;} #step4 .label, #step4a .label, #step4b .label, #step4c .label{color:#fff;} #step4a .content-b {position:relative;padding-top:0;} #step4b .content-b {position:relative;padding-top:0;} #step4c .content-b {position:relative;padding-top:0;} #step4c .content-b .text {margin-top:.6rem;padding-top:0;} #step4d .content-b{position:relative;padding-top:0;} #step4d .content-b .text{padding:.6rem;} #step4d td:nth-child(2){padding-right:0;} #step5 {padding-top:7rem;background-color:var(--main-3);} #step5 .hero, #step5 .content-b {position:relative;padding-top:0;} #step6 .content-b, #step6a .content-b, #step6b .content-b, #step6c .content-b{position:relative;padding-top:0;} #step6a .label{color:var(--main-2);} #step6a .content-b .label{display:none;} #step6 .content-b .text, #step6a .content-b .text {padding: .6rem;} #step6 .content-b .text, #step6a .content-b .text #step6b .content-b .text, #step6c .content-b .text{padding:.6rem .6rem} .parzellen{background:var(--main-2);} #step7a{padding-top:7rem;} #step7a .label{top:0;padding-top:3rem;padding-bottom:1.5rem;padding-right:3rem;background:var(--main-2);width:100%;} #step7 .content-b, #step7a .content-b{position:relative;padding-top:0;} #step7 .text {margin: 0;padding: .6rem;} #step7a{background:var(--main-3);background-image:none;} #step7a .areatext{position:relative;padding:.6rem;width:100%;min-height:25rem;} #step7a .areablanco{min-height:25rem;display:block;position:relative;z-index:0;} #step8 .content-b, #step8a .content-b{position:relative;padding-top:0;} #step8 .content-b .text, #step8a .content-b .text{padding:.6rem;} #step8 .d-block.d-sm-none.label, #step8a .d-block.d-sm-none.label{position:relative;font-size:110%;color:var(--main-2);top:0;padding-bottom:2rem;} #step10 .hero-impressionen{background-size:auto 100%;} #step11 .content-b{padding-top:6rem;} #step11 .content-b .text {padding-left: .6rem;padding-right: .6rem;} .kontaktForm{padding-bottom:5rem;} .buchungsanfrage button {margin-bottom: 0;} .weine .content-b{position:relative;padding:0;} .weine .content-b .bild{padding-top:7rem;} .weine #step9 .content-b .bild{padding-top:0;} .weine .content-a{height:inherit;} #step9 .text {position:relative;margin:0;padding: .6rem;} #footer .table3{display:none;} .spacer-p{display:none;} .label-weine.brand{width: 20%;top:5rem;} } /* CAPTCHA -------------------------------------------------- */ .captcha{margin-top:1.5rem;} .captcha img{color:#AAA;border: 3px solid #AAA;background:#AAA;border-radius:0rem;} /* FORMS FORM-CONTROL -------------------------------------------------- */ form label{cursor:pointer;font-size:.9rem;} form label.error{position:absolute;z-index:1;top:.1rem;left:0;margin:0;color:var(--error);background:var(--main-4);font-size: .8rem;font-style: italic;} form .checkbox label.error{margin-left:1rem;} .form-control{border-radius:0;} /* form select, .form-control, .text.form-control{color: var(--input);background-color: var(--input-bg);border:1px solid var(--input-border);outline: 0;box-shadow:none;transition:none;} form select.active, .form-control.active, .text.form-control.active{color: var(--fa);background-color: var(--input-bg-val);} form select:focus, .form-control:focus, .text.form-control:focus{color: var(--input-h);background-color: var(--input-bg-h);border-color: var(--input-border-h);outline: 0;box-shadow:none;transition:none;} form select.valid, .form-control.valid{color: var(--input-val);border-color: var(--input-border-val);background:var(--input-bg-val);} .form-control.valid:focus{border-color: var(--input-border-val-h);background:var(--input-bg-val-h);} form select.error, .form-control.error{color:var(--dates);background:var(--input-bg-err);border-color:var(--input-border-err);} .form-control.error:focus{background:var(--input-bg-err-h);border-color:var(--input-border-err-h)} select.form-control{width:50%;} form select.inactive, .form-control.inactive{background:transparent;color:var(--placeholder);;border: 1px solid var(--input-border);} form input.radio{float:left;margin-right:7px;} */ @-webkit-keyframes empty { 0% { opacity: 1 } } @-moz-keyframes empty { 0% { opacity: 1 } } @keyframes empty { 0% { opacity: 1 } } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes backSlideOut { 25% { opacity: .5; -webkit-transform: translateZ(-500px); } 75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } } @-moz-keyframes backSlideOut { 25% { opacity: .5; -moz-transform: translateZ(-500px); } 75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } } @keyframes backSlideOut { 25% { opacity: .5; transform: translateZ(-500px); } 75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } } @-webkit-keyframes backSlideIn { 0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -webkit-transform: translateZ(-500px); } 100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); } } @-moz-keyframes backSlideIn { 0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -moz-transform: translateZ(-500px); } 100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); } } @keyframes backSlideIn { 0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; transform: translateZ(-500px); } 100% { opacity: 1; transform: translateZ(0) translateX(0); } } @-webkit-keyframes scaleToFade { to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleToFade { to { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleToFade { to { opacity: 0; transform: scale(.8); } } @-webkit-keyframes goDown { from { -webkit-transform: translateY(-100%); } } @-moz-keyframes goDown { from { -moz-transform: translateY(-100%); } } @keyframes goDown { from { transform: translateY(-100%); } } @-webkit-keyframes scaleUpFrom { from { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpFrom { from { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpFrom { from { opacity: 0; transform: scale(1.5); } } @-webkit-keyframes scaleUpTo { to { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpTo { to { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpTo { to { opacity: 0; transform: scale(1.5); } }