body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both} @media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%} header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px} .mobile_menu{position:fixed;z-index:100;display:none}.mobile_menu .inner{height:100%;background:#000;overflow-y:scroll}.mobile_menu.active.position_left{box-shadow:2px 0 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_top{box-shadow:0 2px 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_right{box-shadow:-2px 0 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.position_bottom{box-shadow:0 -2px 5px 0 rgba(0,0,0,.5)}.mobile_menu.active.no_shadow{box-shadow:none!important}.mobile_menu_trigger{display:none}.mobile_menu_wrapper{position:relative;width:100%;overflow:hidden}.mobile_menu_overlay{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:99}.mobile_menu_overlay.background{background:rgba(0,0,0,.5)}.mobile_menu li.submenu_hide>ul{display:none}.mobile_menu li.submenu_show>ul{display:block}body.ie8 .mobile_menu,body.ie8 .mobile_menu_trigger,body.ie9 .mobile_menu,body.ie9 .mobile_menu_trigger{display:none!important} .sharebuttons { overflow:hidden; } .sharebuttons > ul.theme { list-style-type:none; margin:-4px; padding:0; } .sharebuttons > ul.theme:after { content:""; display:block; clear:both; } .sharebuttons > ul.theme > li { float:left; } .sharebuttons > ul.theme > li > a { margin:4px; display:block; white-space:nowrap; overflow:hidden; text-indent:101%; background-repeat:no-repeat; background-position:center; } .sharebuttons > ul.text > li > a { text-indent:0; } /* source: http://simplesharingbuttons.com/ */ .sharebuttons > ul.simpleflat > li > a { width:32px; height:32px; background-image:url('../../system/modules/sharebuttons/assets/simpleflat/sprites-32.png'); } .sharebuttons > ul.simpleflat > li > a.facebook { background-position:-40px 0; } .sharebuttons > ul.simpleflat > li > a.twitter { background-position:-160px 0; } .sharebuttons > ul.simpleflat > li > a.gplus { background-position:-80px 0; } .sharebuttons > ul.simpleflat > li > a.linkedin { background-position:-120px 0; } .sharebuttons > ul.simpleflat > li > a.xing { background-position:-200px 0; } .sharebuttons > ul.simpleflat > li > a.mail { background-position:0 0; } .sharebuttons > ul.simpleflat > li > a.tumblr { background-position:-240px 0; } .sharebuttons > ul.simpleflat > li > a.pinterest { background-position:-280px 0; } .sharebuttons > ul.simpleflat > li > a.reddit { background-position:-320px 0; } .sharebuttons > ul.simpleflat > li > a.whatsapp { background-position:-360px 0; } @media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 13/10), only screen and (min-resolution: 120dpi) { .sharebuttons > ul.simpleflat > li > a { background-size:auto 32px; background-image:url('../../system/modules/sharebuttons/assets/simpleflat/sprites-64.png'); } } .cc-head>*:first-child{margin-top:0}.cc-head>*:last-child{margin-bottom:15px}.contao-cookiebar{--ccb-backdrop: rgba(0, 0, 0, .75);--ccb-anim-duration: .5s;--ccb-checked-clr: #399d32;--ccb-checked-bg: #dcf3db;--ccb-unchecked-clr: #9c9b99;--ccb-unchecked-bg: #fff;--ccb-disabled-clr: #c8c7c5;--ccb-disabled-bg: #f4f4f4;--ccb-focus-clr: #00a4f4;position:fixed;inset:0;z-index:9999;display:flex;align-items:var(--ccb-align, center);justify-content:var(--ccb-justify, center);letter-spacing:0;padding:15px;max-height:100dvh;box-sizing:border-box;pointer-events:none;overflow:hidden;color:var(--ccb-clr, #444)}.contao-cookiebar *{box-sizing:border-box}.contao-cookiebar p{color:var(--ccb-text, #868686);line-height:1.4}.contao-cookiebar label{position:relative;display:block;padding:8px 13px 8px 0;line-height:1.2rem}.contao-cookiebar label.group{font-weight:600}.contao-cookiebar input{position:absolute;width:1px;height:1px;outline:0 none;opacity:0}.contao-cookiebar input+label{padding:8px 13px 8px 45px;cursor:pointer}.contao-cookiebar input+label:before,.contao-cookiebar input+label:after{content:"";position:absolute;border-radius:10px}.contao-cookiebar input+label:before{top:7px;left:0;width:35px;height:18px;margin:0;box-sizing:content-box;background:var(--ccb-unchecked-bg);border:1px solid var(--ccb-unchecked-clr);transition:border-color .2s}.contao-cookiebar input+label:after{display:block;top:11px;left:4px;width:12px;height:12px;background:var(--ccb-unchecked-clr);transition:background .2s,margin-left .2s,padding .2s}.contao-cookiebar input+label:active:after{padding-left:5px}.contao-cookiebar input.cc-group-half+label:after{background:linear-gradient(to right, var(--ccb-unchecked-clr) 0%, var(--ccb-unchecked-clr) 50%, var(--ccb-checked-clr) 50%, var(--ccb-checked-clr) 100%)}.contao-cookiebar input:checked+label:after{background:var(--ccb-checked-clr);margin-left:17px}.contao-cookiebar input:checked+label:active:after{margin-left:12px}.contao-cookiebar input:checked+label:before{background:var(--ccb-checked-bg);border-color:var(--ccb-checked-clr)}.contao-cookiebar input:disabled+label{pointer-events:none}.contao-cookiebar input:disabled+label:after{background:var(--ccb-disabled-clr)}.contao-cookiebar input:disabled+label:before{background:var(--ccb-disabled-bg);border-color:var(--ccb-disabled-clr)}.contao-cookiebar input:focus-visible:not(.cc-hide-focus)+label:before{outline:3px dashed var(--ccb-focus-clr);outline-offset:2px}.contao-cookiebar .cc-btn{display:inline-block;cursor:pointer;width:100%;padding:8px 14px;margin-bottom:8px;font-size:15px;outline:0 none;border:1px solid var(--ccb-btn-bdr, #cfcfcf);border-radius:4px;color:var(--ccb-btn-clr, #444);background:var(--ccb-btn-bg, #f5f5f5)}.contao-cookiebar .cc-btn:hover,.contao-cookiebar .cc-btn:focus{background:var(--ccb-btn-bg-hvr, #ececec)}.contao-cookiebar .cc-btn:last-child{margin-bottom:0}.contao-cookiebar .grayscale{--ccb-btn-bg: #f1efef;--ccb-btn-bg-hvr: #ececec}.contao-cookiebar .grayscale .success{--ccb-btn-bg: #fbfbfb;--ccb-btn-bg-hvr: #f7f7f7}.contao-cookiebar .highlight .success{--ccb-btn-bg: #4e9e3e;--ccb-btn-bg-hvr: #4c933f;--ccb-btn-bdr: #3e7830;--ccb-btn-clr: #fff}.cc-focus:not(.cc-hide-focus):focus-visible{outline:3px dashed var(--ccb-focus-clr);outline-offset:-3px}.cc-invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;float:left}.cc-inner{display:inline-block;overflow-y:auto;max-height:100%;max-width:100%;padding:23px;border-radius:3px;opacity:0;pointer-events:none;visibility:hidden;font-size:1rem;text-align:left;background:var(--ccb-bg, #fff);box-shadow:var(--ccb-box-shadow, rgba(99, 99, 99, 0.2)) 0 2px 8px 0;animation:var(--ccb-anim, cookiebar-middle-in) var(--ccb-anim-duration) ease-in-out forwards}.cc-group{position:relative;border:1px solid var(--ccb-bdr, #d0d0d0);border-radius:5px;margin-bottom:10px}.cc-cookie-info{font-size:.875rem;background:var(--ccb-info-bg, #fff);border:1px solid var(--ccb-info-bdr, #efefef);padding:10px;border-radius:5px}.cc-cookie-info>div>span{font-weight:600}.cc-cookie-info>div+div{margin-top:5px;word-wrap:break-word}.cc-cookie-info+button.cc-detail-btn-details{margin-top:15px}.cc-cookies{background:var(--ccb-cookies-bg, #fbfbfb);border-radius:0 0 5px 5px}.cc-cookies>p{font-size:.875rem}.cc-cookies>p,.cc-cookies>.cc-cookie{margin:0;padding:15px;border-top:1px solid var(--ccb-cookies-bdr, #fbfbfb)}.cc-cookie label.cookie+*{margin-top:10px}.cc-cookie p{margin:0 0 15px;font-size:.875rem}.cc-cookie-desc p{margin-bottom:0}.cc-footer,.cc-info{text-align:center}.cc-info{margin-top:15px}.cc-info>p{font-size:.875rem}.cc-info>a{display:inline-block;font-size:.813rem;color:var(--ccb-detail-clr, #a2a2a2);text-decoration:none}.cc-info>a:hover{color:var(--ccb-detail-clr-hvr, #717171)}.cc-info>a+a:before{display:inline-block;content:"·";margin-right:5px}.cc-active .cc-inner{opacity:1;pointer-events:auto;visibility:visible}.cc-active.cc-blocked{pointer-events:auto;animation:cookiebar-overlay-in var(--ccb-anim-duration) ease-in-out forwards}.cc-saved.cc-inner{opacity:0;pointer-events:none;visibility:hidden}.cc-saved.cc-blocked{pointer-events:none;animation:cookiebar-overlay-out var(--ccb-anim-duration) ease-in-out forwards}.cc-left{--ccb-justify: flex-start}.cc-right{--ccb-justify: flex-end}.cc-top{--ccb-align: flex-start}.cc-top.cc-active{--ccb-anim: cookiebar-top-in}.cc-top.cc-saved{--ccb-anim: cookiebar-top-out}.cc-middle.cc-active{--ccb-anim: cookiebar-middle-in}.cc-middle.cc-saved{--ccb-anim: cookiebar-middle-out}.cc-bottom{--ccb-align: flex-end}.cc-bottom.cc-active{--ccb-anim: cookiebar-bottom-in}.cc-bottom.cc-saved{--ccb-anim: cookiebar-bottom-out}@media(min-width: 768px){.contao-cookiebar .cc-btn{width:auto;margin-bottom:0}.cc-inner{max-width:var(--ccb-max-width, 750px)}}@media(forced-colors){.contao-cookiebar input+label:after{border:1px solid currentColor}.cc-inner{border:1px solid currentColor}input.cc-group-half+label:after{margin-left:9px}}@media(prefers-reduced-motion){.contao-cookiebar{--ccb-anim-duration: 2s}}@media print{.contao-cookiebar{opacity:0}}@keyframes cookiebar-overlay-in{0%{background:rgba(0,0,0,0)}to{background:var(--ccb-backdrop)}}@keyframes cookiebar-overlay-out{0%{background:var(--ccb-backdrop)}to{background:rgba(0,0,0,0);visibility:hidden}}@keyframes cookiebar-top-in{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-top-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(-100%)}}@keyframes cookiebar-middle-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes cookiebar-middle-out{0%{opacity:1;visibility:visible;transform:scale(1)}to{opacity:0;visibility:hidden;transform:scale(0)}}@keyframes cookiebar-bottom-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-bottom-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(100%)}}.cc-group{display:flex;flex-wrap:wrap;justify-content:space-between;align-content:center}.cc-group>label{flex-grow:1;margin:5px 0 5px 10px}.cc-cookies{display:none;width:100%}.cc-detail-btn{padding:8px 10px;line-height:1.2rem}.cc-detail-btn-details{text-decoration:underline;padding:0;margin:0 0 10px}.cc-detail-btn,.cc-detail-btn-details{display:inline-block;color:var(--ccb-detail-clr, #a2a2a2);border:0 none;outline:0 none;background:rgba(0,0,0,0);font-size:13px;letter-spacing:0;text-transform:initial;cursor:pointer}.cc-detail-btn span:nth-child(2),.cc-detail-btn-details span:nth-child(2){display:none}.cc-detail-btn.cc-active span:nth-child(1),.cc-detail-btn-details.cc-active span:nth-child(1){display:none}.cc-detail-btn.cc-active span:nth-child(2),.cc-detail-btn-details.cc-active span:nth-child(2){display:inline}.cc-detail-btn:hover,.cc-detail-btn-details:hover{background:rgba(0,0,0,0);color:var(--ccb-detail-clr-hvr, #717171)} #colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center} table.sortable thead th{background-image:url(../../assets/tablesorter/images/default.svg);background-repeat:no-repeat;background-position:center right}table.sortable thead th.tablesorter-headerAsc{background-image:url(../../assets/tablesorter/images/asc.svg)}table.sortable thead th.tablesorter-headerDesc{background-image:url(../../assets/tablesorter/images/desc.svg)} .content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666} /* highsummit - manual */ @font-face { font-family: 'HighSummit'; font-style: normal; font-weight: 400; font-display: swap; src: local(''), url('/webfonts/highsummit.otf') format('opentype'), url('/webfonts/highsummit.ttf') format('truetype'); /* Safari, Android, iOS */ } /* baskervville-regular - latin */ @font-face { font-family: 'Baskervville'; font-style: normal; font-weight: 400; font-display: swap; src: url('/webfonts/baskervville-v5-latin-regular.eot'); /* IE9 Compat Modes */ src: local(''), url('/webfonts/baskervville-v5-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/webfonts/baskervville-v5-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */ url('/webfonts/baskervville-v5-latin-regular.woff') format('woff'), /* Modern Browsers */ url('/webfonts/baskervville-v5-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */ url('/webfonts/baskervville-v5-latin-regular.svg#Baskervville') format('svg'); /* Legacy iOS */ } /* baskervville-italic - latin */ @font-face { font-family: 'Baskervville'; font-style: italic; font-weight: 400; font-display: swap; src: url('/webfonts/baskervville-v5-latin-italic.eot'); /* IE9 Compat Modes */ src: local(''), url('/webfonts/baskervville-v5-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('/webfonts/baskervville-v5-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */ url('/webfonts/baskervville-v5-latin-italic.woff') format('woff'), /* Modern Browsers */ url('/webfonts/baskervville-v5-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */ url('/webfonts/baskervville-v5-latin-italic.svg#Baskervville') format('svg'); /* Legacy iOS */ } @font-face { font-style: normal; font-weight: 300; font-family: 'myriad-pro'; font-display: swap; src: url('/webfonts/myriadpro/font-light.woff2') format('woff2'), url('/webfonts/myriadpro/font-light.woff') format('woff'); } @font-face { font-style: normal; font-weight: 400; font-family: 'myriad-pro'; font-display: swap; src: url('/webfonts/myriadpro/font-regular.woff2') format('woff2'), url('/webfonts/myriadpro/font-regular.woff') format('woff'); } /* @font-face { font-style: normal; font-weight: 400; font-family: 'brandon-grotesque'; font-display: swap; src: url('/webfonts/brandongrotesque/font-regular.woff2') format('woff2'), url('/webfonts/brandongrotesque/font-regular.woff') format('woff'); } @font-face { font-style: normal; font-weight: 500; font-family: 'brandon-grotesque'; font-display: swap; src: url('/webfonts/brandongrotesque/font-medium.woff2') format('woff2'), url('/webfonts/brandongrotesque/font-medium.woff') format('woff'); } @font-face { font-style: normal; font-weight: 700; font-family: 'brandon-grotesque'; font-display: swap; src: url('/webfonts/brandongrotesque/font-bold.woff2') format('woff2'), url('/webfonts/brandongrotesque/font-bold.woff') format('woff'); } @font-face { font-style: normal; font-weight: 800; font-family: 'brandon-grotesque'; font-display: swap; src: url('/webfonts/brandongrotesque/font-black.woff2') format('woff2'), url('/webfonts/brandongrotesque/font-black.woff') format('woff'); } */ /* ****************************************************************************************************************** */ /* --- Variablen ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ :root { --ka-bk-color:#FFF; --ka-bk-lightbrown:#fef5f0; --ka-bk-brown:#dcc6b9; --ka-bk-darkbrown:#9a5b30; --ka-bk-lightbrown2:#fff8f3; --ka-bk-lightgreen:#dfe9ce; --ka-bk-green:#ced8b5; --ka-acc-goldgelb: #FFD94C; /* lebhaftes Goldgelb (aktiv) */ --ka-acc-maisgelb: #F9D147; /* helles Maisgelb */ --ka-acc-safrangelb: #E2BF4B; /* kräftiges Safrangelb */ --ka-acc-sandbeige: #DBC397; /* sanftes Sandbeige */ --ka-acc-rosebeige: #D7C1B2; /* zartes Rosébeige */ --ka-bk-darkgrey:#323234; --ka-font-color:#323233; --ka-font-size:15px; --ka-line-height:24px; --ka-font-family: myriad-pro, sans-serif; --ka-font-script: HighSummit, arial; --ka-font-family-menu: "brandon-grotesque", Arial, sans-serif; --ka-font-family-bg: "brandon-grotesque", Arial, sans-serif; --ka-font-family-basker:Baskervville,Arial; --ka-fonthx-color:#323233; --ka-font-color-brown:#A17255; --ka-font-color-orange:#974824; --ka-font-color-script:#bb5629; --ka-fontbtn-size:14px; --ka-linebtn-height:30px; --ka-font-color-light:#7f7f7f; --ka-bk-boxgrey:#EFEFEE; --ka-bk-boxlightgrey:#F1F1F1; --ka-bk-boxmiddlegrey:#D6D1CA; --ka-nav-color:#fff; --ka-footer-color:#fff; --ka-footer-bk-dark:#323233; --ka-footer-bk-middle:#7C7C7C; --ka-footer-bk-light:#F2F2F2; --ka-statement-font-size:60px; --ka-statement-line-height:65px; --ka-statement-letter-spacing:0.0em; --ka-desktopwidth:1600px; --ka-footerwidth:1600px; --ka-book-past: #afafaf; --ka-book-bknow: #efefef; --ka-book-bkfu: #efefef; --ka-book-bkbook: #cbcbcb; } /* ****************************************************************************************************************** */ /* --- Basics ------------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ html { scroll-behavior: smooth; } body { background-color:var(--ka-bk-color); margin: 0; padding: 0; font-family:var(--ka-font-family); font-size:var(--ka-font-size); line-height:var(--ka-line-height); font-weight: 300; letter-spacing:0.05em; color:var(--ka-font-color); } #wrapper { width:100%; min-height:200px; margin: 0; padding: 0; } #container { width:100%; margin: 0; padding: 100px 0 0 0; } #main { min-height: 200px; margin-bottom: 0; } #main { /*text-align: center;*/ } ul { padding-top:4px; padding-left:17px; } li { margin-bottom:4px; padding-left:2px; list-style-type:none; } .mod_article li { list-style-type:disc; } /* #main .mod_article li:marker { list-style-type:disc; } /* #main .mod_article li::before { content: "•"; color: #b2c900; display: inline-block; width: 1em; margin-left: -1em; } */ pre, form { margin:0; padding:0; } p { margin-top:0px; margin-bottom:0px; } h1, h2, h3, h4, h5, h6, #main h2 a.telh2, #main h3 a.telh3 { font-family:Baskervville,Arial; color:var(--ka-fonthx-color); } h1 { margin-top:10px; margin-bottom:5px; white-space: normal; font-size:45px; line-height:60px; font-weight:400; letter-spacing: 0.025em; text-transform:uppercase; } h2, #main h2 a.telh2 { margin-top:5px; font-size:30px; line-height:42px; font-weight:400; letter-spacing: 0.05em; text-transform:uppercase; } h3, #main h3 a.telh3 { margin:15px 0 5px 0; font-size:20px; line-height:24px; font-family: var(--ka-font-family-menu); font-weight:500; letter-spacing: 0.07em; text-transform:uppercase; } #main h2 a.telh2, #main h3 a.telh3 { border: none; background-color: inherit; } #main h2 a.telh2:hover, #main h3 a.telh3:hover { border: none; color: inherit; background-color: inherit; } h4 { margin-top:35px; font-size:20px; line-height:28px; font-weight:400; letter-spacing: 0.055em; text-transform:uppercase; font-family: var(--ka-font-family-basker); /*font-style: italic;*/ } h5 { margin-top:35px; font-size:20px; line-height:30px; font-weight:400; letter-spacing:0em; font-family: var(--ka-font-family-basker); font-style: italic; } h6 { margin:15px 0 5px 0; /* font-size:32px; line-height:40px; font-family: Rollerscript-Smooth, Arial; color:#000000; letter-spacing: 0em; */ font-size:22px; line-height:28px; font-weight:600; font-family: var(--ka-font-family-basker); letter-spacing: 0.02em; text-transform:none; } .script { font-family: var(--ka-font-script); color: var(--ka-font-color-script); text-transform: none; font-size: 28px; line-height: 34px; letter-spacing: 0; } .script.bigtext { font-size: 48px; line-height: 60px; } optgroup { padding-top:3px; padding-bottom:3px; } a { text-decoration:none; color:var(--ka-font-color); padding-bottom: 2px; font-weight: 600; letter-spacing: 0.1em; } #main a { text-transform:uppercase; border-bottom: 1px solid var(--ka-font-color); } #main a.noborder { border-bottom-style: none; /*border-bottom: 0px solid #000000;*/ } a:hover { /* text-decoration:none; border-bottom: 1px solid var(--ka-font-color); */ } table { margin-top:10px; } table thead { border-bottom:1px solid #9e9e9e; } td { padding:3px; } /* .ce_image .image_container img { width:100%; height:100%; object-fit: cover; } */ .content-gallery > ul li.col_first, .ce_gallery > ul li.col_first { clear:none; } .content-gallery .flex-images a, .ce_gallery .flex-images a { float:left; margin-right:0px; margin-bottom:20px; width:calc(33% - 10px); } .content-gallery ul, .ce_gallery ul { display: grid; grid-column-gap: 20px; grid-row-gap: 20px; list-style-type: none; } .content-gallery ul li, .ce_gallery ul li { padding: 0; margin: 0; width: 100%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery ul li figure, .ce_gallery ul li .image_container { overflow: hidden; line-height: 1px; } .content-gallery ul li figure a, .ce_gallery ul li .image_container a { font-size: 1px !important; line-height: 1px !important; padding:0 !important; border-bottom:none !important; } .content-gallery ul li figure img, .ce_gallery ul li .image_container img { transform: scale(1.0, 1.0); -ms-transform: scale(1.0, 1.0); -webkit-transform: scale(1.0, 1.0); transition: all .75s ease-in-out; } .content-gallery.cover ul li figure img, .ce_gallery.cover ul li .image_container img { width:100%; height:100%; object-fit: cover; display: inline-block; } .content-gallery ul li figure img:hover, .ce_gallery ul li .image_container img:hover { transform: scale(1.05, 1.05); -ms-transform: scale(1.05, 1.05); -webkit-transform: scale(1.05, 1.05); } .content-gallery.content-gallery--cols-2 ul, .ce_gallery ul.cols_2 li { grid-template-columns: 1fr 1fr; } .content-gallery.content-gallery--cols-3 ul, .ce_gallery ul.cols_3 li { grid-template-columns: 1fr 1fr 1fr; } .content-gallery.content-gallery--cols-4 ul, .ce_gallery ul.cols_4 li { grid-template-columns: 1fr 1fr 1fr 1fr; } .content-gallery.content-gallery--cols-5 ul, .ce_gallery ul.cols_5 li { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; } .content-gallery.content-gallery--cols-6 ul, .ce_gallery ul.cols_6 li { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } .content-gallery.content-gallery--cols-7 ul, .ce_gallery ul.cols_7 li { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; } .content-gallery.margin0 ul.cols_2 li, .ce_gallery.margin0 ul.cols_2 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 50%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery.margin0 ul.cols_3 li, .ce_gallery.margin0 ul.cols_3 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 33.3%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery.margin0 ul.cols_4 li, .ce_gallery.margin0 ul.cols_4 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 25%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery.margin0 ul.cols_5 li, .ce_gallery.margin0 ul.cols_5 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 20%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery.margin0 ul.cols_6 li, .ce_gallery.margin0 ul.cols_6 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 16.6%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery.margin0 ul.cols_7 li, .ce_gallery.margin0 ul.cols_7 li { padding-left: 0px; padding-right: 0px; margin-bottom: 0px; width: 14%; list-style-type: none; list-style-image: none; list-style: none; } .content-gallery .flex-images, .ce_gallery .flex-images { display: flex; justify-content: space-between; } .content-gallery .flex-images .item img, .ce_gallery .flex-images .item img { align-self: center; height: auto; } .content-text.media.media--left figure, figure.image_container.kimg.float_left { margin-right:20px; margin-bottom:20px; } .ce_gallery.masonry ul { /* Masonry container */ column-count: 4; column-gap: 1em; } .ce_gallery.masonry ul.cols_2 { column-count: 2; } .ce_gallery.masonry ul.cols_3 { column-count: 3; } .ce_gallery.masonry ul.cols_4 { column-count: 4; } .ce_gallery.masonry ul.cols_5 { column-count: 5; } .ce_gallery.masonry ul.cols_6 { column-count: 6; } .ce_gallery.masonry > ul li.col_first { clear: left; } .ce_gallery.masonry ul.cols_2 li, .ce_gallery.masonry ul.cols_3 li, .ce_gallery.masonry ul.cols_4 li, .ce_gallery.masonry ul.cols_5 li, .ce_gallery.masonry ul.cols_6 li, .ce_gallery.masonry ul.cols_7 li, .ce_gallery.masonry ul.cols_8 li { padding: 0; width:100%; } .ce_gallery.masonry li { /* Masonry bricks or child elements */ background-color: #eee; display: inline-block; margin: 0 0 1em; padding: 0; width: 100%; } .ce_accordion { position: relative; display: flex; flex-direction:column; margin: 20px 0; } .ce_accordion .toggler { display: block; background-image: url('/files/intern/common/plus.svg'); background-repeat: no-repeat; background-position: calc(100% - 10px) center; background-size: 15px; cursor: pointer; margin: 15px 0 0px 0; padding: 15px 0 0 0; border-top: 1px solid var(--ka-font-color); font-size:20px; line-height:24px; font-family: var(--ka-font-family-menu); font-weight:500; letter-spacing: 0.1em; text-transform:uppercase; } .ce_accordion .toggler.active { background-image: url('/files/intern/common/minus.svg'); } .ce_accordion .accordion { margin: 15px 0 10px 0; } .clear, #clear { float:none; clear:both; height:auto; } .center { /* display: flex; justify-content: center; align-items: center; */ width:100%; text-align:center; } .floatleft { float: left; } .col20 { width:20%; } .col25 { width:25%; } .col3 { width:30%; } .col33 { width:33.3%; } .col50 { width:50%; } .col66 { width:66.6%; } .col75 { width:75%; } .col80 { width:80%; } .col25m { float:left; /*margin-left:35px;*/ width:calc(25% - 35px); } .col33m { float:left; margin-left:35px; width:calc(33.3% - 35px); } .col33line { float:left; width:calc(33.3% - 30px); } .col50m { float:left; margin-right:20px; width:calc(50% - 20px); } .col50mr { float:left; margin-right:0; margin-left:20px; width:calc(50% - 20px); } .col50line { float:left; width:calc(50% - 31px); } .col66m { float:left; margin-right:25px; margin-left:0; width:calc(66.6% - 25px); } .col66line { float:left; width:calc(66.6% - 32px); } .colline { width:2px; float:left; display:inline-block; margin-right:29px; margin-left:29px; padding-right:0; padding-left:0; border-right:2px solid #b3b3b3; } .col66 .image_container { width:100%; height:100%; font-size:1px; line-height:1px; } .col66 .image_container img { width:100%; height:100%; object-fit: cover; } .dist20 { height:20px; display:block; } .dist25 { height:25px; display:block; } .dist30 { height:30px; display:block; } .dist50 { height:50px; display:block; } .dist75 { height:75px; display:block; } .dist100 { height:100px; display:block; } .distminus100 { margin-top:-100px; height:0px; display:block; } .distleft0 { position: absolute; left: 0; } .distleft10 { position: absolute; left: 10%; } .distleft20 { position: absolute; left: 20%; } .distleft25 { position: absolute; left: 25%; } .distleft33 { position: absolute; left: 33.3%; } .distleft40 { position: absolute; left: 40%; } .distright0 { position: absolute; right: 0; } .distright10 { position: absolute; right: 10%; } .distright20 { position: absolute; right: 20%; } .distright25 { position: absolute; right: 25%; } .distright33 { position: absolute; right: 33.3%; } .distright40 { position: absolute; right: 40%; } .limit1800, .limit1800int { width: 100%; max-width:1800px; margin-right:auto; margin-left:auto; } .limit1600, .limit1600int { width: 100%; max-width:1600px; margin-right:auto; margin-left:auto; } .limit1400, .limit1400int { width: 100%; max-width:1400px; margin-right:auto; margin-left:auto; } .limit1200, .limit1200int { width: 100%; max-width:1200px; margin-right:auto; margin-left:auto; } .limit1000, .limit1000int { width: 100%; max-width:1000px; margin-right:auto; margin-left:auto; } .limit900, .limit900int { width: 100%; max-width:900px; margin-right:auto; margin-left:auto; } .limit800, .limit800int { width: 100%; max-width:800px; margin-right:auto; margin-left:auto; } .limit700, .limit700int { width: 100%; max-width:700px; margin-right:auto; margin-left:auto; } .limit500, .limit500int { width: 100%; max-width:500px; margin-right:auto; margin-left:auto; } .grid.center { align-items: center; justify-content: center; } .grid { display:grid; } .grid.frx { grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr2 { grid-template-columns: 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr3 { grid-template-columns: 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr4 { grid-template-columns: 1fr 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr5 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr6 { grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr21 { grid-template-columns: 2fr 1fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.fr12 { grid-template-columns: 1fr 2fr; grid-column-gap: 40px; grid-row-gap: 40px; } .grid.gap0 { grid-column-gap: 0px; grid-row-gap: 0px; } .grid.gap5 { grid-column-gap: 5px; grid-row-gap: 5px; } .grid.gap10 { grid-column-gap: 10px; grid-row-gap: 10px; } .grid.gap20 { grid-column-gap: 20px; grid-row-gap: 20px; } .grid.gap40 { grid-column-gap: 40px; grid-row-gap: 40px; } .grid.gap60 { grid-column-gap: 60px; grid-row-gap: 60px; } .grid.gap80 { grid-column-gap: 80px; grid-row-gap: 80px; } .boxgrey, .boxlightgrey, .boxmiddlegrey { width:100%; display:block; padding-top:20px; padding-bottom:30px; } .boxgrey { background-color:var(--ka-bk-boxgrey); } .boxlightgrey { background-color:var(--ka-bk-boxlightgrey); } .boxmiddlegrey { background-color:var(--ka-bk-boxmiddlegrey); } .boxgrey.center { display: flex; justify-content: center; flex-direction:row; } .boxgrey.column { flex-direction:column; } .bkimg1 { background-image: url('/files/image/Hintergruende/the-dutchy-restaurant-background-repeat-1.jpg'); background-repeat: repeat; } .boxwhite { width:100%; display:inline-block; padding-top:20px; padding-bottom:30px; background-color:#ffffff; } .boxwhite.center { display: flex; justify-content: center; flex-direction:row; } .boxwhite.column { flex-direction:column; } .boxdarkblue { width:100%; display: flex; padding-top:20px; padding-bottom:100px; background-color:#131820; flex-direction:column; justify-content: center; } .boxdarkblue.center { display: flex; justify-content: center; } .boxdarkblue .projects { display: flex; flex-direction:row; justify-content: space-between; text-align: left; color: #ffffff; } .boxdarkblue .projects .projectlink, .boxdarkblue .projects .ce_text { width: calc(50% - 10px); } .boxdarkblue .projects .projectlink .text, .boxdarkblue .projects .ce_text .ktext { width: 66%; } .boxdarkblue .projects h2, .boxdarkblue .projects div, .boxdarkblue .projects .button a, .boxdarkblue .ktext h2, .boxdarkblue .ktext p { color: #ffffff; text-transform:normal; } .boxdarkblue .projects div.headline { font-size: 36px; line-height: 40px; font-weight: 300; margin-bottom: 20px; margin-left: 0px; } .boxdarkblue .projects p { color: #999999; } .boxdarkblue .projects .button a { display: block; font-weight: 500; margin-top: 20px; } .boxdarkblue .headlinecolor { text-transform:uppercase; width: auto; min-width: 0; display:table; padding: 0; margin-top: 30px; margin-left: 0px; font-size: 16px; line-height:18px; font-weight: 600; background-image:linear-gradient(90deg,#b91509,#20549d,#23bfe4); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .boxmiddleblue { width:100%; display:inline-block; padding-top:20px; padding-bottom:30px; background-color:#125169; } .boxmiddleblue.center { display: flex; flex-direction:column; justify-content: center; } .boxmiddleblue.center h2, .boxmiddleblue.center div { color:#ffffff; } .lightgreen { background-color:#d8e1dd; } /* 7ec708 */ .boxgreen { width:100%; display:inline-block; padding-top:10px; padding-bottom:15px; background-color:#92ad9f; } .boxgreen h1, body.home .boxgreen h1 { max-width:100%; margin-top:15px; padding-top:0; font-size:44px; color:#FFF; } .boxgreen h2, body.home .boxgreen h2 { max-width:100%; margin-top:20px; padding-top:0; font-size:30px; color:#23a7c4; } .flexcontainer { display: -webkit-flex; display: -ms-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; flex-direction: row; } .flexcontainer.space-between { /* margin-top: 50px; margin-bottom: 50px; */ justify-content: space-between; } .flexcontainer.space-between .ce_hyperlink { position: relative; align-items: center; margin-right:0px; margin-bottom:20px; width:calc(33% - 10px); overflow: hidden; } .flexcontainer.column { flex-direction: column; } .flexcontainer.space-between .ce_hyperlink * { overflow: hidden; line-height: 1px; } .flexcontainer.space-between .ce_hyperlink .linktitle { position: absolute; width: 100%; top: calc(50% - 15px); color: #ffffff; font-size: 30px; line-height: 34px; font-weight: 500; letter-spacing: 0.1em; text-transform:uppercase; pointer-events: none; text-align: center; } .flexcontainer.space-between .ce_hyperlink .image_container img { transform: scale(1.0, 1.0); -ms-transform: scale(1.0, 1.0); -webkit-transform: scale(1.0, 1.0); transition: all .5s ease-in-out; } .flexcontainer.space-between .ce_hyperlink:hover .image_container img { transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); } .flexbox { display: -webkit-flex; display: -ms-flexbox; display: flex; } .ce_dma, .ce_ce_dma { width:100%; } .dlh_googlemap { margin-top:20px; width: 100% !important; height: 350px !important; padding-bottom: 0% !important; } .dlh_googlemap input { margin-right:5px; margin-left:0; padding-top:3px; padding-bottom:3px; } .dlh_googlemap .submit { width:40px; margin-right:0; margin-left:5px; } div.ce_toplink { text-align: center; bottom:20px; right:20px; position:fixed; z-index:991; width:25px; } div.ce_toplink a { margin:0; padding:0; } .ce_code { margin-top:10px; margin-bottom:10px; padding:5px 20px; background: linear-gradient(#ddd .0625em, #f6f7f7 .0625em) 0 -.0625em repeat; 1background-size: 100% 1.5em; 1overflow: auto; border: 1px solid #c9c9c9; border-radius: 3px; box-shadow: 0 1px 5px rgba(0,0,0,0.2); 1white-space: pre; word-wrap: normal; } code { width:100%; display:inline-block; } body .msry_theme_standard .masonry_gallery { margin:10px; padding:0; width:calc(20% - 20px); } #main img { max-width:100%; } #main .ce_player .video_container { max-width: 1600px; margin-left: auto; margin-right: auto; position: relative; } #main .ce_youtube, #main .ce_vimeo { position: relative; padding-bottom: 56.25%; width: 100%; height: auto; max-width: 1600px; margin-left: auto; margin-right: auto; } #main .ce_youtube.col50, #main .ce_youtube.col50m { width: 50%; } #main .ce_youtube iframe, #main .ce_vimeo iframe { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100% !important; height: 100% !important; } .shadow { margin:30px; box-shadow: 0px 0px 30px rgba(0,0,0,0.1); } .boxwhite.shadow { width:calc(100% - 60px); } #cboxOverlay { background: #ececec; opacity: .9; } #cboxContent { margin: 59px 30px 0 30px; background-color: rgba(0,0,0,0.0); } #cboxLoadedContent { border: 0; background-color: rgba(0,0,0,0.0); /*background-color:#ececec;*/ } #cboxContent img { max-width: 1600px; } #cboxCurrent { display: none !important; } #cboxPrevious { left:-29px; width:50px; height:50px; top:calc(50% - 8px); background-image: url("/files/intern/common/pfeil-slider-links-grey.svg"); /*background-size: 260px,16px;*/ background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; outline: none; } #cboxNext { right:-29px; width:50px; height:50px; top:calc(50% - 8px); background-image: url("/files/intern/common/pfeil-slider-rechts-grey.svg"); /*background-size: 260px,16px;*/ background-repeat: no-repeat; background-position: right center; transition: background-position 0.5s ease-in-out; outline: none; } #cboxPrevious:hover { background-position: left center; } #cboxNext:hover { background-position: right center; } #cboxClose { top: -44px; width: 32px; height: 32px; background-image: url("/files/intern/common/close-grey.svg"); } #cboxClose:hover { } #cboxTitle { top:-25px; left:50%; text-align: center; transform: translate(-50%, 0); color: #000000; } .maxw400, .maxwidth400 { max-width:400px; } .maxw500, .maxwidth500 { max-width:500px; } .maxw600, .maxwidth600 { max-width:600px; } .maxw700, .maxwidth700 { max-width:700px; } .maxw800, .maxwidth800 { max-width:800px; } .maxw1000, .maxwidth1000 { max-width:1000px; } .maxw1200, .maxwidth1200 { max-width:1200px; } .maxw1400, .maxwidth1400 { max-width:1400px; } .line { display: block; height: 1px; background-color: var(--ka-font-color); } /* ****************************************************************************************************************** */ /* --- header ---------- -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #header { width:100%; height:150px; top:0; position:fixed; z-index:980; margin: 0; padding: 0; transition: all 1s ease-in-out; background-color:rgba(255,255,255,0.01); /*background: linear-gradient(90deg, rgba(0,0,0,0.5), rgba(0,0,0,0.001));*/ /*background-color:var(--ka-footer-bk-dark);*/ } #header.small, #header2:hover { height:120px; background-color:rgba(255,255,255,1); /*background: linear-gradient(rgba(255,255,255,0.99), rgba(255,255,255,0.98));*/ /*transition: height 1s ease-in-out;*/ } #header.small { position: fixed; animation: grow 1.5s ease; } @keyframes grow { 0% { top: -150px; } 100% { top: 0px; } } body.menumondo, body.menumondo { background-color: #8e8e8e; } body.menumondo #main { margin: 100px 0; } body.menumondo #header { background-color: #8e8e8e; } #header .inside { position: relative; width: 100%; height: 100%; padding:0; margin: 0; } #header * { color: var(--ka-nav-color); font-family: var(--ka-font-family-menu); font-size:14px; line-height: 15px; font-weight: 600; letter-spacing: 0.1em; transition: all 1s ease-in-out; } #header.small *, #header2:hover * { color: var(--ka-font-color); } #header #HeaderLogo, #header #HeaderLogo2 { position: absolute; left:50%; transform: translateX(-50%); top:10px; width:180px; -webkit-transition: width 1s ease-in-out, top 1s ease-in-out; transition: width 1s ease-in-out, top 1s ease-in-out; z-index:+3; } #header #HeaderLogo a, #header #HeaderLogo2 a { position: absolute; top:0; left:0; width:180px; height: 100px; cursor: pointer; /*z-index:961;*/ content: url("/files/intern/header/Breidenbacher-Hof-Logo-weiss.svg"); } #header.small #HeaderLogo, #header2:hover #HeaderLogo { top:20px; width: 100px; height: 40px; /*content: url("/files/intern/header/Breidenbacher-Hof-Logo-Bildmarke-Anthrazit.svg");*/ } #header.small #HeaderLogo a, #header2:hover #HeaderLogo a { top:0px; width: 100px; height: 50px; content: url("/files/intern/header/Breidenbacher-Hof-Logo-Bildmarke-Anthrazit.svg"); } #header #HeaderLogo *, #header #HeaderLogo2 * { border-bottom-style: none; } #header .kontakt { position: absolute; left: 10px; top: 15px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } #header .kontakt * { text-transform: uppercase; } #header .kontakt div#changelanguage, #header .kontakt div.location, #header .kontakt div.tel { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; } #header .kontakt span.img { width: 10px; margin:0 10px 0 20px; } #header .kontakt .location span.img { content: url("/files/intern/common/pin-white.svg"); width: 10px; margin:0 10px 0 20px; } #header.small .kontakt .location span.img, #header2:hover .kontakt .location span.img { content: url("/files/intern/common/pin-black.svg"); } /* #header.small .kontakt .location span.img::after { content: url("/files/intern/common/pin-black.svg"); width: 10px; margin:0 10px 0 20px; } */ #header .kontakt .tel span.img { content: url("/files/intern/common/phone-white.svg"); } #header.small .kontakt .tel span.img, #header2:hover .kontakt .tel span.img { content: url("/files/intern/common/phone-black.svg"); } #header .booking { position: absolute; top: 25px; right: 25px; -webkit-transition: all 1s ease-in-out; transition: all 1s ease-in-out; /*display: none !important; /* hart ausgeblendet 21.05.24 */ } #header.small .booking, #header2:hover .booking { /* position: absolute; top: 18px; right: 18px; */ } #header .booking a { display: block; padding: 13px 33px 11px 33px; line-height: 1em; text-transform:uppercase; background-color: #fff; font-family: var(--ka-font-family-menu); color: var(--ka-fonthx-color); font-size:16px; font-weight: 400; letter-spacing: 0.15em; transition: all 1s ease-in-out; } #header #HeaderEvent1 a:hover, #header #HeaderEvent2 a:hover, #header #HeaderEvent3 a:hover, #header .booking a:hover { text-decoration: none; border-bottom: none; } #header.small .booking a, #header2:hover .booking a { background-color: var(--ka-fonthx-color); color: #fff; } #header #HeaderEvent1, #header #HeaderEvent2, #header #HeaderEvent3 { position:absolute; top:150px; right: 35px; width: 180px; max-width: 25%; display:none; } #header #HeaderEvent2 { position:absolute; width: 130px; right: 15px; top:500px; } #header #HeaderEvent3 { position:absolute; top:300px; } body.showhotelaward #header #HeaderEvent1, body.hotel #header #HeaderEvent1, body.kulinarischeevents #header #HeaderEvent3, body.showkarriereaward #header #HeaderEvent2 { display:block; } body.showkarriereaward #header #HeaderEvent2 a, #header .actionbutton a { display: flex; margin: 10px 0; } #header .actionbutton { position:fixed; top: 150px; right: 20px; display: flex; -webkit-transition: 750ms; transition: 750ms; opacity: 1; pointer-events: inherit; } #header .actionbutton.invisiblesmooth { opacity: 0; pointer-events: none; } #header .actionbutton.event img { width: 170px; height: 170px; } #header .actionbutton img { width: 100px; height: 100px; } #header .actionbutton.hotelaward, #header .actionbutton.award { top: 250px; display: none; } body.showhotelaward #header .actionbutton.hotelaward, body.showaward #header .actionbutton.award { display: block; top: 350px; right: 55px; } body.showhotelaward #header .actionbutton.hotelaward { top: 150px; } #header .actionbutton.fasionistea { display: none; } #header .actionbutton.fasionistea { display: block; width: 201px; height: 180px; top: 140px; right: 20px; } #header .actionbutton.fasionistea img { width: 100%; height: 100%; } /* ****************************************************************************************************************** */ /* --- banner ---------- -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #banner { top:0; position:relative; display: block; margin:0px 0 0px 0; overflow:visible; /*z-index:0;*/ z-index:950; /*background-color:var(--ka-footer-bk-dark);*/ } #banner * { color: var(--ka-nav-color); } #banner .bannerinside { min-height:0px; height: 100%; overflow:hidden; display: block; } #bannerimage { width:100%; height: 100%; /* position:relative; margin-bottom: 100px; /* display: flex; justify-content :center; text-align: center; */ } /* #bannerimage h2.ce_headline { position: absolute; left: 50%; transform: translate(-50%, 0); bottom: -40px; padding: 20px 50px 20px 50px; background-color: #ffffff; box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.4); } */ #bannerimage img { width: 100%; } #bannerimage .verlauf { position:absolute; top: 0; left: 0; width:100%; height: 100%; background: linear-gradient(90deg, rgba(0,0,0,0.5), rgba(0,0,0,0.001)); z-index:+1; pointer-events: none; } /*#bannerimage,*/ #banner #bannerimage .rsts-main { min-height: calc(40vh - 0px) !important; /* min-height: calc(66vh - 0px) !important; max-height: calc(66vh - 0px) !important; */ } #banner #bannerimage .rsts-main img { transition: opacity 1s ease-in-out; } /* #bannerimage #bannersmall, #bannerimage #bannersmall img.image { width:100%; font-size:2px; line-height:2px; } #bannerimage .mod_article { } */ #bannerimage .downbutton { width:100%; bottom:1px; position:absolute; overflow:hidden; display:block; text-align:center; font-size:2px; line-height:2px; } #bannerimage .downbutton a { overflow:hidden; display:block; font-size:17px; line-height:2px; } #bannerimage .image_container img, #bannerimage .video_container video { width: 100%; } #bannerimage .startheader { position: absolute; top: 0; left:0; width:100%; height: 100%; } #bannerimage .startheader .rsts-crop { /*width:100%;*/ } #bannerimage .textbox { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } #bannerimage .textbox * { color: #ffffff; } #bannerimage .textbox .ce_text * { font-size: 24px; line-height: 28px; margin-bottom: 20px; text-shadow: 0px 0px 15px rgba(0,0,0,.9); /* text-shadow: 0 1px 0 hsl(0,100%,100%), 0 1px 0 hsl(0,100%,100%), 0 3px 0 hsl(0,100%,100%), 0 4px 0 hsl(0,100%,100%), 0 5px 0 hsl(0,100%,100%), 0 6px 1px hsl(0,100%,100%), 0 0 5px hsl(0,0%,100%), 0 1px 3px hsl(0,0%,100%), 0 3px 5px hsl(0,0%,100%), 0 5px 10px hsl(0,0%,100%), 0 10px 10px hsl(0,0%,100%), 0 15px 15px hsl(0,0%,100%) */ } /* div#anker::before { content: ''; display: block; height: 50px; margin-top: -50px; visibility: hidden; } */ #bannertext .textinside { width:80%; max-width:1600px; margin-right:auto; margin-left:auto; } #bannertext h1 { font-size:80px; line-height:85px; font-weight:bold; color:#FFF; text-transform:none; } #bannertext p { font:36px/40px Caveat; color:#FFF; } /* ****************************************************************************************************************** */ /* --- footer ------------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #footer { width: 100%; /*height:50px;*/ top:0; position:relative; clear:both; display:block; background-color:var(--ka-footer-bk-dark); margin-top:0; margin-bottom:0; padding-top:0px; } #footer * { color: var(--ka-footer-color); font-size: 15px; font-weight: 400; line-height:24px; letter-spacing: 0.05em; } #footer .inside { height: 100%; float:none; clear: both; display:block; max-width: var(--ka-footerwidth); margin-right:auto; margin-left:auto; padding:0; } #footer a:hover { border-bottom: 0; text-decoration:none; } #footer .line1, #footer .line2 { /*width: calc(100% - 80px);*/ width: calc(100% - 200px); /*max-width: calc(1400px - 80px);*/ padding: 40px 100px 40px 100px; clear: both; } #footer .line2 { border-bottom: 1px solid var(--ka-footer-color); } #footer .line1 { position: relative; display:inline-block; min-height:80px; /* display: flex; flex-wrap: wrap; flex-direction:row; justify-content :center; align-items: center; padding-top: 50px; */ /*justify-content: space-between;*/ } #footer .line1 div#FooterLogo { position: absolute; top: 0; left: calc(50% - 100px); margin:50px 0; display:block; /*transform: translate(-50%, 0%);*/ } #footer .line1 div#FooterLogo img { width:200px; } #footer .line2 { /*width: 100%;*/ position: relative; display: flex; flex-wrap: wrap; flex-direction:row; justify-content :center; justify-content: space-between; } #footer .line2 .kontakt * { font-size: 16px; font-style: italic; font-family:Baskervville,Arial; } #footer .line2 .mod_footer_navi a, #footer .line2 .mod_footer_navi strong, #footer .line2 .mod_footer_navi span { text-transform: uppercase; font-family: var(--ka-font-family-menu); font-size:14px; } #footer .line2 .button a { display: inline-block; text-align: center; min-width:140px; margin-top: 20px; padding: 10px 20px 6px 20px; background-color: transparent; text-transform:uppercase; border: 1px solid var(--ka-footer-color); font-weight: 600; padding: 13px 33px 11px 33px; line-height: 1em; text-transform: uppercase; font-family: var(--ka-font-family-menu); /* background-color: #fff; color: var(--ka-fonthx-color); */ font-size: 16px; font-weight: 400; letter-spacing: 0.15em; transition: all 1s } #footer .line2 .button a:hover { background-color: #fff; color:var(--ka-font-color); border: 1px solid var(--ka-footer-color); } #footer .line2 .mod_footer_navi li a:hover, #footer .line2 .mod_footer_navi li a:hover span, #footer .line2 .mod_footer_navi li strong:hover, #footer .line2 .kontakt a:hover, #footer .line2 .kontakt .route a:hover { color: #8e8e8e; } #footer .line2 .kontakt .route a { text-transform: uppercase; font-family: var(--ka-font-family-bg); font-weight: 400; letter-spacing: 0.2em; font-size: 14px; font-style: normal; border-bottom: 1px solid var(--ka-font-color); text-decoration: none; transition: border 75ms linear; } #footer .line2 .kontakt img.marker { width: 32px; } #footer .line2 .copyright { position: absolute; left: auto; top: auto; right: 175px; bottom: 55px; } #footer .line3 { position: relative; display: grid; grid-template-columns: 40% 60%; grid-column-gap: 80px; width: 100%; padding: 50px 0px 150px 0px; width: calc(100% - 80px); } #footer .line3 .links { display: flex; justify-content: flex-start; align-items: center; } #footer .line3 .links a { margin: 0 20px 0 20px; } #footer .line3 .awards { display: flex; justify-content: center; } #footer .line3 .awards a { margin: 0 5px 0 5px; } #footer .line3 .links a { margin: 0 5px 0 5px; } #footer .line3 *, #footer .line3 .mod_footer_navi ul, #footer .line3 .mod_footer_navi li { margin: 0; padding: 0; } #footer .line3 a { margin: 0; cursor:pointer; } #footer .line3 .links a img { height:50px; } #footer .line3 .awards a img { width:91px; /*height: 91px;*/ } #footer .line3 div.ce_toplink img { width:12px; height:25px; } #footer .line3 .mod_footer_navi li { float: left; margin-right: 30px; } #footer .line3 .mod_changelanguage { position: absolute; left: 100px; top: 80px; } #footer .line3 .mod_footer_navi li a, #footer .line3 .mod_footer_navi li span { text-transform:initial; } #footer .line3 .mod_changelanguage li { float: left; padding: 0 5px 0 5px; } #footer .line3 .mod_changelanguage li:nth-child(1) { border-right: 1px solid #000000; } #footer .line3 .mod_changelanguage li a:hover, #footer .line3 .mod_changelanguage li a span:hover { color: #ffffff; } #footer .line3 .socials .text, #footer .line3 .socials .links { margin: 0, 0, 0, 15px; float: left; } #footer .line3 .socials .links { margin-top: -5px; margin-left: 20px; } .mod_footer_navi { padding-top: 5px; } .mod_footer_navi ul { list-style-type:none; justify-content: center; margin-left: 0; padding-left: 0; } .mod_footer_navi li { display: block; padding: 0; margin: 0; } #footer strong, #footer div.strong { font-weight: 400; text-transform: uppercase; } .mod_footer_navi li strong, .mod_footer_navi a { padding-right:0; padding-left:0px; } #footer .socials { position:relative; } #footer .socials img { width: 26px; height: 26px; } #footer .socials a { margin-right: 20px; } #footer a:hover, #footer .mod_footer_navi a:hover, #footer .mod_footer_navi a:hover span { color:#ffffff; } /* ****************************************************************************************************************** */ /* --- mainmenu ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media screen and (min-width: 1601px) { #navmobil { display:none; } #mainnav { position:absolute; width: 100%; /*height:30px;*/ left:50%; transform:translate(-50%, 0); top:120px; overflow:visible; display: flex; align-items: center; justify-content :center; margin:0; transition: top 1s ease-in-out; z-index: 992; } #header.small #mainnav, #header2:hover #mainnav { top: 85px; } #mainnav * { font-family: var(--ka-font-family-menu); font-size:14px; line-height: 15px; letter-spacing:0.15em; border-bottom:none; font-weight:500; color:var(--ka-nav-color); text-transform:uppercase; } #mainnav.mod_navigation a, #mainnav.mod_navigation li.active strong { margin:0; padding:0; padding-bottom: 5px; border-bottom:0px solid var(--ka-nav-color); /*transition: border 250ms linear;*/ font-weight: 500; } #header.small #mainnav.mod_navigation li a, #header.small #mainnav.mod_navigation li.active strong { color:var(--ka-font-color); border-bottom:0px solid var(--ka-font-color); } #mainnav.mod_navigation a:hover { text-decoration:none; } #mainnav.mod_navigation span.active, #mainnav.mod_navigation li.sibling, #mainnav.mod_navigation li.trail { /* margin:0; padding:0; */ } #mainnav.mod_navigation ul.level_1 span.active, #mainnav.mod_navigation ul.level_1 li.sibling, #mainnav.mod_navigation ul.level_1 li.trail { /*padding-bottom: 0px;*/ } #mainnav.mod_navigation ul.level_1 li { display: inline-block; /*padding-bottom: 10px;*/ } #mainnav.mod_navigation li { position:relative; padding: 0; float:left; list-style-type:none; } #mainnav.mod_navigation li a, #mainnav.mod_navigation li.active strong, #mainnav.mod_navigation li.sibling strong { position:relative; float:left; margin:0 8px; padding:0; font-family: var(--ka-font-family-menu); font-size:14px; line-height: 15px; letter-spacing:0.05em; border-bottom:none; font-weight:500; color:var(--ka-nav-color); text-transform:uppercase; border-bottom:0px solid var(--ka-nav-color); /*transition: border 250ms linear;*/ } #mainnav.mod_navigation li.active strong, #mainnav.mod_navigation li.sibling strong { color:var(--ka-font-menu-active); } #mainnav.mod_navigation ul.level_1 li a, #mainnav.mod_navigation ul.level_1 li.sibling strong, #mainnav.mod_navigation ul.level_1 li.active strong { padding-bottom: 4px; font-weight:500; /*border:1px solid #f00;*/ } #header.small #mainnav.mod_navigation ul.level_1 li a, #header.small #mainnav.mod_navigation ul.level_1 li.active strong { /*border:1px solid #00f;*/ } #mainnav.mod_navigation ul.level_1 li.active strong, #mainnav.mod_navigation ul.level_1 li aXX:hover { padding-bottom: 4px; border-bottom:1px solid var(--ka-nav-color); } #header.small #mainnav.mod_navigation ul.level_1 li.active strong { border-bottom:1px solid var(--ka-font-color); font-weight:500; } #mainnav.mod_navigation li a span { /* margin:0; padding:0; */ } #mainnav.mod_navigation li a:hover, #mainnav.mod_navigation li a.sfhover { /* color:var(--ka-font-menu-hover); transition: color 500ms ease-in-out; */ transition: all 500ms ease-in-out; } #mainnav.mod_navigation ul { margin:0; padding:0; list-style-type:none; } #mainnav.mod_navigation li ul { display: block; width:220px; bottom:0; left:0; right:0; top:18px; position:absolute; display:none; opacity: 0; padding-top:14px; transition: all 750ms ease-out; /*border:1px solid #f00;*/ /*background-color:#eee;*/ } #mainnav.mod_navigation li ul li { display: block; margin:0; padding:0; border-bottom:1px solid var(--ka-font-menu); border-radius:0; } #mainnav.mod_navigation li ul li a, #mainnav.mod_navigation li ul li.active strong { width:210px; margin:0; padding:11px 0 11px 5px; text-align:left; background-color:rgba(255,255,255,.001); background-image:none; transition: color 1s ease-out; } #header.small #mainnav.mod_navigation li ul li a, #header.small #mainnav.mod_navigation li ul li.active strong { color:var(--ka-font-color); /*border-bottom:0px solid var(--ka-font-color);*/ background-color:rgba(255,255,255,1); } #mainnav.mod_navigation li ul li a:hover { color:#ffffff; transition: color 500ms ease-in-out; } #mainnav.mod_navigation li ul li.active strong { /* background-color:rgba(245,245,245,.85); */ font-weight: 600; background-image:none; color:var(--ka-font-menu-active); } #mainnav.mod_navigation li ul ul { left:200px; position:absolute; top:0; z-index: 999; } #mainnav.mod_navigation li:hover ul { display:block; opacity: 1; } #mainnav.mod_navigation ul li:hover ul ul { display:none; } #mainnav.mod_navigation ul ul li:hover ul { display:block; } } .submit { width:300px; max-width:100%; margin-top:20px; margin-left:220px; padding-top:15px; padding-bottom:12px; background-color: unset; font-family: var(--ka-font-family-bg); color: var(--ka-font-color); font-weight: 600; text-transform:uppercase; border: 1px solid var(--ka-font-color); border-style: solid; cursor: pointer; } fieldset { width:100%; display:block; margin:12px 0 12px 0; padding:0px 0 0px 0; } .widget { padding: 0 0 20px 0; } .widget-textarea { padding: 25px 0 15px 0; } .widget-textarea label, .widget-captcha label, .widget-text label, .widget-password label, .widget-radio legend, .select label { width:220px; float:left; display:block; font-size: 16px; letter-spacing: .025em; color:var(--ka-font-color); } span.mandatory { padding-left: 5px; } textarea:focus, input:focus{ outline: none; } input.text, input.password, input.captcha, textarea { font-size: 16px; letter-spacing: .025em; font-weight: 400; color:#000000; } input.text, input.password, input.captcha { width:calc(100% - 360px); max-width:90%; margin:0 0 0 0; padding:0 20px 0 20px; border:medium none; border-bottom: 1px solid var(--ka-font-color); } input.captcha { width:75px; margin-right:5px; } textarea { width:1020px; height:200px; padding:10px 20px 10px 20px; border: 1px solid var(--ka-font-color); width:calc(100% - 360px); } select { width:204px; margin:1px 0; } div.radio_container { margin:5px 0 1px; } div.radio_container span { display:block; padding-right:6px; } input.radio { top:2px; position:relative; margin:1px 2px 0 1px;text-w padding:0; } fieldset.checkbox_container { width:calc(100% - 220px); margin:10px 0 10px 220px; padding-top:0; padding-bottom:0; } fieldset.checkbox_container label { display:block; max-width:calc(100% - 100px); } fieldset.checkbox_container label a { font-family: Lato,Arial; font-weight: 400; font-size: 16px; line-height: 26px; letter-spacing: .025em; } div.checkbox_container span { display:block; padding-right:6px; } input.checkbox { float:left; margin:3px 7px 0 1px; padding:0; } fieldset span { display: table-row-group; } fieldset legend span { display: inline; } fieldset span label { float: none; } fieldset table td:first-child { margin:1px 0; } #col_0 { width:150px; margin-left:0; } .mod_unsubscribe .widget { text-align: center; align-items: center; } .mod_unsubscribe input.text { width:100%; max-width:400px; margin:0 0 0 0; padding:0 20px 0 20px; border:medium none; border-bottom: 1px solid var(--ka-font-color); } .mod_unsubscribe .submit { margin:20px 0; } /* ****************************************************************************************************************** */ /* --- swiper-slider ------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ /* Standardpfeile entfernen */ .swiper-button-next:after, .swiper-button-prev:after { content: ''; display: none; } /* keine Bullets */ .swiper-horizontal>.swiper-pagination-bullets { display: none; } /* Chrome Touch Workaraound */ .swiper-slide > div { touch-action: pan-y; } section.kabannerbtns { position: absolute; top: 150px; left: auto; right: 20px; display: flex; flex-direction: column; } #bannerimage section.kabannerbtns img { width: 150px; height: 150px; } /* ****************************************************************************************************************** */ /* --- textcenter ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .textcenter { padding-bottom: 5px; /* wegen a:hover */ } /* ****************************************************************************************************************** */ /* --- swiperslider ------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .swiper-container { /* */ max-width: 100%; overflow: hidden; position: relative; } .swiper-wrapper { /*max-width: 100%;*/ /*transition: height 1s ease-in-out; beware!!! dann slidet er nicht weiter*/ } .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after, .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after { content: '' !important; } .swiper-button-prev, .swiper-button-next { position: absolute; top: calc(50% - 0px); left: auto; right: auto; width: 50px; height: 50px; background-repeat: no-repeat; background-color: rgba(0,0,0,0.0); background-repeat: no-repeat; background-position: center; background-size: 100%; transition: all 0.5s ease-in-out; cursor:pointer; z-index: 931; } .swiper-button-prev { left: 10px; background-image:url("/files/intern/common/pfeil-slider-links-grey.svg"); } .swiper-button-next { right: 10px; background-image:url("/files/intern/common/pfeil-slider-rechts-grey.svg"); } /* .swiper-button-prev:hover { background-image:url("/files/intern/common/pfeil-slider-links.svg"); } .swiper-button-next:hover { background-image:url("/files/intern/common/pfeil-slider-rechts.svg"); } */ /* ****************************************************************************************************************** */ /* --- slider ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .rsts-skin-default .rsts-prev, .rsts-skin-default .rsts-next, .rsts-skin-default .rsts-video-play, .rsts-skin-default .rsts-video-stop, .rsts-skin-default .rsts-thumbs-prev, .rsts-skin-default .rsts-thumbs-next { margin: 0; padding: 0; background-position:center center; background-repeat:no-repeat; -webkit-box-shadow:0 0 0 0; box-shadow:0 0 0 0; border:0px !important; border-radius:0; background-clip: initial; background-color:transparent; } .rsts-skin-default .rsts-view { position: relative; } .rsts-skin-default .rsts-prev { position:absolute; width:34px; height:16px; top:calc(50% - 8px); /*left:calc(10% - 0px);*/ left:230px; background-image:url("/files/intern/common/pfeil-links-grey.svg"); background-size: 34px,16px; background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; } .rsts-skin-default .rsts-prev:hover { background-position: right center; } .rsts-skin-default .rsts-next { position:absolute; width:34px; height:16px; top:calc(50% - 8px); right:230px; background-image:url("/files/intern/common/pfeil-rechts-grey.svg"); background-size: 34px,16px; background-repeat: no-repeat; background-position: center; background-position: right center; transition: background-position 0.5s ease-in-out; } .rsts-skin-default .rsts-next:hover { background-position: left center; } .rsts-skin-default .rsts-prev:hover, .rsts-skin-default .rsts-next:hover, .rsts-skin-default .rsts-video-play:hover, .rsts-skin-default .rsts-video-stop:hover, .rsts-skin-default .rsts-thumbs-prev:hover, .rsts-skin-default .rsts-thumbs-next:hover { background-color: transparent; } .rsts-skin-default .rsts-nav { position: absolute; bottom: -15px; left:0; width: 100%; text-align: center; } .rsts-skin-default .rsts-nav-bullets li { margin: 0 5px 0 5px; padding: 0; border-bottom-style: none; } #main .rsts-skin-default .rsts-nav-bullets a { width:50px; height: 2px; background-color: #000000; border-bottom-style: none; border-radius: 0; box-shadow: 0 0; } #main .rsts-skin-default .rsts-nav-bullets a:hover, #main .rsts-skin-default .rsts-nav-bullets a.active { background-color: #88A89F; border-bottom-style: none; border-radius: 0; box-shadow: 0 0; } .rsts-slide { position: relative; } .s3part { display: block; margin: 100px 0 100px 0; } .s3part .rsts-slides { position: relative; height: 100%; /* display: flex; align-items: center; justify-content: center; */ } .s3part .rsts-slide { transition:opacity 500ms ease-out; } .s3part .rsts-slide.rsts-inactive { margin: 50px 0; opacity: 0.3; margin-top:50px; overflow: hidden; height:calc(100% - 250px); /*top: 0 !important;*/ } .s3part .rsts-slide.rsts-inactive .link .textblock { display: none; } .s3part .rsts-slide.rsts-inactive > div { overflow: hidden; } .s3part .rsts-slide.rsts-active { padding: 0px 0px; opacity: 1; } .s3part .rsts-slide a { border-bottom: none !important; } .s3part .rsts-slide .link .textblock .text { font-family: var(--ka-font-family-basker); font-style: italic; text-transform: none; font-size: 18px; line-height:22px; color: #7c7c7c; letter-spacing: 0.025em; font-weight: 400; } .s3part .rsts-slide .link .textblock span { border-bottom: 1px solid var(--ka-font-color); } .rsts-skin-default .rsts-caption { display: none; } .mod_rocksolid_slider.startrestaurant.block { overflow: visible; padding-bottom: 30px; } .mod_rocksolid_slider.startrestaurant .rsts-slides { /*overflow:hidden;*/ } .rsts-skin-default.rsshadow.limit900 { width:calc(100% - 60px); } .rsts-skin-default.rsshadow .rsts-view { /*width:calc(100% - 30px);*/ } .rsts-skin-default.rsshadow .rsts-slide { } .rsts-skin-default.rsshadow img { margin:30px; /*width:calc(100% - 60px);*/ box-shadow: 0px 0px 30px rgba(0,0,0,0.1); } .rsts-skin-default.rsshadow h3 { max-width:700px; margin-right:auto; margin-left:auto; } /* .mod_rocksolid_slider.maxheight300 .rsts-slides { position: relative; display: inline-block; width: 100%; height: 100%; max-height: 300px; } .mod_rocksolid_slider.maxheight300 .rsts-slides .rsts-slide { position: relative; display: block; height: 100%; } .mod_rocksolid_slider.maxheight300 .rsts-slides .rsts-slide img { height: 100%; width: 100%; object-fit: cover; } */ /* .rsts-skin-default.rsshadow img::before { box-shadow: 0px 0px -5px grey; } */ /* .mod_rocksolid_slider.startrestaurant { width: 900px; overflow: visible; } .mod_rocksolid_slider.startrestaurant .rsts-crop { padding: 0 175px 0 175px; overflow: visible; } .mod_rocksolid_slider.startrestaurant .rsts-slide { padding-bottom: 20px; } .mod_rocksolid_slider.startrestaurant .rsts-slide .textbox { position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); } .rsts-slide .slogan, .rsts-slide .textbox { width: 50%; } .rsts-slide .textbox { position: relative; right: 5%; bottom: 100px; padding: 20px 50px 20px 50px; background-color: #ffffff; box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.4); } */ /* ****************************************************************************************************************** */ /* --- statement ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #main .statement { font-family: Baskervville,Arial; font-size:var(--ka-statement-font-size); line-height: var(--ka-statement-line-height); letter-spacing: var(--ka-statement-letter-spacing); text-transform: uppercase; } /* ****************************************************************************************************************** */ /* --- ka-link ------------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ #main .link.imagegrow, #main .link.flat, #main .link.textbox { position: relative; width:calc(33.3% - 10px); } #main .link.imagegrow .imgblock, #main .link.flat .imgblock { position: relative; overflow: hidden; } #main .link.imagegrow .imgblock *, #main .link.flat .imgblock * { line-height: 1px; } #main .link.imagegrow .image_container, #main .link.flat .image_container { overflow: hidden; line-height: 1px; } #main .link.imagegrow .image_container img, #main .link.flat .image_container img { transform: scale(1.0, 1.0); -ms-transform: scale(1.0, 1.0); -webkit-transform: scale(1.0, 1.0); transition: all .75s ease-in-out; } #main .link.imagegrow:hover .image_container img, #main .link.flat:hover .image_container img { transform: scale(1.05, 1.05); -ms-transform: scale(1.05, 1.05); -webkit-transform: scale(1.05, 1.05); } #main .link.imagegrow .button a { position: absolute; width: 100%; top: calc(50% - 15px); color: #ffffff; font-size: 30px; line-height: 34px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; pointer-events: none; text-align: center; } #main .link.imagegrow .text { margin-top: 20px; margin-bottom: 20px; padding-left: 50px; padding-right: 50px; } #main .link.flat { position: relative; width:calc(33.3% - 10px); } #main .link.flat .text { width: 80%; } #main .link.hover { position: relative; display: inline-block; float: left; width: calc(33.3% - 10px); padding: 0; margin: 0px 0 18px 0px; overflow: hidden; /*border: 1px solid #ff0000;*/ } #main .link.hover .imgblock { line-height: 1px; /* position: absolute; top: 0; left: 0; */ } #main .link.hover .headline { color: #ffffff; font-size: 18px; font-weight: 400; } #main .link.hover .imgblock * { line-height: 1px; position: relative; } #main .link.hover .imgblock img { width: 100%; height: 100%; overflow: hidden; } #main .link.hover .imgblock:hover a { } #main .link.hover .imgblock .headline { position: absolute; top:50%; width: 100%; text-align: center; transition: .5s; } #main .link.hover:hover .imgblock .headline { opacity: 0; } #main .link.hover .textblock { position: absolute; top: 0; left: 0; display: flex; flex-direction:column; text-align: center; justify-content :center; width: calc(100% - 0px); height: 100%; transition: 1.0s; line-height: 1px; pointer-events: none; } #main .link.hover .textblock .h4 { margin-top: 5px; color:#ffffff; font-size: 16px; line-height:18px; font-weight: 600; } #main .link.hover .textblock .headlinecolor { margin-top: 1px; color:#ffffff; font-size: 36px; line-height:40px; font-weight: 400; } #main .link.hover .textblock:hover { cursor:pointer; } #main .link.hover .hoverblock { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #88A89F; display: flex; flex-direction:column; text-align: center; justify-content :center; opacity: 0; transition: 1.0s; pointer-events: none; line-height: 1px; overflow: hidden; } #main .link.hover:hover .hoverblock { opacity: 0.8; } #main .link.hover .button a { font-size: 34px; } #main .link.hover .hoverblock .text { margin-top: 20px; margin-bottom: 20px; } #main .link.hover .button a { color: #ffffff; font-size: 16px; font-weight: 300; } #main .link.hover .textblock .text p { color: #999999; } #main .link.textbox { position: relative; width:32%; } #main .link.textbox .text { position: absolute; width: 80%; bottom: 30px; } #main .link.textpad { position: relative; /*width:32%;*/ } #main .link.textpad.col50 { width: calc(50% - 10px); } #main .link.textpad.col33 { width: calc(33.3% - 10px); } #main .link.textpad.col25 { width: calc(25% - 10px); } #main .link.textpad .image_container a { border-bottom: none; } #main .link.textpad .textblock { /*position: absolute; bottom: 30px; */ margin: 20px 0; padding: 0 100px; } #main .link.textpad .headline { margin: 0 0 15px 0; font-family: var(--ka-font-family-menu); font-size:20px; line-height:24px; font-weight:500; letter-spacing:0.1em; text-transform: uppercase; } #main .link.textpad .button { margin: 15px 0 0 0; } #main .link.textpad .button a { color:var(--ka-font-color-brown); } #main .link.hoverimg { position: relative; /*width:32%;*/ } #main .link.hoverimg.col50 { width: calc(50% - 10px); } #main .link.hoverimg.col33 { width: calc(33.3% - 10px); } #main .link.hoverimg.col25 { width: calc(25% - 10px); } #main .link.hoverimg .imgblock { position: relative; font-size: 1px; line-height: 1px; } #main .link.hoverimg .image_container a { border-bottom: none; } #main .link.hoverimg .textblock { /*position: absolute; bottom: 30px; */ margin: 0px 0; padding: 0 0; } #main .link.hoverimg .headline { margin: 0 0 15px 0; font-size:20px; line-height:24px; font-weight:400; text-transform: uppercase; } #main .link.hoverimg .hoverblock { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #88A89F; display: flex; flex-direction:column; text-align: center; justify-content :center; opacity: 0; transition: 1.0s; pointer-events: none; line-height: 1px; overflow: hidden; font-size:20px; line-height:24px; font-weight:400; text-transform: uppercase; } #main .link.hoverimg:hover .hoverblock { opacity: 0.8; } #main .link.hoverimg .button { margin: 15px 0 0 0; } #main .link.hoverimg .button a { color:#fff; border-bottom: none; } /* ****************************************************************************************************************** */ /* --- ka-textxcol -------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.textxcols, #main section.textxcols { position: relative; background-color: var(--ka-bk-boxlightgrey); padding: 100px 0 50px 0; margin-bottom: 0; } section.textxcols .headline { margin: 10px 0 70px 0; } section.textxcols .box2col { width: 100%; } section.textxcols .box2col .cols { width: 100%; } section.textxcols .box2col .cols.cnt_2 .column { width: calc(50% - 30px); } section.textxcols .box2col .cols.cnt_3 .column { width: calc(33.3% - 30px); } section.textxcols .box2col .cols.cnt_4 .column { width: calc(25% - 30px); } section.textxcols .box2col .cols.cnt_5 .column { width: calc(20% - 30px); } section.textxcols .box2col .cols.cnt_6 .column { width: calc(16.64% - 30px); } section.textxcols .box2col .cols.cnt_3 .column .colinside { width: calc(100% - 0px); } section.textxcols .box2col .cols .column .hl { border-bottom: 1px solid var(--ka-font-color); padding: 0 0 5px 0; margin: 0 0 30px 0; } section.textxcols .footer .line1, section.textxcols .footer .line2 { display: flex; flex-direction:column; justify-content :center; flex-direction:row; margin: 10px 0 0 0; } section.textxcols .footer .line1 { margin: 70px 0 0 0; } section.textxcols .footer .line1 .text { font-size: 20px; text-transform: uppercase; font-weight:500; } section.textxcols .footer .line2 img { width: 15px; margin: 0 10px 0 0; } section.textxcols .footer .line2 .text { font-size: 30px; } /* ****************************************************************************************************************** */ /* --- ka-textimg --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #main .textimg { position: relative; width: 100%; height: 100%; margin-top: 0px; margin-bottom: 0px; /* display: flex; flex-direction:column; justify-content: space-between; */ } #main .textimg .imgblock * { /*line-height: 1px;*/ /* font-size: 15px; line-height: 15px; */ } #main .textimg .mobileblock { display: none; } #main .textimg.scalimg .imgblock .image_container { position: relative; width: 100%; height: 100%; overflow: hidden; min-height:250px; } #main .textimg.scalimg img { position: absolute; width: 100%; height: 100%; left:0%; object-fit: cover; display: inline-block; } #main .textimg.scalimg .text img { position: relative; left: auto; width: auto; height: auto; } #main .textimg.scalimg .bottomblock .right { text-align: right; } #main .textimg.scalimg .bottomblock { margin: 30px 0 0 0; } #main .textimg.scalimg .bottomblock h6 { transform: rotate(-5deg); } #main .textimg .textblock { padding-top: 80px; padding-bottom: 80px; display: flex; flex-direction:column; justify-content :center; } #main .textimg .left .headline, #main .textimg .left .text, #main .textimg .right .headline, #main .textimg .right .text, #main .textimg .left .button, #main .textimg .right .button, #main .textimg .left .ce_accordion, #main .textimg .right .ce_accordion, #main .textimg .left .ka_accordion, #main .textimg .right .ka_accordion { padding: 0px; } #main .textimg .left .headline, #main .textimg .left .text, #main .textimg .left .button, #main .textimg .left .ce_accordion, #main .textimg .left .ka_accordion { padding-right: 150px; } #main .textimg .right .headline, #main .textimg .right .text, #main .textimg .right .button, #main .textimg .right .ce_accordion, #main .textimg .right .ka_accordion { padding-left: 150px; } #main .textimg .headline { margin-top: 0; } #main .textimg .left .text, #main .textimg .right .text { margin: 30px 0 10px 0; /* padding-right: 150px; padding-left: 150px; */ } #main .textimg .left .button, #main .textimg .right .button { margin-top: 20px; } /*master*/ #main a, #main .button a, #main .textimg .button a { position: relative; text-transform:uppercase; font-family: var(--ka-font-family-bg); font-weight: 800; letter-spacing: 0.15em; font-size: 13px; border-bottom: 1px solid var(--ka-font-color); text-decoration:none; transition: border 75ms linear; } #main a:hover, #main .button a:hover, #main .textimg .button a:hover { text-decoration:none; border-bottom: 4px solid var(--ka-font-color); } /*bookbtn*/ #main .bookbtn, #main .button.bookbtn, #main .textimg.bookbtn .button, #main .textimgbk.bookbtn .button { margin-top: 35px !important; margin-bottom: 25px !important; } #main .bookbtn a, #main .button.bookbtn a, #main .textimg.bookbtn .button a, #main .textimgbk.bookbtn .button a { border: 1px solid var(--ka-font-color); /*display: block;*/ padding: 13px 15px 11px 15px; line-height: 1em; text-transform: uppercase; background-color: #fff; transition: all 1s ease-in-out; } #main .bookbtn a { display: inline-block; } #main .bookbtn a:hover, #main .button.bookbtn a:hover, #main .textimg.bookbtn .button a:hover, #main .textimgbk.bookbtn .button a:hover { border: 1px solid var(--ka-font-color); background-color: var(--ka-font-color); color:#fff; } #main .bookbtn a.classic { display: block; margin: 20px 0 0 0; text-transform:none; border: none; background-color: initial; font-size:30px; line-height: 42px; letter-spacing: 0.05em; font-weight: 400; font-family: var(--ka-font-family-basker); } #main .bookbtn a.classic:hover { border: none; background-color: initial; color:var(--ka-font-color); } /* #main .button a, #main .textimg .button a { position: relative; text-transform:uppercase; font-family: var(--ka-font-family-bg); font-weight: 800; letter-spacing: 0.2em; font-size: 13px; border-bottom: 0px solid var(--ka-font-color); text-decoration:none; } #main .button a:hover, #main .textimg .button a:hover { text-decoration:none; } #main .button a:after, #main .textimg .button a:after { position: absolute; left: 0px; content: ''; height: 24px; width: 100%; border-bottom: 1px solid var(--ka-font-color); text-decoration:none; -webkit-transform: scaleX(0.0001); -ms-transform: scaleX(0.0001); transform: scaleX(0.0001); -webkit-transition: -webkit-transform 750ms ease-in-out; transition: transform 750ms ease-in-out; } #main .button a:hover:after, #main .textimg .button a:hover:after { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } */ /* Overlay */ #main .textimg.overlay { background-repeat: no-repeat; background-position: top; background-size: cover; /*background-color:#f00;*/ } #main .textimg.overlay .imgblock { position: relative; } #main .textimg.overlay .imgblock .image_container { top: 30%; width: 70%; height: 70%; z-index: -1; } #main .textimg.overlay .imgblock div.hl2 { position: absolute; top: 0; right: 0; width: 70%; font-size:var(--ka-statement-font-size); line-height: var(--ka-statement-line-height); letter-spacing: var(--ka-statement-letter-spacing); text-transform: uppercase; z-index: +1; } /* Boxed mitSlider */ #main .textimg.boxed { margin: 100px 0; } #main .textimg.boxed .textxcol.txtleft { width:100%; display: flex; justify-content: flex-end; } #main .textimg.boxed .left, #main .textimg.boxed .right { position: relative; width: calc(50% + 800px); max-width:100%; } #main .textimg.boxed .videocontainer { position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; min-height: 400px; } #main .textimg.boxed .videocontainer .prev-video-container, #main .textimg.boxed .videocontainer .prev-image-container { position: absolute; width: 100%; height: 100%; } #main .textimg.boxed .videocontainer .prev-video-container video { width: 100%; height: 100%; object-fit: cover; } #main .textimg.boxed .videocontainer .videobtn { line-height: 15px; font-size: 14px; color:000; text-transform: uppercase; font-weight: 800; font-family: var(--ka-font-family-bg); letter-spacing: 0.2em; z-index: +1; cursor: pointer; padding: 15px 20px 12px 20px; border: 1px solid #000; transition: all 1s ease-in-out; background-color:rgba(255,255,255,1); } #main .textimg.boxed .videocontainer .prev-image-container.disable, #main .textimg.boxed .videocontainer .videobtn.disable { display: none; } #main .textimg.boxed .videocontainer .videobtn:hover { border: 1px solid var(--ka-font-color); background-color: var(--ka-font-color); color:#fff; } #main .textimg.boxed .textblock { padding: 40px 0 40px 0; } #main .textimg.boxed .textblock .buttons { padding: 0 0 10px 0; } #main .textimg.boxed .headline, #main .textimg.boxed .text, #main .textimg.boxed .button, #main .textimg.boxed .ce_accordion, #main .textimg.boxed .ka_accordion { padding-left: 95px; padding-right: 95px; } #main .textimg.boxed .text a { border-bottom: 0px solid var(--ka-font-color) !important; } #main .textimg .boxw { background-color:#fff; min-height:900px; } #main .textimg .imgblock { position: relative; padding:100px 0 0 0; } #main .textimg .swiper-container { /* position: relative; width: 100%; height: 100%; margin-left: auto; margin-right: auto; overflow: hidden; */ } #main .textimg .swiper-wrapper { /* position: relative; width: 100%; height: 100%; z-index: 1; display: flex; box-sizing: content-box; */ } #main .textimg .swiper-slide { /* width: 100%; height: 100%; position: relative; display: flex; align-items: center; flex-shrink: 0; flex-direction:column; min-height:250px; */ } /* #main .textimg .swiper-container { position: relative; width: 100%; padding-top: 50px; padding-bottom: 180px; z-index: 998; } #main .textimg .swiper-wrapper { position: relative; z-index: 999; } #main .textimg .swiper-slide { background-position: center; background-size: cover; width: 450px; height: 800px; -webkit-box-reflect: below 1px linear-gradient(transparent, transparent, transparent, transparent, #0006); } */ #main .textimg .swiper-button-prev { position:absolute; width:20px; height:70px; top:calc(50% - 40px); left:30px; background-image:url("/files/intern/common/pfeil-slider-links.svg"); background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; cursor:pointer; z-index: +2; } #main .textimg .swiper-button-next { position:absolute; width:20px; height:70px; top:calc(50% - 40px); right:30px; background-image:url("/files/intern/common/pfeil-slider-rechts.svg"); background-repeat: no-repeat; background-position: center; background-position: right center; transition: background-position 0.5s ease-in-out; cursor:pointer; z-index: +2; } #main .textimg .noswiper.cnt_1 .swiper-button-prev, #main .textimg .noswiper.cnt_1 .swiper-button-next { display: none; } #main .textimg.boxed .img2block { position: absolute; right: 0; bottom: 0; width:80px; height:80px; z-index: +1; } #main .textimg.boxed .img2block .image_container { width: 100%; height: 100%; } #main .textimg.boxed .img2block .image_container img { width: 100%; height: 100%; object-fit: contain; } #main .textimg.scalimg .swiper-container.cnt_1 img { transform: scale(1.0, 1.0); -ms-transform: scale(1.0, 1.0); -webkit-transform: scale(1.0, 1.0); transition: all .75s ease-in-out; } #main .textimg.scalimg .swiper-container.cnt_1 img:hover { transform: scale(1.05, 1.05); -ms-transform: scale(1.05, 1.05); -webkit-transform: scale(1.05, 1.05); } #main .textimg.boxed .right .imgtext { position: absolute; right: 20px; bottom: 0px; z-index: +1; } #main .textimg.boxed .left .imgtext { position: absolute; left: 20px; bottom: 0px; z-index: +1; } #main .textimg.boxed .imgtext * { color: #fff; } /* ****************************************************************************************************************** */ /* --- ka-textimgbk ------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #main .textimg.textimgbk { background-repeat: no-repeat; background-position: center; background-size: cover; margin: 0; } #main .textimg.textimgbk .box { position: relative; width: 85%; margin: 400px 0 0 0; padding: 100px 0 0 0; background-color:var(--ka-bk-color); min-height: 800px; } #main .textimg.textimgbk .box .textblock { } #main .textimg.textimgbk .right .headline, #main .textimg.textimgbk .right .text, #main .textimg.textimgbk .right .buttons { padding: 10px 70px 00px 70px; } #main .textimg.textimgbk .left .headline, #main .textimg.textimgbk .left .text, #main .textimg.textimgbk .left .buttons { padding: 10px 70px 0px 70px; } #main .textimg.textimgbk .left .button, #main .textimg.textimgbk .right .button { padding: 0px 0px 0px 0px; } #main .textimg.textimgbk .imgblock { position: relative; padding:0px 0 0 0; } #main .textimg.textimgbk .imgblock .image_container { position: relative; top: 0; width: 100%; height: 100%; z-index: +1; } #main .textimg.textimgbk .imgblock .img2block { position: absolute; bottom: 20px; right: 20px; width: 300px; height:100px; } #main .textimg.textimgbk div.statement { width: 100%; height: 27%; position: absolute; left: 0; top: 0; pointer-events: none; display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; } #main .textimg.textimgbk div.statement .hl2 { width: 100%; max-width: 1600px; margin: 0 auto; text-align: left; font-family: Baskervville,Arial; font-size:var(--ka-statement-font-size); line-height: var(--ka-statement-line-height); letter-spacing: var(--ka-statement-letter-spacing); text-transform: uppercase; } #main .textimg.textimgbk.kids { margin-bottom: 0; } #main .textimg.textimgbk.kids div.statement { top: 100px; } #main .textimg.textimgbk.kids .box { margin: 350px 0 0 0; padding: 100px 0 100px 0; width: 43%; min-height: 200px; } #main .textimg.textimgbk.kids .box .headline, #main .textimg.textimgbk.kids .box .text, #main .textimg.textimgbk.kids .box .buttons { padding: 0px 100px 30px 100px; } #main .textimg.textimgbk.kids .box .headline { padding-bottom: 0px; margin-bottom: 0px; } #main .textimg.textimgbk.kids .box .text { } /* ****************************************************************************************************************** */ /* --- kaimgs ------------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaimgs { position: relative; width: 100%; height: 100%; margin-top: 80px; margin-bottom: 80px; } section.kaimgs .images { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; justify-content: space-between; } section.kaimgs .images.cnt_3 .image { width: calc(33.3% - 40px); } section.kaimgs .images.cnt_4 .image { width: calc(25% - 30px); } section.kaimgs .images.cnt_5 .image { width: calc(20% - 30px); } section.kaimgs .images.cnt_6 .image { width: calc(16.6% - 20px); } section.kaimgs .images .box { position: relative; line-height: 1px; } section.kaimgs .images .box img { width: 100%; height: 100%; cursor: pointer; } section.kaimgs .images .box .textbox { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-color: rgba(84,119,133,0.01); color: #fff; text-transform: uppercase; font-size: 18px; line-height: 1px; letter-spacing: 0.05em; font-weight: 600; display: flex; align-items: center; justify-content: center; text-align: center; opacity: 0; transition: all 750ms ease-in-out; /*pointer-events: none;*/ } section.kaimgs .images .box .textbox .text { line-height: 20px; width: 80%; } section.kaimgs .images .box:hover div.textbox { opacity: 1; background-color: rgba(50,50,50,0.5); } section.kaimgs .textblock { width: calc(50% - 20px); margin: 10px 20px 5px 0; } section.kaimgs .textblock .text { margin: 20px 0 35px 0; } section.kaimgs .textblock .button a { font-size: 14px; /*border-bottom: 1px solid var(--ka-font-color);*/ } /* ****************************************************************************************************************** */ /* --- kabtns ------------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaxbtns { position: relative; width: 100%; height: 100%; margin: 10px 0 20px 0; } section.kaxbtns .btnblock { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; margin: 10px 0; } section.kaxbtns .btnblock .btn { margin: 0 10px; } /* ****************************************************************************************************************** */ /* --- stayconnected ------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ section.stayconnected { position: relative; width: 100%; height: 100%; /*margin: 80px 0 0 0;*/ margin: 0 0 0 0; padding: 80px 0 80px 0; background-color:var(--ka-bk-boxlightgrey); } section.stayconnected .headline { margin-left: -100px; } section.stayconnected .hl2 { margin: 0 0 10px 0; } section.stayconnected .nldesc { margin: 10px 0 0 0; } section.stayconnected .nl .widget { margin: 20px 0; padding: 0; float: left; } section.stayconnected .nl .widget.widget-text { width: calc(100% - 120px); max-width: 100%; margin-right: 10px; } section.stayconnected .nl input.text { width: calc(100% - 20px); max-width: 100%; margin: 0 0 0 0; padding: 3px 10px 3px 10px; border:none; background-color:var(--ka-bk-boxmiddlegrey); font-family: var(--ka-font-family-bg); } section.stayconnected .nl .submit { width: auto; /*110px;*/ max-width: 100%; margin: 0 0 0 0; padding: 0; text-decoration: none; color: #000000; font-family: var(--ka-font-family-bg); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border:none; border-bottom: 1px solid #000000; transition: border 75ms linear; } section.stayconnected .nl .submit:hover { border-bottom: 4px solid #000000; } section.stayconnected .nlsub { margin: 10px 0 20px 0; } section.stayconnected .nlsub h5 { margin: 0px 0 35px 0; } #main section.stayconnected .nlsub a { /*display: inline-block;*/ margin: 10px 0 0 0; } #main section.stayconnected .nlunsub a { font-family: var(--ka-font-family); font-weight: 400; letter-spacing:0.025em; font-size: 15px; text-transform: none; } section.stayconnected .socials { display: flex; justify-content: flex-end; align-items: flex-end; } section.stayconnected .socials span { color: #000000; padding-bottom: 2px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; margin: 0 10px 0 0; } section.stayconnected .socials a { margin: 0 5px; text-decoration: none; border-bottom:none !important; } section.stayconnected .socials a img { width:24px; } section.stayconnected .images { width:100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; margin: 40px 0 0 0; padding: 0; } section.stayconnected .images.cnt_3 .image { width: calc(33.3% - 20px); padding: 0; } section.stayconnected .images.cnt_3 .image img { width:100%; object-fit: cover; } /* ****************************************************************************************************************** */ /* --- previewvideo ------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.textbk { margin: 0; padding-top: 80px; padding-bottom: 80px; background-position: center; position: relative; background-position: center; background-repeat: no-repeat; background-size: cover; } section.textbk.white *, #main section.textbk.white .statement { color: white; } #main section.textbk.white .button a, #main section.textbk.white .textimg .button a { border-bottom: 1px solid white; } section.textbk div.left, section.textbk div.right { width: 50%; } section.textbk div.left { width: calc(50% - 200px); margin: 0 100px 0 100px; flex-direction: column; } section.textbk.white div.left { width: calc(50% - 0px); margin: 0 0px 0px; } section.textbk.white div.left div.leftin { width: calc(100% - 100px); margin: 50px 0 0 100px; display: flex; flex-direction: column; } section.textbk div.right { width: calc(50% - 100px); margin: 0 0 0 100px; flex-direction: column; } section.textbk div.left .textkursiv { font-style: italic; margin: 0 0 0px 0; } section.textbk div.left .text { margin: 0 0 20px 0; max-width: 100%; /* font-size: 30px; line-height:36px; text-transform: uppercase; */ } section.textbk div.left .button { clear: both; float: none; } section.textbk div.left .text2 { margin: 60px 0 0 0; text-transform: uppercase; } section.textbk div.right { justify-content: center; align-items: center; } section.textbk div.right * { } section.textbk div.headline { color:var(--ka-font-color); font-size: var(--ka-statement-font-size); line-height: var(--ka-statement-line-height); letter-spacing: var(--ka-statement-letter-spacing); text-transform: uppercase; } section.textbk.col2 div.col2.flexcontainer { width:100%; margin: 0; padding: 0; flex-direction: row; /*justify-content: center;*/ align-items: flex-start; } section.textbk.col2 div.left, section.textbk.col2 div.right { /*width: calc(50% - 80px);*/ width:auto; padding: 0; } section.textbk.col2 div.left { margin: 0 40px 0 0; flex-direction: column; align-items: flex-end; } section.textbk.col2 div.left .headline { width:100%; text-align: left; } section.textbk.col2 div.right { margin: 0 0 0 40px; flex-direction: column; justify-content: flex-start; align-items: flex-start; } section.textbk.col2 div.li section.textbk.col2 .text, section.textbk.col2 .text * { font-family: var(--ka-font-family-basker); font-size: 24px; line-height: 38px; white-space: nowrap; } section.textbk .col2 { } /* ****************************************************************************************************************** */ /* --- kajobs ------------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ div.kajobs { position: relative; display: flex; flex-direction: column; margin: 50px 0; width: 100%; max-width:1400px; margin-right:auto; margin-left:auto; } section.kajob { position: relative; display: grid; margin: 50px 0 50px 0; } section.kajob .image_container { width: 100%; height: 100%; } section.kajob .image_container img { width: 100%; height: 100%; object-fit: cover; } section.kajob .textblock { position: relative; display: flex; flex-direction: column; padding: 10px 30%; justify-content: center; align-items: center; background-color: var(--ka-bk-boxgrey); } section.kajob .textblock .text { text-align: left; width: 100%; display: flex; margin: 80px 0 0 0; } section.kajob .textblock .buttons { display: flex; flex-direction: column; margin: 80px 0 0 0; justify-content: center; align-items: center; } section.kajob .textblock .buttons .button { margin: 20px 0; } /* ****************************************************************************************************************** */ /* --- previewvideo ------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .previewvideo { width: 100%; height: 100%; /* */ /*z-index: 950;*/ } body.fullscreenheadervideo #banner, body.fullscreenheadervideo #banner .bannerinside, body.fullscreenheadervideo .previewvideo, body.fullscreenheadervideo #banner .rsts-view, body.fullscreenheadervideo #banner .rsts-view .rsts-crop, body.fullscreenheadervideo #banner .rsts-view .rsts-slides { position: relative; width: 100%; height: 100vh !important; max-height: 100vh; } body.fullscreenheadervideo #banner .rsts-view .rsts-slide, body.fullscreenheadervideo #banner .rsts-view .rsts-slide div { position: relative; height: 100%; } body.fullscreenheadervideo #banner .rsts-view .rsts-slide div img { /* width: 100%; height: 100% !important; object-fit: cover; */ } body.fullscreenheadervideo section.kabooking { bottom: 30px; bottom: 0px; /* background-color: rgba(255,255,255,0.8); background-color: rgba(0,0,0,0.5); */ } body.fullscreenheadervideo section.kabooking * { /* color: #fff !important; */ } body.fullscreenheadervideo section.kabooking .binside { /* background-color: rgba(255,255,255,0.001); background-color: rgba(255,255,255,0.5); */ } .previewvideo, .previewvideo .insidepv, .previewvideo .prev-video-container { position: relative; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .previewvideo .prev-video-container { z-index: 951; } .previewvideo video { position: absolute; left:0; top:0; display: block; width: 100%; height: 100%; object-fit:cover; } .previewvideo .videobtn { position: absolute; top: auto; bottom: 15%; left:50%; transform: translate(-50%); /* min-width: 160px; height: 40px; */ display: flex; flex-direction:row; justify-content :center; align-items: center; padding: 15px 30px 15px 15px; /* background-color: rgba(18, 81, 105, 0.8); background-image: url('/files/intern/common/fmd-play-video-full.png'); */ background-position: 95% center; background-repeat: no-repeat; /* border-radius: 3px; */ font-size: 14px; line-height: 14px; letter-spacing: 0.02em; font-weight:400; text-transform: uppercase; color: #23bfe4; cursor: pointer; z-index:954; transition: all 500ms ease-in-out; white-space: nowrap; } #bannerimage .previewvideo .videobtn img.icon, .previewvideo .videobtn img.icon { width: 40px; height: 40px; margin: 0 15px 0 15px; transition: all .5s ease-in-out; min-height: 40px !important; } .previewvideo .videobtn:hover { /*background-color: rgba(35, 191, 228, 0.8);*/ color: #95ebff; } .previewvideo .videobtn:hover img.icon { transform: scale(1.3); } .previewvideo .videobtn.disable { display: none; } /* ****************************************************************************************************************** */ /* --- ka_bannertext ------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ section.bannertext { position:absolute; top: 50%; left: 0%; width: 100%; display: block; margin: 0; padding: 0; transform: translate(0, -50%); pointer-events: none; z-index:952; } section.bannertext .slogan * { color: #fff; } section.bannertext h1 { margin: 15px 0 5px 0; font-size: 20px; line-height: 24px; font-family: var(--ka-font-family-menu); font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; } section.bannertext h3, section.bannertext div.headline { margin-top: 10px; margin-bottom: 5px; white-space: normal; font-size: 45px; line-height: 60px; font-weight: 400; letter-spacing: 0.025em; text-transform: uppercase; font-family: var(--ka-font-family-basker); } /* ****************************************************************************************************************** */ /* --- ka_slider1 --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaslider1 { position: relative; height: 100%; display: block; margin: 80px 0 80px 0; } section.kaslider1 .swiper-container { position: relative; width: 100%; /* height: 100%; */ margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; } section.kaslider1.img1 .swiper-container { max-width: 1400px; overflow: hidden; } section.kaslider1 .swiper-wrapper { position: relative; width: 100%; /* height: 100%; */ z-index: 1; display: flex; /* das verhindert das smooth bi autoheight !!! transition-property: transform; */ box-sizing: content-box; /*align-items: flex-start;*/ } section.kaslider1 .textblock .headline { margin: 15px 0 15px 0; font-family: var(--ka-font-family-menu); font-size: 20px; line-height: 24px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; } section.kaslider1 .textblock .text { margin: 0 0 15px 0; font-family: var(--ka-font-family-basker); font-style: italic; text-transform: none; font-size: 18px; line-height: 22px; color: #7c7c7c; letter-spacing: 0.025em; font-weight: 400; } section.kaslider1 .textblock span { border-bottom: 1px solid var(--ka-font-color); } section.kaslider1 .swiper-button-prev { position:absolute; width:20px; height:70px; top:calc(50% - 70px); left:calc(50% - 665px); background-image:url("/files/intern/common/pfeil-slider-links.svg"); background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; cursor:pointer; z-index: +1; } section.kaslider1 .swiper-button-next { position:absolute; width:20px; height:70px; top:calc(50% - 70px); left:calc(50% + 630px); background-image:url("/files/intern/common/pfeil-slider-rechts.svg"); background-repeat: no-repeat; background-position: center; background-position: right center; transition: background-position 0.5s ease-in-out; cursor:pointer; z-index: +1; } section.kaslider1.markergrey .swiper-button-prev { background-image:url("/files/intern/common/pfeil-slider-links-grey.svg"); } section.kaslider1.markergrey .swiper-button-next { background-image:url("/files/intern/common/pfeil-slider-rechts-grey.svg"); } /* img1 */ section.kaslider1.img1 .swiper-slide { width: 100%; max-width: 1400px; height: 100%; position: relative; transition-property: transform; display: flex; justify-content: center; align-items: center; flex-direction:column; /* flex-shrink: 0; */ opacity: 0.01; opacity: 1; margin: 0; overflow: hidden; height: calc(100% - 0px); transition: all 0.5s ease-out; flex-shrink: 0; width: 100%; /* height: 100%; */ position: relative; transition-property: transform; } section.kaslider1.img1 .swiper-slide.swiper-slide-active, section.kaslider1.img1 .swiper-slide.swiper-slide-duplicate-active { opacity: 1; } section.kaslider1.img1 .swiper-slide .container_img1 { width: 100%; } section.kaslider1.img1 .container_img1 h3, section.kaslider1.img1 .container_img1 .text { margin: 30px 0 0 0; padding: 0 100px; } section.kaslider1.img1 .container_img1 .text { font-family: var(--ka-font-family-basker); font-style: italic; text-transform: none; font-size: 18px; line-height: 22px; color: #7c7c7c; letter-spacing: 0.025em; font-weight: 400; } /* section.kaslider1.img1 .container_img3o { display: none; } section.kaslider1.img1 .swiper-button-prev { left:calc(50% - 465px); } */ /* img3o */ section.kaslider1.img3o { /* min-height:920px !important; */ margin: 80px 0 30px 0; } .limit1200 section.kaslider1.img3o { /*min-height:900px;*/ } section.kaslider1.img3o .swiper-slide { width: 100%; max-width: 1200px; position: relative; display: flex; flex-direction:column; flex-shrink: 0; opacity: 0.01; margin: 0 0 0 0; padding: 0px; margin-top: 0px; overflow: hidden; transition: margin-top 1000ms ease-in-out; transition-property: transform; } section.kaslider1.img3o .swiper-slide.swiper-slide-prev, section.kaslider1.img3o .swiper-slide.swiper-slide-next { opacity: 0.3; margin-top: 80px; transition: margin-top 500ms ease-in-out; /*transition: opacity 1000ms ease-in-out;*/ } section.kaslider1.img3o .swiper-slide.swiper-slide-active, section.kaslider1.img3o .swiper-slide.swiper-slide-duplicate-active { opacity: 1; margin-top: 0px; -webkit-transition: margin-top 500ms ease-in-out; -moz-transition: margin-top 500ms ease-in-out; -o-transition: margin-top 500ms ease-in-out; transition: margin-top 500ms ease-in-out; /*transition: opacity 1000ms ease-in-out;*/ } section.kaslider1.img3o .swiper-slide.swiper-slide-active.animated, section.kaslider1.img3o .swiper-slide.swiper-slide-duplicate-active.animated, section.kaslider1.img3o .swiper-slide.animated { /*background-color:#f00;*/ -webkit-transition: margin-top 1000ms ease-in-out; -moz-transition: margin-top 1000ms ease-in-out; -o-transition: margin-top 1000ms ease-in-out; transition: margin-top 1000ms ease-in-out; /*transition: all 5000ms ease-in-out;*/ margin-top: 0px; } section.kaslider1.img3o .swiper-slide .textblock { position: relative; width:100%; background-color: var(--ka-footer-bk-light); margin: 0px 0; padding: 20px 100px 40px 100px; display: inline-block; opacity: 0.01; transition: opacity 2s linear; } section.kaslider1.img3o .swiper-slide .textblock .tbinside { margin-top:40px; transition: margin 2s linear; } section.kaslider1.img3o .swiper-slide.swiper-slide-active .textblock .tbinside, section.kaslider1.img3o .swiper-slide.swiper-slide-duplicate-active .textblock .tbinside { margin-top:0px; } section.kaslider1.img3o .swiper-slide.swiper-slide-active .textblock, section.kaslider1.img3o .swiper-slide.swiper-slide-duplicate-active .textblock { opacity: 1; } section.kaslider1.img3o .container_img1 { display: none; } section.kaslider1.img3o .swiper-button-prev, section.kaslider1.img3o .swiper-button-next { top:300px; } section.kaslider1.img3o .swiper-button-prev { left:calc(50% - 565px); } section.kaslider1.img3o .swiper-button-next { left:calc(50% + 530px); } .limit1200 section.kaslider1.img3o .swiper-button-prev, .limit1200 section.kaslider1.img3o .swiper-button-next { top:220px; } /* .limit800 section.kaslider1.img1 .swiper-slide { max-width: 800px; } .limit1000 section.kaslider1.img1 .swiper-slide { max-width: 1000px; } .limit1200 section.kaslider1.img1 .swiper-slide { max-width: 1200px; } */ .limit800 section.kaslider1 .swiper-button-prev { left: calc(50% - 365px); } .limit800 section.kaslider1 .swiper-button-next { left: calc(50% + 330px); } .limit1000 section.kaslider1 .swiper-button-prev { left: calc(50% - 465px); } .limit1000 section.kaslider1 .swiper-button-next { left: calc(50% + 430px); } .limit1200 section.kaslider1 .swiper-button-prev { left: calc(50% - 565px); } .limit1200 section.kaslider1 .swiper-button-next { left: calc(50% + 530px); } /* ****************************************************************************************************************** */ /* --- kaslider4 ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaslider4 { position: relative; display: flex; margin: 50px 0; } section.kaslider4 .swiper-container { padding: 0 0 60px 0; } section.kaslider4 .swiper-slide { position: relative; display: flex; justify-content: center; align-items: center; height: 100%; } section.kaslider4 .swiper-slide img { /*min-height: 300px;*/ } section.kaslider4 .swiper-button-prev, section.kaslider4 .swiper-button-next { position: absolute; top: auto; bottom: 0px; left: auto; right: auto; width: 30px !important; height: 30px !important; } section.kaslider4 .swiper-button-prev { left: calc(50% - 20px); } section.kaslider4 .swiper-button-next { left: calc(50% + 20px); } /* ****************************************************************************************************************** */ /* --- kacircleslider ----------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kacircleslider { position: relative; display: flex; margin: 50px 0 120px 0; } section.kacircleslider .limit1400 { position: relative; } section.kacircleslider .image_container { position: absolute; left: -200px; top: 50%; width: 500px; height: 500px; transform: translate(0, -50%); z-index: +1; } section.kacircleslider .image_container img { width: 100%; height: 100%; object-fit: cover; } section.kacircleslider .swiperbox { position: relative; z-index: 0; overflow: visible; } section.kacircleslider .circleslider { overflow: hidden; */ /* overflow: visible; */ } section.kacircleslider .swiper-slide { position: relative; height: auto; display: flex; justify-content: center; } section.kacircleslider .swiper-slide .textbox { position: relative; display: flex; flex-direction: column; background-color: var(--ka-bk-lightbrown); padding: 40px 40px 40px 380px; width: 100%; height: 100%; justify-content: center; } section.kacircleslider .swiper-slide .textbox > .grid { margin: 0 0 60px 0; } section.kacircleslider .swiper-slide .textbox .flexcontainer { position: relative; width: 100%; /* oder feste Breite */ margin: 0 auto; } section.kacircleslider .swiper-slide .textblock { display: flex; flex-direction: column; width: 100%; /* wichtig für inline-block innerhalb multi-column */ } section.kacircleslider .swiper-slide .textbox h3.headline { margin-bottom: 60px; } section.kacircleslider .swiper-slide .textblock .subheadline { margin: 0 0 20px 0; font-size: 32px; line-height: 38px; font-family: var(--ka-font-script); color: var(--ka-font-color-orange); text-transform: none; } section.kacircleslider .swiper-button-prev, section.kacircleslider .swiper-button-next { position:absolute; width:34px; /*height:54px;*/ top:auto; bottom: -80px; right: auto; background-size: 100%; background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; } section.kacircleslider .swiper-button-prev { left:calc(50% - 25px); background-image:url("/files/intern/common/pfeil-slider-links-grey.svg"); } section.kacircleslider .swiper-button-next { left: auto; right:calc(50% - 25px); background-image:url("/files/intern/common/pfeil-slider-rechts-grey.svg"); } /* ****************************************************************************************************************** */ /* --- kaflipcard --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaflipcard { position: relative; display: flex; flex-direction: column; margin: 0px 0 0px 0; } section.kaflipcard.grid { background-color: var(--ka-bk-brown); padding: 100px 0 150px 0; } section.kaflipcard.masonry { background-color: var(--ka-bk-darkgrey); padding: 100px 0 150px 0; } section.kaflipcard.masonry.white { background-color: var(--ka-bk-color); padding: 50px 0 50px 0; } section.kaflipcard .flipbox { position: relative; } section.kaflipcard .headerbox { position: relative; margin: 0 0 100px 0 ; } section.kaflipcard.grid .headerbox .headline { /* font-size: 300px; line-height: 300px; font-size: 9vw; */ font-size: clamp(1rem, 9vw, 300px); line-height: 300px; color: #fff; text-transform: uppercase; font-family: var(--ka-font-family-basker); color:#ebd6c9; } section.kaflipcard.masonry .headerbox .headline { font-size: 32px; line-height: 36px; /*color: #fff;*/ text-transform: uppercase; font-family: var(--ka-font-family-basker); } section.kaflipcard.grid .headerbox .text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: +1; font-size: 30px; line-height: 36px; text-transform: uppercase; width: 80%; max-width: 800px; font-family: var(--ka-font-family-basker); } section.kaflipcard.masonry .headerbox .text, section.kaflipcard.masonry .headerbox .text * { position: relative; font-size: 26px; line-height: 34px; text-transform: uppercase; color: var(--ka-font-color-orange); } section.kaflipcard.masonry .headerbox .text h4 { font-family: var(--ka-font-script); color: var(--ka-bk-darkbrown); text-transform: none; font-size: 48px; line-height: 56px; letter-spacing: 0; } section.kaflipcard .flips { position: relative; display: grid; grid-column-gap: 80px; grid-row-gap: 80px; width: 100%; } section.kaflipcard.grid .flips { grid-template-columns: 1fr 1fr; width: 100%; } section.kaflipcard.masonry .flips { grid-template-columns: 1fr 1fr 1fr; } section.kaflipcard.grid .flip-container, section.kaflipcard.masonry .flip-container { perspective: 1000px; width: 100%; height: 100%; position: relative; display: flex; flex-direction: column; aspect-ratio: 1 / 3; } section.kaflipcard.grid .flip-container { max-height: 400px; } section.kaflipcard.masonry .flip-container { max-height: 650px; } section.kaflipcard.grid .flipper, section.kaflipcard.masonry .flipper { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform 1.5s; } section.kaflipcard .flip-container:hover .flipper { transform: rotateY(180deg); } section.kaflipcard .front, section.kaflipcard .back { backface-visibility: hidden; position: absolute; width: 100%; height: 100%; top: 0; left: 0; cursor: pointer; } section.kaflipcard .front { z-index: 2; transform: rotateY(0deg); } section.kaflipcard .front .name { display: none; } section.kaflipcard.masonry .front .name { position: absolute; left: auto; top: auto; right: 10px; bottom: 10px; display: flex; font-family: var(--ka-font-script); color: var(--ka-font-color-script); text-transform: none; z-index: +1; pointer-events: none; font-size: 36px; line-height: 40px; } section.kaflipcard .front img { width: 100%; height: 100%; object-fit: cover; } section.kaflipcard .back { transform: rotateY(180deg); z-index: 1; background-color: var(--ka-bk-darkbrown); } section.kaflipcard .back h3 { font-size: 16px; color: #fff; text-align: left; } section.kaflipcard.masonry .back h3 { text-align: left; } section.kaflipcard.masonry .back { transform: rotateY(180deg); z-index: 1; background-color: var(--ka-bk-darkgrey); border: 2px solid var(--ka-bk-darkbrown); text-align: center; } section.kaflipcard.masonry .back .headline { text-transform: uppercase; font-size: 20px; line-height: 26px; margin: 0 0 30px 0; } section.kaflipcard .back { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; padding: 50px 70px; width: calc(100% - 140px); height: calc(100% - 100px); } section.kaflipcard.masonry .back { padding: 50px 50px; width: calc(100% - 100px); height: calc(100% - 100px); text-align: left; } section.kaflipcard.grid .subheadline, section.kaflipcard.masonry.white .subheadline { position: relative; margin: 20px 0 0 0; width: 100%; display: flex; justify-content: center; text-transform: uppercase; font-size: 24px; letter-spacing: 0.0em; } section.kaflipcard.masonry.grey .subheadline { display: none; } /* ****************************************************************************************************************** */ /* --- katextimg2col ------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ :root { --ka-katextimg2colpadding:60px; } section.katextimg2col { position: relative; display: flex; flex-direction: column; overflow: visible; height: auto; position: relative; margin: 50px 0 50px 0; padding: 50px 0 80px 0; background-color: var(--ka-bk-lightgreen); } section.katextimg2col .textblocks { margin: 50px 0 50px 0; position: relative; display: flex; flex-wrap: wrap; } section.katextimg2col .textblocks .textimg-container { position: relative; display: flex; flex-direction: column; height: auto; width: 50%; margin-bottom: var(--ka-katextimg2colpadding); } section.katextimg2col .textblocks .textimg-container.bg-green { background-color: var(--ka-bk-green); } section.katextimg2col .textblocks .textimg-container .borderblock { position: relative; display: flex; flex-direction: column; width: calc(100% - 2 * var(--ka-katextimg2colpadding)); height: 100%; padding: 0px var(--ka-katextimg2colpadding); } section.katextimg2col .textblocks .textimg-container.borderleft .borderblock { padding: 60px 0px 0 120px; } section.katextimg2col .textblocks .textimg-container.borderright .borderblock { padding: var(--ka-katextimg2colpadding) 120px var(--ka-katextimg2colpadding) 0px; } section.katextimg2col .textblocks .textimg-container .textbox { position: relative; padding-right: var(--ka-katextimg2colpadding); } section.katextimg2col .textblocks .textimg-container.borderleft .textbox { /*padding: 0 60px 40px 0;*/ } section.katextimg2col .textblocks .textimg-container.borderright .textbox { /*padding: 0 0 40px 60px;*/ } section.katextimg2col .textblocks .textimg-container .image_container { margin-top: var(--ka-katextimg2colpadding); width: 100%; height: 100%; } section.katextimg2col .textblocks .textimg-container .image_container img { width: 100%; height: 100%; object-fit: cover; } section.katextimg2col .textblocks .textimg-container.imgtop { padding-top: 0; /*padding-bottom: var(--ka-katextimg2colpadding);*/ } section.katextimg2col .textblocks .textimg-container.imgtop .textbox { order:2; } section.katextimg2col .textblocks .textimg-container.imgtop .image_container { margin-top: 0px; order:1; } /* ****************************************************************************************************************** */ /* --- kastatement --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kastatement { position: relative; display: flex; flex-direction: column; overflow: visible; height: auto; position: relative; margin: 0; padding: 100px 0 130px 0; background-color: var(--ka-bk-lightbrown); } section.kastatement .headerbox { position: relative; margin: 30px 0 100px 0; } section.kastatement .statements { overflow: visible; height: auto; position: relative; } section.kastatement.line .statements { } section.kastatement .singlestatement { position: relative; display: flex; flex-direction: column; justify-content: center; } section.kastatement .singlestatement * { width: 100%; text-align: center; } section.kastatement .singlestatement img { height: 70px; width: auto; object-fit: cover; } section.kastatement .singlestatement .headline { margin: 30px 0 30px 0; color: var(--ka-font-color-orange); font-size: 20px; line-height: 24px; text-transform: uppercase; } section.kastatement .singlestatement .subheadline { margin: 0px 0 20px 0; /*color: var(--ka-font-color-orange);*/ font-size: 20px; line-height: 22px; text-transform: uppercase; } section.kastatement.line .headline { margin: 30px 0 20px 0; color: var(--ka-font-color-orange); font-size: 24px; line-height: 28px; text-transform: none; font-family: var(--ka-font-script); } section.kastatement.line .singlestatement { opacity: 0; animation: fadeInBase 0.8s ease-out forwards; animation-delay: 0.2s; /* animation-duration: 0.8s; animation-fill-mode: forwards; animation-timing-function: ease-out; */ flex: 1; margin: 0; /*background: var(--ka-bk-lightbrown2);*/ padding: 40px 20px; border-top: 1px solid #f4b183; border-bottom: 1px solid #f4b183; /*box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.1);*/ opacity: 0; animation: fadeIn 1s ease-out forwards; } section.kastatement.line .singlestatement img { height: 32px; width: auto; object-fit: cover; } section.kastatement.line .fade-in-left { animation-name: fadeInLeft; } section.kastatement.line .fade-in-up { animation-name: fadeInUp; } section.kastatement.line .fade-in-right { animation-name: fadeInRight; } @keyframes fadeInLeft { from { opacity: 0; transform: translateX(-50px); } to { opacity: 1; transform: translateX(0); } } @keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } @keyframes fadeInRight { from { opacity: 0; transform: translateX(50px); } to { opacity: 1; transform: translateX(0); } } /* ****************************************************************************************************************** */ /* --- kaaccs --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kaaccs { position: relative; display: flex; flex-direction: column; margin: 50px 0 50px 0; } section.kaaccs .headerbox { position: relative; margin: 100px 0; } section.kaaccs.grid .headerbox .headline { font-size: 150px; line-height: 150px; color: #fff; text-transform: uppercase; } section.kaaccs .headerbox .text { /* font-size: 26px; line-height: 34px; */ text-transform: uppercase; } section.kaaccs .headerbox .download { display: flex; flex-direction: column; justify-content: center; align-items: center; margin: 30px 0 0 0; } section.kaaccs .blockaccs { position: relative; display: flex; flex-direction: column; } section.kaaccs .blockaccs .acc { position: relative; display: flex; flex-direction: column; } section.kaaccs .blockaccs .acc .headblock { position: relative; display: block; /* justify-content: center; align-items: center; */ width: 100%; min-height: 330px; cursor: pointer; } section.kaaccs .blockaccs .acc .headblock * { text-decoration: none; border: none; } section.kaaccs .blockaccs .acc .headblock .headline { position: relative; padding: 30px; color: #fff; display: flex; z-index: +2; pointer-events: none; font-family: var(--ka-font-family-basker); font-size: 30px; line-height: 34px; text-transform: uppercase; /*text-align: center;*/ } #main section.kaaccs .blockaccs .acc .headblock a.plus { position: absolute; top: auto; left: 50%; bottom: 10px; display: flex; flex-direction: column; justify-content: center; align-items: center; transform: translate(-50%, 0); font-size: 50px; color: #fff; text-decoration: none; transition: all 0ms linear; padding: 0; border-bottom: 0px solid var(--ka-font-color); } #main section.kaaccs .blockaccs .acc .headblock a.plus:hover { text-decoration: none; border: none; } section.kaaccs .blockaccs .acc .headblock .image_container, section.kaaccs .blockaccs .acc .headblock .imgshadow { position: absolute; top: 0; left: 0; display: flex; width: 100%; height: 100%; padding: 0; margin: 0; z-index: -1; pointer-events: none; transition: all 1.1s; } section.kaaccs .blockaccs .acc .headblock:hover .imgshadow { background-color: rgba(0,0,0,0); } section.kaaccs .blockaccs .acc .headblock:hover * { background-color: rgba(0,0,0,0); text-decoration: none; border: none; } section.kaaccs .blockaccs .acc .headblock .image_container picture { width: 100%; height: 100%; } section.kaaccs .blockaccs .acc .headblock .image_container img { width: 100%; height: 100%; object-fit: cover; } section.kaaccs .blockaccs .acc .headblock .imgshadow { background-color: rgba(0,0,0,0.5); z-index: 0; transition: background-color 0.8s ease; } section.kaaccs .blockaccs .acc .ka_accordion, section.kaaccs .blockaccs .acc .ce_accordion { margin: 0px 0; background-color: var(--ka-acc-rosebeige); } section.kaaccs .blockaccs .acc .ka_accordion .dist { background-color: #fff; height: 5px; } section.kaaccs .blockaccs .acc .ka_accordion .toggler, section.kaaccs .blockaccs .acc .ce_accordion .toggler { margin: 4px 0 0px 0; padding: 18px 20px 15px 20px; border: 0px solid #fff; font-size:16px; line-height:20px; font-family: var(--ka-font-family-menu); font-weight: 600; letter-spacing: 0.01em; text-transform:uppercase; } section.kaaccs .blockaccs .acc .ka_accordion .accordion, section.kaaccs .blockaccs .acc .ce_accordion .accordion { margin: 0; padding: 0; } section.kaaccs .blockaccs .acc .ka_accordion .accordion .text, section.kaaccs .blockaccs .acc .ce_accordion .accordion .text { padding: 5px 20px 15px 20px; } section.kaaccs .blockaccs .acc .ka_accordion .toggler, section.kaaccs .blockaccs .acc .ka_accordion .accordion, section.kaaccs .blockaccs .acc .ce_accordion .toggler, section.kaaccs .blockaccs .acc .ce_accordion .accordion { /*background-color: rgba(0,0,0,0.5);*/ background: transparent; } section.kaaccs .blockaccs .acc .accordion { transition: max-height 0.5s ease; } section.kaaccs .blockaccs .acc.open .accordion { } section.kaaccs .blockaccs .acc .ka_accordion .toggler { cursor: pointer; } section.kaaccs .blockaccs .acc .ka_accordion .accordion { max-height: 0; overflow: hidden; transition: max-height 1s ease; } section.kaaccs .blockaccs .acc .ka_accordion .toggler.active + .accordion { /* Du kannst hier eine maximale geschätzte Höhe setzen (z. B. 500px), */ /* oder es über JS dynamisch machen (siehe unten) */ max-height: 500px; } /* .bg-goldgelb { background-color: var(--ka-acc-goldgelb) !important; } .bg-maisgelb { background-color: var(--ka-acc-maisgelb) !important; } .bg-safrangelb { background-color: var(--ka-acc-safrangelb) !important; } .bg-sandbeige { background-color: var(--ka-acc-sandbeige) !important; } .bg-rosebeige { background-color: var(--ka-acc-rosebeige) !important; } */ /* ****************************************************************************************************************** */ /* --- xxx ------------------------------------------------------------------------------------------------------ */ /* ****************************************************************************************************************** */ #main .bepartofit { display: block; padding-top: 120px; padding-bottom: 90px; background-position: center; } #main .bepartofit h2 { color:#ffffff; font-size: 36px; line-height: 40px; font-weight: 400; text-transform: uppercase; } #main .bepartofit .right h2 { color:#22c0e6; font-size: 20px; line-height: 24px; font-weight: 400; letter-spacing: 0; text-transform: uppercase; margin-bottom: 20px; } #main .bepartofit a { display: inline-block; color:#22c0e6; font-size: 20px; line-height: 24px; font-weight: 400; text-transform: uppercase; margin-top: 20px; padding: 5px 10px 5px 10px; } #main .bepartofit div, #main .bepartofit div p { font-size: 18px; line-height: 22px; color:#ffffff; } #main .experts { display: flex; flex-wrap: wrap; /* flex-direction:row; justify-content: space-between; display: inline-block; margin-left: auto; margin-right: auto; max-width: 1600px; */ text-align: left; } #main .experts > *, #main .expert { /* float:left; width: calc(33% - 5px); margin-bottom: 20px; flex: 1 1 calc(33% - 5px); */ padding: 10px; flex: 1 0 calc(33% - 10px); box-sizing: border-box; margin-bottom: 30px; } #main .expert div, #main .expert p { } #main .expert div.name { margin-top: 30px; font-weight: 600; } #main .experts video { width: 100%; } #main .experts .socials { margin-top: 8px; } .controlBar { display: none; } #main .blueboxes { position: relative; display: flex; flex-direction:row; justify-content: space-between; text-align: left; padding: 0 10px 0 10px; z-index: 1; } #main .bluebox { position: relative; width: calc(33% - 15px); background-color: #000000; min-height: 550px; text-align: center; margin: 0; border: 0; /*border: 1px solid #ffffff;*/ overflow: hidden; } #main .bluebox div, #main .bluebox p { color:#ffffff; font-size: 15px; line-height: 19px; } #main .bluebox.weiss { background-color: #bcbcbc; } #main .bluebox.grau1 { background-color: #34404e; } #main .bluebox.grau2 { background-color: #262e3c; } #main .bluebox.hellblau { background-color: #125169; } #main .bluebox.blau { background-color: #1c293b; } #main .bluebox.dunkelblau { background-color: #0f141d; } #main .bluebox.lila { background-color: #23bfe4; } #main .bluebox.rot { background-color: #a4472c; } #main .bluebox.lila h5 { color: #ffffff; } #main .bluebox .textbox { width: 100%; height: 100%; position: absolute; top: 0; left: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; justify-content :center; flex-direction:column; } #main .bluebox .textbox p { line-height: 25px; } #main .bluebox.oben .image_container { position: absolute; top: 0; /*z-index: -1;*/ } #main .bluebox.unten .image_container { position: absolute; bottom: -5px; /*z-index: -1;*/ } #main .bluebox .headlinecolor { opacity: 0; position: absolute; top: -20px; left:20px; z-index: 905; font-size: 60px; transition: 0.5s; } #main .bluebox a { position: absolute; bottom: 20px; right: 20px; z-index: 915; font-size: 24px; transition: 0.5s; border: 1px solid #ffffff; background-color: #ffffff; padding: 8px 15px 8px 15px; transform: translateY(30px); opacity: 0; visibility: hidden; } #main .imgmain { background-color: #f6f2ec; padding-top: 40px; padding-bottom: 30px; margin-bottom: 40px; display: block; } #main .moving { font-size: 24px; font-family: Open Sans, Arial; font-weight: 600; text-transform: uppercase; color: #000000; letter-spacing: 0.07em; margin-bottom: 40px; } .left1200 #main .inside { text-align: left; max-width: 1200px; margin-left: auto; margin-right: auto; } .floatleft .rsts-skin-default.rsts-main { /*width: 33%;*/ float:left; } .floatleft .rsts-slide { /*position: relative;*/ } .floatleft .rsts-slide div { height: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; } .floatleft .rsts-slide div .boxgrey.center { padding-left: 10%; padding-right: 10%; height: 100%; } /* ****************************************************************************************************************** */ /* --- mod_newscategories ------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ div#newscat { position: relative; width: 100%; margin: 20px 0 20px 0; display: block; scroll-margin-top: 250px; } div#catanker, div#newscat::before { position: absolute; top:-170px; /* content: ''; display: block; height: 125px; margin-top: -125px; visibility: hidden; */ } /* .mod_newscategories { width: 100%; margin: 80px 0 40px 0; display: flex; } */ .mod_newscategories ul { max-width: 1200px; margin: 0 auto; padding: 0; display: flex; } .mod_newscategories ul li { list-style-type: none; margin: 0 5px; padding:0; } .mod_newscategories ul li strong, .mod_newscategories ul li a { display: inline-block; min-width: 40px; border: 1px solid var(--ka-font-color); text-align: center; padding: 10px 15px; color: var(--ka-font-color); font-family: var(--ka-font-family-menu); font-size: 12px; line-height: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; } .mod_newscategories ul li strong { background-color: var(--ka-font-color); color: #fff; border: 1px solid var(--ka-font-color); } /* ****************************************************************************************************************** */ /* --- news-entry --------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .news-entry.col3 { display: flex; flex-direction:row; justify-content: space-between; margin-bottom: 40px; width: 100%; } .news-entry.col3 .news-date { position: relative; display: flex; flex-direction: row; width: 15%; justify-content: center; align-items: center; background-color: #88A89F; font-size: 30px; font-weight: 600; color: #ffffff; } .news-entry.col3 .rightblock { width: 85%; display: flex; flex-direction:row; justify-content: center; /*justify-content: space-between;*/ } .news-entry.col3 .news-date span { position: absolute; top:50%; left:50%; transform: translate(-50%, -50%); } .news-entry.col3 .news-image { width: 30%; height: 100%; overflow: hidden; } .news-entry.col3 .news-image img { width: 100%; height: 100%; object-fit: cover; } .news-entry.col3 .news-text { flex-direction:column; text-align: left; padding: 50px 50px 50px 50px; width: calc(70% - 100px); background-color: #ffffff; } .news-entry.col3 .news-text span.datetime { margin: 0px 0 16px 0; font-size: 16px; font-weight: 900; color: #88A89F; } .news-entry.col3.nodate .news-text span.datetime { display: none; } .news-entry.col3 .subHeadline { margin: 0px 0 16px 0; font-size: 18px; font-weight: 600; line-height: 22px; letter-spacing: .1em; text-transform:uppercase; } .news-entry.col3 .news-text h4 { margin: 0 0 16px 0; font-size: 24px; font-weight: 600; line-height: 28px; letter-spacing:.1em; } .news-entry.col3 .rightblock .sameline1 { display: flex; flex-direction: row; flex-wrap: wrap; } .news-entry.col3 .news-text p.more { margin-top: 5px; } .news-entry.col3 ul.enclosure { margin:20px 0 0 0; padding: 0; } #main .news-entry.col3 .enclosure li { list-style-type: none; } .news-entry.col3 .rightblock .sameline1 p.more, .news-entry.col3 .rightblock .sameline1 ul.enclosure { margin:20px 30px 0 0; } /* ****************************************************************************************************************** */ /* --- news_list ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #banner .mod_article, #banner .mod_newslist { width: 100%; height: 100%; display: grid; } #banner .mod_newslist .news-entry.col4 { width: 100%; position: relative; } #banner .mod_newslist .news-entry.col4 .newsbloginside { width: 100%; height: 100%; display: inline-block; position: relative; } #banner .mod_newslist .news-entry.col4 .subHeadline1, #banner .mod_newslist .news-entry.col4 .teaser1 { display: none; } #banner .mod_newslist .news-entry.col4 .blogimage { position: absolute; top: 0; left:0; width: 100%; height: 100%; } #banner .mod_newslist .news-entry.col4 .blogimage img { width: 100%; height: 100%; object-fit: cover; } #banner .mod_newslist .news-entry.col4 .blogtext { position: absolute; top: auto; bottom: 0; width: 100%; padding: 75px 0; background-image: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,0.8)); display: flex; flex-direction:column; align-items: center; justify-content: center; } #banner .mod_newslist .news-entry.col4 .blogtext * { color: #fff; } #banner .mod_newslist .news-entry.col4 .blogtext h4 { margin-top: 10px; margin-bottom: 30px; white-space: normal; font-size: 60px; line-height: 66px; font-weight: 300; color: #fff; letter-spacing: 0em; text-transform:none; font-family: Playfair Display,Arial; } #banner .mod_newslist .news-entry.col4 .blogtext .teaser { width: 80%; display: flex; flex-direction:row; align-items: center; justify-content: center; text-align: center; } #banner .mod_newslist .news-entry.col4 .blogtext a { text-transform:uppercase; } #main .mod_newslist { max-width:1400px; margin:80px auto; display: flex; flex-direction:row; flex-flow: row wrap; justify-content: space-between; } #main .mod_newslist.presse { justify-content: flex-start; } #main .mod_newslist::after { content: ""; width:calc(25% - 10px); } /* #main .mod_newslist::before { content: ""; width:calc(25% - 10px); } */ #main .mod_newslist .news-entry.col4 { display: flex; align-items: flex-start; position: relative; float:left; margin:0 0 20px 0; padding: 0; width:calc(25% - 30px); /*background-color: #fff;*/ } #main .mod_newslist.forcecol3 .news-entry.col4 { width:calc(33.3% - 30px) !important; } #main .mod_newslist .news-entry.col4 .news-block { position: relative; display: flex; flex-direction:column; width: 100%; } #main .mod_newslist .news-entry .news-block .news-image { position: relative; line-height: 1px; font-size: 1px; display: flex; width: 100%; height: 100%; height: calc(100% - 2px); min-height: 320px; overflow:hidden; } #main .mod_newslist.forcecol3 .news-entry .news-block .news-image { min-height: 433px; } #main .mod_newslist .news-entry .news-block .news-image a { white-space: normal; } #main .mod_newslist .news-entry .news-block .subHeadline { position: absolute; right: 0; bottom: 5px; font-size: 12px; line-height: 12px; color: #fff; /*white-space: pre;*/ padding-left: 5px; } #main .mod_newslist .news-entry .news-block .news-image a { /* */ position: absolute; top: 0; left: 0; width: 100%; height: 100%; line-height: 1px; font-size: 1px; text-decoration:none; border-bottom: 0px solid #ffffff; } #main .mod_newslist .news-entry .news-block .news-image a img { width: 100%; object-fit: cover; } #main .mod_newslist .news-entry .news-block .news-hover { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; display: flex; z-index: +1; transition: all 750ms ease-in-out; background-color: rgba(84,119,133,0.01); cursor: pointer; } #main .mod_newslist .news-entry .news-block .news-image:hover .news-hover { /*display: block;*/ /*background-color: rgba(84,119,133,0.5);*/ background-color: rgba(50,50,50,0.5); } #main .mod_newslist .news-entry .news-block .news-text { position: relative; width: 100%; } #main .mod_newslist .news-entry .news-block .news-text { position: relative; width: calc(100% - 15px); } #main .mod_newslist .news-entry .news-block .news-hover div { color: #fff; text-transform: uppercase; font-size: 18px; line-height: 20px; letter-spacing: 0.05em; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; opacity: 0; transition: all 750ms ease-in-out; /*pointer-events: none;*/ } #main .mod_newslist .news-entry .news-block:hover .news-hover div { opacity: 1; } #main .mod_newslist.kaflt .news-entry.kaflt_disable { display: none; } .mod_newslist .news-entry.blogtext { padding: 12%; } .mod_newslist .news-entry .blogtext .headline, .blogdetails .katdatetime .headline { margin-right: 10px; } .mod_newslist .news-entry .blogtext .headline::after, .blogdetails .katdatetime .headline::after { margin-left: 10px; content: "|"; /*background-color: red;*/ } .mod_newslist .news-entry .blogtext .datetime { } .mod_newslist .news-entry .blogtext h4 { margin: 20px 0 30px 0; font-family: Playfair Display,Arial; text-transform:none; font-size: 26px; line-height: 30px; letter-spacing: 0em; font-weight: 700; } .mod_newslist .news-entry .blogtext .more { margin: 30px 0 0 0; } /* ****************************************************************************************************************** */ /* --- news_latest_blog --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .news-blog.col3 { width: calc(33.2% - 30px); position: relative; margin: 20px 30px 30px 0; } .news-blog .newsbloginside { width: 100%; height: 100%; display: inline-block; position: relative; } .news-blog.col3 .blogtext p.more { margin-top: 15px; } .news-blog .hidden { display: none; } #main .mod_newslist div.dateyear { font-size: 20px; line-height:24px; font-weight: 600; width: 100%; margin: 20px 0 10px 0; } /* ****************************************************************************************************************** */ /* --- blogdetails -------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .mod_newsreader .layout_full.blogdetails { width: 100%; height: 100%; } .blogdetails { position: relative; /* max-width: 1200px; margin: 30px auto; background-color: #fff; padding: 30px 3%; */ } .blogdetails .blogimage { /* position: relative; width: 100%; max-height: 66vh; margin: 0; padding: 0; overflow: hidden; */ font-size: 1px; line-height: 1px; width: 100%; height: 100%; } .blogdetails .blogimage img { width: 100%; height: 100%; object-fit: cover; } .blogdetails .blogimage .imgheadline { position: absolute; top: 50%; left: 0%; width: 100%; display: block; margin: 0; padding: 0; transform: translate(0, -50%); pointer-events: none; z-index: 952; } .blogdetails .blogimage .imgheadline > div { text-align: left; } .blogdetails .blogimage .imgheadline h1 { color: #fff; } .blogdetails .blogimage .subHeadline { position: absolute; right:5px; bottom: 5px; color: #fff; line-height: 20px; font-size: 16px; font-weight: 600; } .blogdetails .blogtext { margin: 30px 0; background-color: #fff; padding: 30px 0; } .blogdetails .blogsharebuttons { margin: 40px 0; padding: 0; display: flex; flex-direction:column; align-items: center; justify-content: center; display: none; } .blogdetails.back { margin: 40px 0 80px 0; min-height: 30px; padding: 0; display: flex; flex-direction:column; align-items: center; /*justify-content: center;*/ } #bannerimage .blogdetails.back { display: none; } .blogdetails .blogsharebuttons .headline { margin: 0 0 15px 0; } .blogdetails .katdatetime { display: flex; align-items: center; justify-content: center; } .blogdetails h1.headline { text-align: left; /* width: 100%; margin: 30px 0; */ } .blogdetails .blogsharebuttons * { border-style: none !important; list-style-type: none !important; } /* ****************************************************************************************************************** */ /* --- kabooking ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kabooking { width: 90%; width: auto; max-width: 1400px; position: absolute; bottom: -90px; left: 50%; transform: translateX(-50%); padding: 0; margin: 0 0 0 0; box-shadow: 10px 10px 10px rgba(100,100,100,0.4); box-shadow: 0px 0px 10px rgba(100,100,100,0.4); z-index: 970; background-color: #fff; position: fixed; bottom: 0px; transition: all 750ms ease; } section.kabooking.enable { width: 90%; } section.kabooking:after { min-height: 100px; } section.kabooking .binside { position: relative; background-color: var(--ka-bk-color); /* width: calc(100% - 200px); padding: 20px 100px 0 100px; */ width: 100%; padding: 0; } section.kabooking .binside .box1 { position: relative; width: calc(100% - 80px); padding: 0px 40px 0 40px; } section.kabooking.enable .binside .box1 { width: calc(100% - 200px); padding: 40px 100px 0 100px; } section#kab.scrolldown { opacity: 0; pointer-events: none; } section#kab.enable.scrolldown { opacity: 1; pointer-events: inherit; } section.kabooking .binside .box2 { position: relative; width: calc(100% - 200px); padding: 20px 100px 0 100px; } #banner section.kabooking .binside * { color:var(--ka-font-color); font-family: var(--ka-font-family-menu); font-size:14px; line-height:14px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; } section.kabooking .binside .hl, section.kabooking .binside .input { display: flex; flex-wrap: wrap; flex-direction: row; } section.kabooking .binside .input { margin: 20px 0 10px 0; /*justify-content: space-between;*/ } section.kabooking .binside .col { /*width: 25%;*/ } section.kabooking .binside .col.col0 { width: 30%; width: auto; } section.kabooking.enable .binside .col.col0 { width: 30%; } section.kabooking .binside .col.col1, section.kabooking .binside .col.col2 { width: 20%; } section.kabooking .binside .col.col3 { display: flex; width: 30%; width: auto; justify-content: flex-end; } section.kabooking.enable .binside .col.col3 { width: 30%; } section.kabooking #bookdates { width: 0px; padding: 10px 0 0 0; } section.kabooking.enable #bookdates { width: auto; padding: 20px 100px 0 100px; } section.kabooking .binside .col a.btn { display: inline-block; min-width:40px; padding: 10px 0px; border: 1px solid var(--ka-font-color); text-align: center; /*font-size: 24px !important;*/ } section.kabooking .binside .col a.btn.termin { padding: 5px 0; border: 0px solid var(--ka-font-color); } section.kabooking .binside .col a.btn.bsubmit.enable { cursor: pointer; background-color: var(--ka-font-color); color: #fff !important; border: 1px solid var(--ka-font-color); } section.kabooking .binside .col a.btn.bsubmit { padding: 10px 15px; cursor: default; display: flex; justify-content: center; align-items: center; } section.kabooking .binside .col a.btn.bsubmit:hover { /*background-color: #fff; color:var(--ka-font-color); border: 1px solid var(--ka-footer-color); */ } #banner section.kabooking .binside .col a.btn.termin { width:24px; height:12px; background-image: url('/files/intern/common/pfeil-kalender-up-grey.svg'); background-size: 16px; background-repeat: no-repeat; background-position: center bottom; } #banner section.kabooking .binside .col a.btn.termin.hinweis { width:24px; height:12px; background-image: url('/files/intern/common/pfeil-kalender-down-grey.svg'); background-size: 16px; background-repeat: no-repeat; background-position: center bottom; } #banner section.kabooking .binside .col div.termin { color: var(--ka-font-color); font-weight:400; } #banner section.kabooking .binside .col div.termin { color: var(--ka-font-color); font-size: 16px; font-weight:400; padding: 10px 0px; } #banner section.kabooking .binside .col div.termin.hinweis { color: var(--ka-font-color-light); color: #000; font-size: 12px; font-weight:600; } section.kabooking .binside .col .termin { display: inline-block; margin: 0 5px 0 0px; } section.kabooking .binside .col .cnt { display: inline-block; margin: 0 5px 0 5px; min-width:20px; text-align: center; } section.kabooking #bookmain { position: relative; } section.kabooking .binside #bookmain * { font-size:12px; line-height:12px; } section.kabooking #bookmain .hl { font-size: 12px; } section.kabooking #bookdates { position: relative; } section.kabooking #bookdates div.closebtn { position: absolute; top: 40px; right: 100px; width: 24px; height: 24px; background-image: url('/files/intern/common/close-grey.svg'); background-position: center; background-repeat: no-repeat; cursor: pointer; z-index: 971; } section.kabooking div#bookdates { position: relative; overflow: hidden; height: 0; opacity: 0; transition: height 0ms 600ms, opacity 800ms 0ms; margin: 0px 0 0px 0; /*border-top: 1px solid var(--ka-font-color);*/ } section.kabooking div#bookdates.enable { margin: 30px 0 10px 0; height: auto; opacity: 1; transition: height 500ms 0ms, opacity 800ms 0ms; } section.kabooking div#bookdates .bhl, section.kabooking div#bookdates .bmain, section.kabooking div#bookdates .bfooter { margin:20px 0; } section.kabooking div#bookdates .bhl { margin: 0 0 20px 0; padding: 30px 0 0 0; border-top: 1px solid var(--ka-font-color); } section.kabooking div#bookdates .chl { position: relative; display: flex; margin:20px 0; min-height: 40px; } section.kabooking div#bookdates .chl h3.card-header, section.kabooking div#bookdates .chl label.card-header { width: 100%; text-align: center; display:none; } section.kabooking div#bookdates .chl select { position: absolute; top: 10px; left: 50%; transform: translate(-50%, 0); width: 120px; margin: 0; padding: 5px 0; border: none; background-color: white; } section.kabooking div#bookdates .chl select option { border: none; } /* .highlight td::before, .highlight td::after { content:""; height:10px; display:block; } */ section.kabooking div#bookdates .chl button, section.kabooking div#bookdates .chl div.btn { position: absolute; top: 5px; background: white; width: 40px; height: 40px; cursor: pointer; border: 1px solid var(--ka-font-color); } section.kabooking div#bookdates .left .chl button, section.kabooking div#bookdates .left .chl div.btn { left: 0; background-image: url('/files/intern/common/pfeil-kalender-links-grey.svg'); background-size: 10px 10px; background-repeat: no-repeat; background-position: center center; } section.kabooking div#bookdates .right .chl button, section.kabooking div#bookdates .right .chl div.btn { right: 0; background-image: url('/files/intern/common/pfeil-kalender-rechts-grey.svg'); background-size: 10px 10px; background-repeat: no-repeat; background-position: center center; } section.kabooking div#bookdates .left .chl button.disable, section.kabooking div#bookdates .left .chl div.btn.disable, sectionsection.kabooking div#bookdates .right .chl button.disable, section.kabooking div#bookdates .right .chl div.btn.disable { display: none; } section.kabooking div#bookdates .bmain, section.kabooking div#bookdates .bhl { display: flex; justify-content: center; } /* section.kabooking div#bookdates .bmain .left { display: flex; justify-content:flex-end; width:calc(50% - 20px); margin: 0 20px 0 0; flex-direction:column; } section.kabooking div#bookdates .bmain .right { display: flex; justify-content:flex-start; width:calc(50% - 20px); padding: 0 0 0 20px; flex-direction:column; } */ section.kabooking div#bookdates .bmain .left, section.kabooking div#bookdates .bmain .right, section.kabooking div#bookdates .bhl .left, section.kabooking div#bookdates .bhl .right { display: flex; width: 40%; } section.kabooking div#bookdates .bmain .left, section.kabooking div#bookdates .bhl .left { justify-content: flex-end; margin: 0 20px 0 0; } section.kabooking div#bookdates .bmain .right, section.kabooking div#bookdates .bhl .right { justify-content: flex-start; margin: 0 0 0 20px; } section.kabooking div#bookdates .bhl .left .inner, section.kabooking div#bookdates .bhl .right .inner { width: 90%; display: flex; flex-wrap: wrap; justify-content: center; flex-direction:column; align-items: center; padding: 20px; border: 1px solid var(--ka-font-color); height:50px; } section.kabooking div#bookdates .bhl .left .inner .hl, section.kabooking div#bookdates .bhl .right .inner .hl { text-align: center; } section.kabooking div#bookdates .bhl .left .inner .check, section.kabooking div#bookdates .bhl .right .inner .check { text-align: center; font-size: 20px; margin: 10px 0 0 0; } section.kabooking div#bookdates .bmain .left .calendar, section.kabooking div#bookdates .bmain .right .calendar { width: 100%; min-height: 340px; } section.kabooking div#bookdates .bmain .left .calendar table, section.kabooking div#bookdates .bmain .right .calendar table { width: 100%; margin: 20px 0 20px 0; } section.kabooking div#bookdates .bmain .calendar table th, section.kabooking div#bookdates .bmain .calendar table td { text-align: center; padding: 10px; } section.kabooking div#bookdates .bmain .calendar table thead { } section.kabooking div#bookdates .bmain .calendar table tr { padding: 5px; /*height:40px;*/ } section.kabooking div#bookdates .bmain .calendar table td { padding: 10px; } section.kabooking div#bookdates .bmain .calendar table td.past { color:var(--ka-book-past); cursor: default; } section.kabooking div#bookdates .bmain .calendar table td.now { background-color:var(--ka-book-bknow); cursor:pointer; } section.kabooking div#bookdates .bmain .calendar table td.fu { background-color:var(--ka-book-bkfu); cursor:pointer; } section.kabooking div#bookdates .bmain .calendar table td.bo { background-color:var(--ka-book-bkbook); } section.kabooking div#bookdates .bfooter { } section.kabooking .form-inline, section.kabooking .bfooter { display: none; } /* ****************************************************************************************************************** */ /* --- kafilter ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kafilter { position: relative; width: 100%; margin: 20px 0 40px 0; display: block; } section.kafilter .finside { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0; display: flex; } section.kafilter .filterlist { width: 100%; display: flex; align-items: center; justify-content: center; } section.kafilter .filterlist .filter { margin: 0 10px; display: inline-block; } section.kafilter .filterlist .filter a { display: inline-block; text-align: center; padding: 10px 15px 8px 15px; color: var(--ka-font-color); font-family: var(--ka-font-family-menu); font-size: 12px; line-height: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid var(--ka-font-color); cursor: pointer; /* background-position: calc(100% - 8px) center; background-repeat: no-repeat; background-size: 12px 12px; background-image: url('/files/intern/common/plus.svg'); */ } #main section.kafilter .filterlist .filter a { } #main section.kafilter .filterlist .filter a:hover { border: 1px solid var(--ka-font-color); } section.kafilter .filterlist .filter a.enable { /*background-image: url('/files/intern/common/minus.svg');*/ cursor: default; background-color: var(--ka-font-color); color: #fff; border: 1px solid var(--ka-font-color); } section.kafilter .filterlist .filter a.disable { display: none; } div.mod_article.kaflt_disable { display: none; } /* ****************************************************************************************************************** */ /* --- kasubmenu ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.kasubmenu { position: relative; display: flex; margin: 20px 0 50px 0; } section.kasubmenu .items { position: relative; width: 100%; display: flex; flex-direction: row; justify-content: center; align-items: center; flex-wrap: wrap; } section.kasubmenu .items .item { position: relative; margin: 0 10px 20px 10px; } #main section.kasubmenu .items .item a { display: inline-block; text-align: center; padding: 10px 15px 8px 15px; color: var(--ka-font-color); font-family: var(--ka-font-family-menu); font-size: 12px; line-height: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid var(--ka-font-color); cursor: pointer; } #main section.kasubmenu .items .item a:hover { } #main section.kasubmenu .items .item a.active { border: 2px solid var(--ka-font-color-script); color: var(--ka-font-color-script); } /* ****************************************************************************************************************** */ /* --- timeline ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.timeline { position: relative; margin: 0; padding: 0; } section.timeline .eventblock { position: relative; margin: 0; padding: 0; flex-direction: column; } section.timeline .eventblock .event { margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 2px 1fr ; grid-auto-rows: 1fr; grid-column-gap: 5px; grid-row-gap: 5px; } section.timeline .eventblock .left, section.timeline .eventblock .right, section.timeline .eventblock .middle { /*width: calc(50% - 52px);*/ height:100%; display: flex; flex-direction: column; } section.timeline .eventblock .middle { position: relative; display: flex; width: 2px; height:100%; } section.timeline .eventblock .middle .line { position: absolute; top: 0; left: -1px; display: block; width: 100%; height:100%; min-height: 45px; background-color: var(--ka-font-color); } section.timeline .eventblock .middle .bubble { position: absolute; top: 20px; left: -7px; display: block; width: 14px; height:14px; border-radius:7px; background-color: var(--ka-font-color); } section.timeline .eventblock .left { text-align: right; padding-right: 50px; } section.timeline .eventblock .right { text-align: left; padding-left: 50px; } section.timeline .eventblock .event .text { margin: 10px 0 20px 0; } section.timeline .eventblock .event .image { /*margin: 0px 0 20px 0;*/ padding: 0px 0 20px 0; } /* ****************************************************************************************************************** */ /* --- Altersabfrage ----------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ section.agerequest { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: flex; justify-content: center; align-items: center; z-index: 1000; background-color: rgba(0,0,0,0.3); display: none; } section.agerequest.active { display: flex; } section.agerequest .textbox { padding: 50px 50px; background-color: #fff; width: 700px; max-width: 90%; } section.agerequest .question { margin: 20px 0 0 0; font-size: 22px; line-height: 26px; font-weight: 600; } /* ****************************************************************************************************************** */ /* --- Vouchers ----------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #myIncertIframe_iFrame { position: relative; display: inline-block; width: 100%; height: 100%; min-height: 2500px; overflow: visible; } /* ****************************************************************************************************************** */ /* --- changelanguage ----------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ #changelanguage, #changelanguage * { margin: 0; padding: 0; border-bottom: none; color:#ffffff; font-size: 15px; line-height: 22px; font-weight: 600; text-align: center; text-transform: uppercase; letter-spacing: .25em; cursor: pointer; } #changelanguage { position: relative; margin-left: 20px; height: 32px; overflow: visible; } #changelanguage .langitms { position: absolute; top:24px; left: 0; display: none; padding-top: 8px; } #changelanguage:hover .langitms { display: block; } #changelanguage .mod_changelanguage li { float: none; margin: 0; padding: 3px 0px 3px 0px; font-size: 15px; line-height: 15px; } #changelanguage .mod_changelanguage ul li.active { display: none; } .vouchers { /*min-height: 1000px;*/ } /* ****************************************************************************************************************** */ /* --- tabcontrol ----------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ .ce_tabcontrol {} .tabcontrol_tabs {} .tabcontrol_tabs ul, .tabcontrol_tabs li { margin: 0; padding: 0; list-style-type: none; } .tabcontrol_tabs li {} .tabcontrol_tabs li.tabs { float: left; padding: 10px; vertical-align: middle; text-align: center; cursor: pointer; color: #888 } .tabcontrol_tabs li.selected { background-color: #ccc; color: #000 } .tabcontrol_panes { padding: 20px; border: 1px solid #ccc } .tabcontrol_panes .panes {} /* ****************************************************************************************************************** */ /* --- Variablen ---------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ :root { --ka-tablet-border:20px; --ka-tablet-border2:60px; --ka-tablet-border3:40px; --ka-tablet-font-size:14px; --ka-tablet-line-height:20px; --ka-tablet-statement-font-size: 38px; --ka-tablet-statement-line-height: 45px; --ka-mobile-statement-font-size: 32px; --ka-mobile-statement-line-height: 36px; } /* ****************************************************************************************************************** */ /* --- max-width: 1920px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1920px) { #main .textimg.textimgbk .box { min-height: 700px; } #main .textimg .boxw { min-height:700px; } } /* ****************************************************************************************************************** */ /* --- max-width: 1800px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1820px) { .limit1800 { padding-left: var(--ka-tablet-border); padding-right: var(--ka-tablet-border); width:calc(100% - 2 * var(--ka-tablet-border)); } } /* ****************************************************************************************************************** */ /* --- max-width: 1600px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1620px) { #navmobil { display: block; position:absolute; /* left:calc(50% - 15px); top:32px; */ top:15px; left:20px; width:32px; height:32px; background-image: url('/files/intern/common/menu-white.svg'); background-repeat: no-repeat; background-position:center center; padding: 0; z-index: 991; cursor: pointer; -moz-transition: top 1s ease-in-out; -webkit-transition: top 1s ease-in-out; -o-transition: top 1s ease-in-out; transition: top 1s ease-in-out; } #header.small #navmobil { top: 15px; background-image: url('/files/intern/common/menu-grey.svg'); } section.bannertext { padding: 0 30px; width: calc(100% - 60px); } .center, .boxdarkblue.center, .boxmiddleblue.center, .boxwhite.center, .boxgrey.center, .limit1600, /*.textimg.boxed,*/ section.textbk .limit1600int, #footer .inside { padding-left: var(--ka-tablet-border); padding-right: var(--ka-tablet-border); width:calc(100% - 2 * var(--ka-tablet-border)); } #mainnav, #header .kontakt { display:none; } section.stayconnected .headline { /*margin-left: var(--ka-tablet-border);*/ margin-left: 0; } section.kacircleslider .image_container { position: absolute; left: -50px; top: 50%; width: 500px; height: 500px; transform: translate(0, -50%); z-index: +1; } section.kacircleslider .swiper-slide .textbox { position: relative; display: flex; flex-direction: column; background-color: var(--ka-bk-lightbrown); padding: 40px 40px 40px 500px; width: 100%; height: 100%; justify-content: center; } section.kaflipcard .flips { grid-column-gap: 40px; grid-row-gap: 40px; } } /* ****************************************************************************************************************** */ /* --- menu-mobile -------------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1600px) { /* #header { height: 110px; } */ #navmobil img { width: 32px; height: 32px; } .fa-navicon:before, .fa-reorder:before, .fa-bars:before { content: '' !important; } .mobile_menu_overlay { z-index: 992; } .mobile_menu { width:100%; height: 100vh; z-index: 993; } .mobile_menu a:hover { padding-bottom: 0px; border-bottom: 0; line-height: 0; } .mobile_menu #HeaderLogo2 { position: absolute; top:22px; left:50%; transform: translate(-50%, 0%); width: 180px; max-width: 50%; } .mobile_menu .mod_changelanguage { position: absolute; bottom: 85px; left:50%; transform: translate(-50%, 0); } .mobile_menu .mod_changelanguage * { margin:0; padding: 0; color: #000; font-size: 16px; font-weight: 400; letter-spacing: 0.1em; } .mobile_menu .mod_changelanguage li { float: left; padding: 0 5px 0 5px; } .mobile_menu .mod_changelanguage li:nth-child(1) { border-right: 1px solid #ffffff; } .mobile_menu .mod_changelanguage li a, .mobile_menu .mod_changelanguage li strong { } .mobile_menu .kontakt { position: absolute; left:0; bottom: 30px; width:100%; text-align: center; } .mobile_menu .socials { position: absolute; left:0; bottom: 30px; width:100%; text-align: center; } .mobile_menu .socials img { width:20px; } .mobile_menu .mobileclose { position: absolute; top:20px; right: 20px; display: block; width: 20px; height: 20px; } .mobile_menu .inner { height: 100%; background-color:#fff; color:var(--ka-font-color); font-family: var(--ka-font-family-bg); font-size:18px; text-transform:uppercase; z-index: 994; display:flex; /*font-weight: 600;*/ align-items: center; justify-content: center; } .mobile_menu .inner .ce_text1, .mobile_menu .inner .ce_text h1, .mobile_menu .inner .ce_text p, .mobile_menu .inner .ce_text a1 { margin-top:0; margin-bottom:0; padding:10px 0 10px 15px; font-size:18px; } .mobile_menu .mod_navigation { clear:both; margin:0; } .mobile_menu .mod_navigation ul.level_1 { min-width: 250px; margin:0; padding:0; } .mobile_menu li.active.submenu_show > ul { padding-top:8px; } .mobile_menu .mod_navigation ul li { float:none; clear:both; margin:0; padding:0; list-style-type:none; width:calc(100% - 15px); } .mobile_menu .mod_navigation li span { /*das Pfeilchen*/ width:100%; position:relative; display:block; font-size:20px; line-height: 22px; } .mobile_menu .mod_navigation a, .mobile_menu .mod_navigation li span, .mobile_menu .mod_navigation li.active strong { width:100%; display:block; margin-top:0; margin-bottom:0; padding:4px 0; text-align:center; font-size:16px; line-height: 18px; text-decoration:none; color:#000000; height:auto; font-weight:600; } .mobile_menu .mod_navigation li.active strong { color:#111111; } .mobile_menu .mod_navigation a:focus, .mobile_menu .mod_navigation a:hover { /*color:#c2c2c2;*/ } .mobile_menu .mod_navigation a.trail:focus, .mobile_menu .mod_navigation a.trail:hover { color:#fff; } .mobile_menu .submenu > a1::after, .mobile_menu .submenu > span::after { width:20px; height:20px; right:5px; position:absolute; display:inline-block; text-align:center; font-size:26px; line-height:26px; top:-5px; content: '›'; } .mobile_menu .submenu_show > a::after, .mobile_menu .submenu_show > span::after { text-indent:4px; transform: rotate(90deg); } .mobile_menu .mod_navigation li.active.submenu_show { padding-top: 4px; padding-bottom:0; /*border:0px solid #666;*/ } .mobile_menu ul.level_2 a, .mobile_menu ul.level_2 span, .mobile_menu ul.level_2 li.active strong { font-size:14px; line-height: 16px; } .mobile_menu .socials .hyperlink { width:20px; height:20px; } .mobile_menu ::-webkit-scrollbar { display:none; } .mobile_menu .mod_navigation ul.level_1 li:nth-child(1):before, .mobile_menu .mod_navigation ul.level_1 li:nth-child(7):after { background-image: none; } .mobile_menu .socials { position: absolute; bottom: 30px; width: 100%; text-align: center; } .mobile_menu .socials img { width: 24px; } .mobile_menu { display:none; -ms-overflow-style: none; // IE 10+ overflow: -moz-scrollbars-none; // Firefox overflow-y: -moz-hidden-unscrollable; -moz-scrollbars-vertical:hidden; } } /* ****************************************************************************************************************** */ /* --- max-width: 1450px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1450px) { #main .mod_newslist .news-entry.col4 { width: calc(33.3% - 15px); margin: 0 0 40px 0; } section.kacircleslider .image_container { position: absolute; left: 0px; top: 50%; width: 500px; height: 500px; transform: translate(0, -50%); z-index: +1; } section.kacircleslider .swiper-slide .textbox { position: relative; display: flex; flex-direction: column; background-color: var(--ka-bk-lightbrown); padding: 40px 40px 40px 450px; margin-left: 100px; margin-right: 100px; width: 100%; height: 100%; justify-content: center; } } /* ****************************************************************************************************************** */ /* --- max-width: 1400px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1420px) { .limit1400, #main .mod_newslist, section.kaimgs, section.stayconnected, section.textbk .limit1400int, section.textxcols .limit1400int, #main section.textxcols .limit1400int { padding-left: var(--ka-tablet-border); padding-right: var(--ka-tablet-border); width:calc(100% - 2 * var(--ka-tablet-border)); } #main .textimg.textimgbk div.statement { left: var(--ka-tablet-border); } section.kaslider1.img3o .swiper-slide { min-width:800px !important; max-width:800px; } } /* ****************************************************************************************************************** */ /* --- max-width: 1210px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1210px) { .home #bannerimage, .home #banner #bannerimage .rsts-slide > div, .home #banner #bannerimage .rsts-main { min-height: calc(40vh - 0px) !important; max-height: calc(40vh - 0px) !important; } section.bannertext { top:55%; position:absolute; } section.bannertext h3, section.bannertext div.headline { font-size:60px; line-height:64px; } section.bannertext p { font:30px/36px Caveat; } section.kabooking .binside .box1 { position: relative; width: calc(100% - 20px); padding: 0px 10px 0 10px; min-width: 500px; } section.kabooking #bookmain { display: flex; justify-content: center; } section.kabooking.enable #bookmain { display: block; justify-content: center; } .limit1200, section.timeline { padding-left: var(--ka-tablet-border); padding-right: var(--ka-tablet-border); width:calc(100% - 2 * var(--ka-tablet-border)); } /*#header .kontakt div#changelanguage, #header .kontakt div.location, #header .kontakt div.tel*/ h1, h2, h3, h4, h5 { white-space: normal; } .dist100 { height: 50px; } .dist50 { height: 35px; } .boxgrey { padding-right:10px; padding-left:10px; width:calc(100% - 20px); } .bildlink .image { width: calc(25% - 12px); } .bildlink .image.nr9, .bildlink .image.nr10 { display:none; } #main .limit1200 { /* margin-right:10px; margin-left:10px; */ } #main .mod_article .ce_text .ktext, #main .mod_article h1, #main .mod_article h2, #main .mod_article h3, #main .ce_form { /* padding-right:5px; padding-left:5px; */ } #main .textimg .left .headline, #main .textimg .left .text, #main .textimg .right .headline, #main .textimg .right .text, #main .textimg .left .button, #main .textimg .right .button { padding-left: 50px; padding-right: 50px; } #main .textimg h4 { /* font-size: 18px; line-height: 24px; letter-spacing: 0.15em; word-break: break-word; */ } #main .textimg.lightgreen .left .headline, #main .textimg.lightgreen .left .text, #main .textimg.lightgreen .right .headline, #main .textimg.lightgreen .right .text, #main .textimg.lightgreen .left .button, #main .textimg.lightgreen .right .button { padding-left: 80px; padding-right: 80px; } #main .textimg.scalimg img { position: relative; } .col33m { margin-left: 20px; margin-right: 20px; width: calc(100% - 40px); } .prodlink { margin-right:15px; margin-left:15px; } #main .mod_newslist, section.kafilter .filterlist .filters { margin: 20px 0; } #main .mod_newslist .news-entry.col4 { width: calc(33.3% - 15px); margin: 0 0 40px 0; } section.kafilter .filterlist .filter { margin: 5px; } #main section.kafilter .filterlist .filter a { padding: 10px 8px 8px 8px; letter-spacing: 0.04em; font-weight: 600; } #main .mod_newslist.forcecol3 .news-entry .news-block .news-image { min-height:300px; } section.kaflipcard.masonry .flips, section.kaaccs .blockaccs .grid, section.kastatement .statements { grid-template-columns: 1fr 1fr; grid-column-gap: 20px; } section.katextimg2col .textblocks .textimg-container { width: 100%; } section.kajob .textblock { padding: 10px 20px; } section.kajob .textblock .text, section.kajob .textblock .buttons { margin: 40px 0 0 0; } section.kacircleslider .image_container { position: absolute; left: 0px; top: 50%; width: 400px; height: 400px; transform: translate(0, -50%); z-index: +1; } section.kacircleslider .swiper-slide .textbox { position: relative; display: flex; flex-direction: column; background-color: var(--ka-bk-lightbrown); padding: 40px 40px 40px 350px; margin-left: 60px; margin-right: 60px; width: 100%; height: 100%; justify-content: center; } #footer .line1 .newsletter .formbody { /*width: 100%;*/ } #footer .line1 .newsletter input { /*min-width: calc(100% - 20px);*/ } #footer .line1 .newsletter div.widget.widget-submit { width: 120px; } #footer .line2 .kontakt { width: 50%; } #footer .line2 .mod_footer_navi, #footer .line2 .reservierung { width: 33.3%; margin: 50px 0 0 0; } #footer .line2 .copyright { right: 160px; } #footer .line3 { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; flex-direction: column; } #footer .line3 .links, #footer .line3 .awards { position: relative; left: auto; right: auto; top: auto; margin: 30px 0 0 0; transform: translate(0%, 0%); } #footer .line3 .mod_changelanguage { position: relative; left:0; right: auto; float: left; transform: translate(0, 0); } #footer .line3 .copyright, #footer .line3 .mod_footer_navi li { margin-right:15px; } .mod_footer_navi { margin-right:10px; } } /* ****************************************************************************************************************** */ /* --- max-width: 1050px -------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1050px) { #main .mod_newslist .news-entry.col4 { width: calc(50% - 15px); margin: 0 0 40px 0; } } /* ****************************************************************************************************************** */ /* --- max-width: 1020px --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 1020px) { .limit1000 { padding-left: var(--ka-tablet-border2); padding-right: var(--ka-tablet-border2); width:calc(100% - 2 * var(--ka-tablet-border2)); } } /* ****************************************************************************************************************** */ /* --- max-width: 850px --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 850px) { body { font-size:var(--ka-tablet-font-size); line-height:var(--ka-tablet-line-height); } /* #header { height: 100px; } */ #header.small { height: 70px; } #header .inside { } #header #HeaderLogo, #header.small #HeaderLogo, #header #HeaderLogo2, #header.small #HeaderLogo2 { top: 10px; } #header .kontakt { display: none; } #navmobil, #header.small #navmobil { top: 15px; } #header .booking { right: 15px; top: 15px; /*display: flex !important;*/ } #header .booking a { padding: 10px 20px 8px 20px; font-size: 14px; } #header #HeaderEvent1 { position:absolute; top:80px; right: 15px; width: 165px; max-width: 25%; } /* #header .kontakt div#changelanguage, #header .kontakt div.location, #header .kontakt div.tel { font-size:8px; } */ .rsts-skin-default .rsts-nav { display:none; } #header .actionbutton { top: 50px; } #header .actionbutton.event img { width: 100px; height: 100px; } #header .actionbutton img { width: 100px; height: 100px; } body.showhotelaward #header .actionbutton.hotelaward, body.showaward #header .actionbutton.award { top: 170px; right: 25px; } #header .actionbutton.fasionistea { top: auto; right: 25px; bottom: 25px; display: none; } #banner h1.headline { text-align: center; font-size:36px; line-height:44px; } #banner h3.headline2 { text-align: center; font-size:16px; line-height: 20px; } #bannerimage, #banner #bannerimage .rsts-main { min-height: calc(66vh - 0px) !important; /* min-height: calc(66vh - 0px) !important; max-height: calc(66vh - 0px) !important; */ } .home #bannerimage, .home #banner #bannerimage .rsts-slide > div, .home #banner #bannerimage .rsts-main, #bannerimage, #banner #bannerimage .rsts-slide > div, #banner #bannerimage .rsts-main #bannerimage img, #bannerimage video { /* position: relative; height: calc(66vh - 0px) !important; */ } #bannerimage { position: relative; } #bannerimage .mod_article, #bannerimage .ce_image, #bannerimage .image_container { width: 100%; height: 100%; } #bannerimage img { width: 100%; height: 100%; object-fit: cover; } body.fullscreenheadervideo #bannerimage, body.fullscreenheadervideo #bannerimage video, body.fullscreenheadervideo #banner #bannerimage .rsts-slide > div { height: calc(100vh - 0px) !important; } body.fullscreenheadervideo #banner #bannerimage .rsts-slide > div, body.fullscreenheadervideo #banner .rsts-view .rsts-slide, body.fullscreenheadervideo #banner .rsts-view .rsts-slide div { /* position: relative; min-height: 100% !important; max-height: 100% !important; height: 100% !important; */ } /* #banner .rsts-slide picture, #banner .left0 .rsts-slide picture, #banner .left20 .rsts-slide picture, #banner .left40 .rsts-slide picture, #banner .left60 .rsts-slide picture, #banner .left80 .rsts-slide picture, #banner .left100 .rsts-slide picture { position: relative; width: 100%; height: 100%; display: flex; } */ /* body.fullscreenheadervideo #banner .rsts-slide > div img, body.fullscreenheadervideo #banner .rsts-view .rsts-slide div img { width: 100% !important; height: 100vh !important; object-fit: cover; } #banner .rsts-slide > div .right .image_container img { object-position: 100% center; } #banner .rsts-slide > div .left0 .image_container img { object-position: 0% center; } #banner .rsts-slide > div .left20 .image_container img { object-position: 20% center; } #banner .rsts-slide > div .left40 .image_container img { object-position: 40% center; } #banner .rsts-slide > div .left60 .image_container img { object-position: 60% center; } #banner .rsts-slide > div .left80 .image_container img { object-position: 80% center; } #banner .rsts-slide > div .left90 .image_container img { object-position: 90% center; } #banner .rsts-slide > div .left100 .image_container img { object-position: 100% center; } #banner .left0 .rsts-slide > div img { object-position: 0% center; } #banner .left20 .rsts-slide > div img { object-position: 20% center; } #banner .left40 .rsts-slide > div img { object-position: 40% center; } #banner .left60 .rsts-slide > div img { object-position: 60% center; } #banner .left80 .rsts-slide > div img { object-position: 80% center; } #banner .left90 .rsts-slide > div img { object-position: 90% center; } #banner .left100 .rsts-slide > div img, #banner .right .rsts-slide > div img { object-position: 100% center; } */ h1, body.home h1, .boxgreen h1, body.home .boxgreen h1 { font-size:32px; line-height:36px; } h2, section.textxcols .footer .line2 .text { font-size:24px; line-height:28px; } h3, section.kaslider1 .textblock .headline { font-size:16px; line-height:20px; } h4 { font-size:18px; line-height:22px; } h5 { /* margin-top: 20px; */ } .rsts-skin-default .rsts-nav { bottom:0; right:5px; position:absolute; } section.annertext { top:120px; position:absolute; } section.bannertext h3, section.bannertext div.headline { font-size:40px; line-height:44px; } #bannerimage .downbutton img { height:40px; } #cboxTitle, #cboxCurrent { font-size:14px; } #cboxPrevious { left:-29px; width:40px; height:60px; top:calc(50% - 30px); margin:0; background-image: url("/files/intern/common/Pfeil-Galerie-pfeil-links.svg"); background-size: 40px,60px; background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; outline: none; } #cboxNext { right:-45px; width:40px; height:60px; top:calc(50% - 30px); margin:0; background-image: url("/files/intern/common/Pfeil-Galerie-pfeil-rechts.svg"); background-size: 40px,60px; background-repeat: no-repeat; background-position: right center; transition: background-position 0.5s ease-in-out; outline: none; } #cboxPrevious:hover { background-position: left center; } #cboxNext:hover { background-position: right center; } .rsts-skin-default .rsts-prev { position:absolute; width:40px; height:60px; top:calc(50% - 30px); left:-20px; background-image:url("/files/intern/common/Pfeil-Galerie-pfeil-links.svg"); background-size: 40px,60px; background-repeat: no-repeat; background-position: left center; transition: background-position 0.5s ease-in-out; } .rsts-skin-default .rsts-prev:hover { background-position: left center; } .rsts-skin-default .rsts-next { position:absolute; width:40px; height:60px; top:calc(50% - 30px); right:-35px; background-image:url("/files/intern/common/Pfeil-Galerie-pfeil-rechts.svg"); background-size: 40px,60px; background-repeat: no-repeat; background-position: center; background-position: right center; transition: background-position 0.5s ease-in-out; } .rsts-skin-default .rsts-next:hover { background-position: right center; } .limit800 { max-width: 600px; margin-right: auto; margin-left: auto; } #main .projectlink.imagegrow, #main .projectlink.flat { width: 100% } div h2.ce_headline.statement.limit1600, div.limit1600 h2.ce_headline.statement { padding-left:40px; } div.limit1600 h2.ce_headline.limit1400 { padding-left:80px; } .ce_text.limit1400 figure.image_container.kimg.float_left { max-width: 50%; } .ce_text.limit1400 .ktext { margin-bottom:40px; padding-left:40px; padding-right:40px; } #main .projectlink.hover { width: calc(50% - 10px); } #main .textimg .textblock { padding-top: 20px; padding-bottom: 50px; } #main .textimg.lightgreen .textblock { padding-top: 50px; padding-bottom: 50px; } #main .textimg.lightgreen .left .headline, #main .textimg.lightgreen .left .text, #main .textimg.lightgreen .right .headline, #main .textimg.lightgreen .right .text, #main .textimg.lightgreen .left .button, #main .textimg.lightgreen .right .button { padding-left: 40px; padding-right: 40px; } .news-entry.col3 { flex-direction: column; } .news-entry.col3 .news-date { /*float: left;*/ justify-content: left; padding-left: 20px; width: 100%; } .news-entry.col3 .news-date span { position: relative; top: 0; left: 0; padding-top: 15px; padding-bottom: 15px; transform: translate(0, 0); } .news-entry.col3 .rightblock { width: 100%; } .news-entry.col3 .news-image { width: 30%; height: auto; } .news-entry.col3 .news-text { width: calc(70% - 00px); } #main .mod_newslist.forcecol3 .news-entry .news-block .news-image { min-height:220px; } .mod_newslist { /* -moz-column-count: 2; -moz-column-gap: 20px; -webkit-column-count: 2; -webkit-column-gap: 20px; column-count: 2; column-gap: 20px; */ } section.textxcols .box2col .cols.cnt_4 .column { width: calc(50% - 30px); } section.textxcols .box2col .cols.cnt_5 .column { width: calc(50% - 30px); } section.textxcols .box2col .cols.cnt_6 .column { width: calc(33.3% - 30px); } section.textxcols .footer .line1 h2, section.textxcols .footer .line2 h2 { padding-bottom: 0 !important; } #main .mod_newslist .news-blog.col3 { width:calc(50% - 30px); } #banner .mod_newslist .news-blog.col3 .blogtext h4 { text-align: center; } .rsts-skin-default.rsshadow .rsts-view { /*width:calc(100% - 30px);*/ } .rsts-skin-default.rsshadow img { margin: 30px; width: calc(100% - 60px); } section.kabooking .binside .box1 { width: calc(100% - 20px); padding: 0px 10px 0 10px; } section.kabooking .binside .box2 { width: calc(100% - 40px); padding: 20px 20px 0 20px; } section.kabooking #bookdates div.closebtn { right: 20px; } #main .statement, #main .textimg.textimgbk div.statement .hl2 { font-size: var(--ka-tablet-statement-font-size); line-height: var(--ka-tablet-statement-line-height); } #main .textimg.textimgbk.kids .box { background: rgba(255,255,255,0.8); } #main .textimg.textimgbk.kids .box .headline, #main .textimg.textimgbk.kids .box .text, #main .textimg.textimgbk.kids .box .buttons { padding: 0px 50px 30px 50px; } #main .mod_newslist .news-entry.col4 { width: calc(50% - 15px); margin: 0 0 40px 0; } #main .textimg.boxed { margin: 40px 0; } #main .textimg .imgblock, #main .textimg .textblock { width:100%; padding: 0px 0 0 0; /*BG010521 40px --> 0*/ } #main .textimg .textblock { padding: 40px 0 20px 0; } #main .textimg.boxed .headline, #main .textimg.boxed .text, #main .textimg.boxed .button, #main .textimg.boxed .ce_accordion, #main .textimg .headline, #main .textimg .text, #main .textimg .button, #main .textimg .ce_accordion { padding-left: 80px; padding-right: 80px; } #main .textimg .left .headline, #main .textimg .left .text, #main .textimg .left .button, #main .textimg .left .ce_accordion { padding-right: 80px; padding-left: 80px; } #main .textimg .right .headline, #main .textimg .right .text, #main .textimg .right .button, #main .textimg .right .ce_accordion { padding-left: 80px; padding-right: 80px; } #main .textimg.textxcols .headline, #main .textimg.textxcols .text, #main .textimg.textxcols .button, #main .textimg.textxcols .ce_accordion { padding-left: 0px; padding-right: 0px; padding-bottom: 50px; } #main .textimg .imgblock .box { display: flex; align-items: center; justify-content: center; } section.kaimgs .images.cnt_3 .image { width: calc(33.3% - 12px); } section.textbk div.left { justify-content: flex-start; width: calc(50% - 40px); margin: 0 20px 0 20px; } section.textbk div.right { justify-content: flex-start; width: calc(50% - 20px); margin: 0 0 0 20px; } section.textbk .text h3, #main h3 a.telh3 { font-size: 16px; line-height: 20px; } #main .textimg .swiper-slide { min-height:150px; } #main .textimg .textblock, #main .textimg.scalimg .left .flexcontainer .textblock { /* Elemenete vertauschen */ order: 2; } #main .textimg .imgblock, #main .textimg.scalimg .left .flexcontainer .imgblock { /* Elemenete vertauschen */ order: 1; } section.kafilter { width: calc(100% - 40px); margin: 20px auto; } section.kaslider1 { margin: 20px 0 0 0; } section.kaslider1.img3o { /* min-height: 600px !important; */ margin: 40px 0 20px 0; } section.kaslider1.img3o .swiper-slide { max-width: 600px; } section.kaslider1.img3o .swiper-slide .textblock { padding: 0px 50px 20px 50px; } section.kaslider1 .textblock .text { font-size:var(--ka-tablet-font-size); line-height:var(--ka-tablet-line-height); } .limit1200 section.kaslider1 .swiper-button-prev { left: 30px; } .limit1200 section.kaslider1 .swiper-button-next { left: calc(100vw - 80px); } section.kaslider1.img1 .container_img1 h3, section.kaslider1.img1 .container_img1 .text { margin: 30px 0 30px 0; padding: 0 100px; } section.kaimgs .images.cnt_4 .image { width: calc(50% - 10px); margin-bottom: 20px; } #footer .line1, #footer .line2, #footer .line3 { width: calc(100% - 40px); padding: 40px 20px 40px 20px; } #footer .line2 .copyright { right: 80px; } section.stayconnected .left.col50, section.stayconnected .right.col50 { width:100%; } section.stayconnected .left.col50 { margin-bottom: 30px; flex-direction: column; } section.stayconnected .nl .widget.widget-text { width: calc(100% - 120px); max-width: 250px; } section.kacircleslider { margin: 150px 0 120px 0; } section.kacircleslider .image_container { position: absolute; left: auto; right: 50px; top: -150px; width: 300px; height: 300px; transform: translate(0, 0%); z-index: +1; } section.kacircleslider .swiper-slide .textbox { position: relative; display: flex; flex-direction: column; background-color: var(--ka-bk-lightbrown); padding: 40px 40px 40px 40px; margin-left: 0px; margin-right: 0px; width: 100%; height: 100%; justify-content: center; } /* #footer .line1 { flex-direction: column; padding: 40px 0 40px 0; } #footer .line1 #FooterLogo { margin-bottom: 40px; } #footer .line1 .newsletter { max-width: 90%; } */ } /* ****************************************************************************************************************** */ /* --- max-width: 720px --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 720px) { #main .mod_newslist .news-entry.col4 { width: 100%; margin-bottom: 10px; } } /* ****************************************************************************************************************** */ /* --- max-width: 600px --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 600px) { :root { --ka-katextimg2colpadding:20px; } #header, #header.small { height:60px; background-color: rgba(0, 0, 0, 0.001); } #header.small { background-color: rgba(255, 255, 255, 1); } #header #HeaderLogo, #header.small #HeaderLogo, #header #HeaderLogo2, #header.small #HeaderLogo2 { top:6px; left: 50%; transform: translateX(-50%); width: 90px; height: 45px; } #header #HeaderLogo a, #header #HeaderLogo2 a { width: 90px; height: 45px; } #navmobil, #header.small #navmobil { top:5px; left: 10px; } #header .booking, #header.small .booking { top:10px; right: 10px; display: flex !important; } #header .booking a { padding: 5px 5px 3px 5px; } #header #HeaderEvent1 { position:absolute; top:70px; right: 15px; width: 165px; max-width: 25%; } body.kulinarischeevents #header #HeaderEvent3 { top: 200px; right: 15px; } #header #HeaderEvent2 { top: 550px; } #bannerimage, #banner #bannerimage .rsts-main { min-height: calc(66vh - 0px) !important; /* min-height: calc(66vh - 0px) !important; max-height: calc(66vh - 0px) !important; */ } /* body.nobanner #bannerimage, body.nobanner #banner #bannerimage .rsts-main { min-height: calc(0vh - 0px) !important; max-height: calc(0vh - 0px) !important; } */ body.bannerheight200 #bannerimage .mod_article, body.bannerheight200 #bannerimage .ce_image, body.bannerheight200 #bannerimage .image_container, body.bannerheight200 #bannerimage, body.bannerheight200 #bannerimage img, body.bannerheight200 #banner #bannerimage .rsts-main { display: block; min-height: 200px !important; max-height: 200px !important; } body.bannerheight200 #bannerimage .ce_image img { max-height: 200px !important; height: 100%; object-fit: cover; overflow: hidden; } #banner #bannerimage .rsts-slide { position: relative; } #banner #bannerimage .rsts-slide > div, #banner #bannerimage .rsts-slide img { /* width: 100%; height: 100%; object-fit: contain; */ } #banner #bannerimage .rsts-slide.rsts-slide-image picture img { object-fit: cover; } #bannerimage .textbox { position: absolute; width:80%; left: 20%; top: 50%; transform: translate(-10%, -50%); } #bannerimage .textbox .ce_text * { font-size: 16px; line-height: 22px; } #bannerimage .textbox .ce_text img { width: 200px; } section.kabannerbtns { position: absolute; top: 80px; left: auto; right: 10px; display: flex; flex-direction: column; } #bannerimage section.kabannerbtns img { width: 100px; height: 100px; } section.bannertext h3, section.bannertext div.headline { font-size:32px; line-height:36px; } section.bannertext h1 { font-size:22px; line-height:26px; } #header .kontakt { display: none; } section.kabooking { height: 0 !important; overflow: hidden; /*margin-top: -50px;*/ } .mobile_menu .mod_navigation a, .mobile_menu .mod_navigation li span, .mobile_menu .mod_navigation li.active strong { font-size:18px; line-height: 24px; } .coloredslogan { top:0; } .coloredslogan h2, #footer .mod_footer_colortext { font-size: 20px; line-height: 23px; } .coloredslogan.distleft40, .coloredslogan.distright10.col33 { left:25%; width:75%; } #container { /*padding-top: 0;*/ padding-top: 20px; /*transition: margin-top 250ms linear;*/ } #main .inside { width:100%; margin-right:0; margin-left:0; padding-right:0; padding-left:0; width:calc(100% - 0px); } #banner h1.headline { font-size:26px; line-height: 30px; } #banner h3.headline2 { font-size:14px; line-height: 18px; } #main .statement, #main .textimg.textimgbk div.statement .hl2 { font-size: var(--ka-mobile-statement-font-size); line-height: var(--ka-mobile-statement-line-height); max-width: 85%; } #main .limit1600 .ce_headline.statement { padding-left:20px; } div.limit1600 h2.ce_headline.limit1400 { padding-left:40px; } h1, body.home h1, .boxgreen h1, body.home .boxgreen h1 { font-size:30px; line-height: 36px; letter-spacing:.01em; } h2, body.home h2 { font-size:22px; line-height:26px; letter-spacing:.01em; } body.home .mod_newslist h1 { font-size:18px; line-height:20px; letter-spacing:.01em; } h3 { font-size:16px; line-height:20px; } h4, #main .textimg h4 { font-size:18px; line-height:22px; } #banner .mod_newslist .news-blog.col3 .blogtext h4 { font-size:36px; line-height:40px; } h6 { font-size:24px; line-height:28px; } .mobile_menu .mod_navigation a, .mobile_menu .mod_navigation li span, .mobile_menu .mod_navigation li.active strong { width:100%; display:block; margin-top:0; margin-bottom:0; padding:3px 0; font-size:14px; line-height: 16px; } #main .startproject div.headline { font-size:20px; line-height:23px; } section.textxcols .footer .line1 .text, #main .bookbtn a.classic { font-size: 16px; line-height: 18px; } .limit1000 { padding-left: var(--ka-tablet-border3); padding-right: var(--ka-tablet-border3); width: calc(100% - 2 * var(--ka-tablet-border3)); } fieldset.checkbox_container, fieldset.checkbox_container label { width:100%; max-width:100%; margin-right:0; margin-left:0; } .bigtext p { font-size: 18px; line-height: 22px; } .col25, .col25m, .col33, .col33m, .col50, .col50m, .col50mr, .col66, .startbox, .startbox50, .partner, .prodlink, .col33line, .col50line, .col66line, .flink div.linkimg, #main .ce_youtube.col50, #main .ce_youtube.col50m { margin-right:0; margin-left:0; padding-right:5px; padding-left:5px; width: calc(100% - 10px); height:100% !important; } .left, .right, #main .textimg.boxed .left, #main .textimg.boxed .right, #main .textimg .imgblock, #main .textimg.boxed, #main .textimg.boxed .textblock, section.kaimgs .textblock { margin-right:0; margin-left:0; padding-right:0px; padding-left:0px; width: 100%; height:100% !important; } #main .textimg.boxed .textblock { padding-top: 0; } .dist100 { height: 40px; } .dist50 { height: 25px; } .dist25, .dist30 { height: 20px; } .content-gallery.content-gallery--cols-3 ul, .content-gallery.content-gallery--cols-4 ul, .content-gallery.content-gallery--cols-5 ul, .content-gallery.content-gallery--cols-6 ul, .content-gallery.content-gallery--cols-7 ul { grid-template-columns: 1fr 1fr; } .ce_gallery ul.cols_3 li, section.kaimgs .images.cnt_4 .image { width: calc(50% - 10px); margin-bottom: 10px; padding: 0 5px; } section.stayconnected .images.cnt_3 .image { width: calc(33.3% - 10px); margin-bottom: 20px; } .ce_gallery ul.cols_4 li, .ce_gallery ul.cols_5 li, .ce_gallery ul.cols_6 li { padding-left: 2px; padding-right: 2px; margin-bottom: 4px; width: calc(25% - 4px); } .ce_gallery ul.cols_6 li { width: calc(33.3% - 4px); } .ce_gallery ul.cols_7 li { padding-left: 5px; padding-right: 5px; margin-bottom: 10px; width: calc(25% - 10px); } .ce_gallery.masonry ul, .ce_gallery.masonry ul.cols_2, .ce_gallery.masonry ul.cols_3, .ce_gallery.masonry ul.cols_4, .ce_gallery.masonry ul.cols_5, .ce_gallery.masonry ul.cols_6 { column-count: 2; } .rsts-skin-default.rsshadow.limit900 { width: calc(100% - 0px); } .rsts-skin-default.rsshadow h3 { margin-top: 0; } #main .projectlink.hover { /*width: 100%;*/ } #main .projectlink.hover { width: calc(50% - 5px); margin: 0px 0 10px 0px; } #main .projectlink.hover h4 { margin: 0 0 10px 0; } #main .projectlink.hover .textblock .headlinecolor { font-size: 24px; line-height: 28px; margin: 0; } .news-entry.col3 .news-text { /*padding: 30px 30px 30px 30px;*/ padding: 20px 20px 20px 20px; } .news-entry.col3 .rightblock .sameline1 p.more, .news-entry.col3 .rightblock .sameline1 ul.enclosure { margin: 10px 30px 0 0; } .news-entry.col3 .news-text p, .news-entry.col3 .news-text p a, .news-entry.col3 .news-text ul.enclosure a { font-size: 14px; line-height: 20px; } .mod_newslist { /* -moz-column-count: 1; -moz-column-gap: 20px; -webkit-column-count: 1; -webkit-column-gap: 20px; column-count: 1; column-gap: 20px; */ } .ce_text.limit1400 figure.image_container.kimg.float_left { width: 100%; max-width: 100%; } .blogdetails .blogimage { min-height: 300px; } #main .mod_newslist .news-blog.col3, #main .mod_newslist.forcecol3 .news-entry.col4 { width:100% !important; } #main .textimg .right > .flexcontainer .textblock { /*order: 1;*/ } #main .textimg .right > .flexcontainer .imgblock { /*order: 2;*/ } #main .textimg.scalimg .left .flexcontainer .textblock { /* Elemenete vertauschen */ order: 2; } #main .textimg.scalimg .left .flexcontainer .imgblock { /* Elemenete vertauschen */ order: 1; } #main .textimg .left .headline, #main .textimg .left .text, #main .textimg .right .headline, #main .textimg .right .text, #main .textimg .left .button, #main .textimg .right .button, #main .textimg .left .ce_accordion, #main .textimg .right .ce_accordion { padding-left: 20px; padding-right: 20px; } #main .textimg .textblock { margin-top: 15px; } #main .textimg.scalimg .bottomblock { display: none; } #main .textimg.textxcols .headline, section.textxcols .headline { margin: 0; padding: 0 0 10px 0; } #main .textimg.textxcols .text { padding: 0 0 10px 0; } #main h2 a.telh2 { font-size: 20px; line-height: 24px; } .news-entry.col3 .news-image { /*display: none;*/ } .news-entry.col3 .news-text { /*width: 100%;*/ } .text2col .textblock.right { text-align:left; } .bildlink .image { width: calc(50% - 12px); } #cboxCurrent { bottom:5px !important; top: auto; right:10px; } .flexcontainer.space-between { margin-top: 10px; margin-bottom: 10px; } #main a, #main .button a, #main .textimg .button a { float: none; clear: both; } #main .textimg .boxw { min-height:100%; } #main .textimg.boxed, #main .mod_newslist { margin: 20px 0; } #main .mod_newslist, section.kafilter .filterlist .filters { justify-content: flex-start; } #main section.kafilter .filterlist .filter a { font-size: 12px; letter-spacing: 0.02em; font-weight: 500; } section.textbk.col2 div.li section.textbk.col2 .text, section.textbk.col2 .text * { font-size: 18px; line-height: 24px; } section.textbk div.left { width: calc(100% - 0px); margin: 0 0px 20px 0px; order:2; } section.textbk div.right { width: calc(100% - 0px); margin: 0 0px 0px 0px; order:1; } section.textbk.noorder div.left { order:1; } section.textbk .text h3 { font-size: 16px; line-height: 20px; } section.textbk.col2 div.left, section.textbk.col2 div.right { margin:0 0 20px 20px; } section.kaimgs .images .box .textbox { font-size: 8px; line-height: 10px; } #main .textimg.textimgbk.kids div.statement { top: 0px; } section.textbk.white div.left { width: calc(100% - 0px); } #main .textimg.textimgbk.kids .box { width: calc(100% - 40px); margin: 140px 20px 0 20px; padding: 20px 0 20px 0; background: rgba(255,255,255,0.8); } #main .textimg.textimgbk.kids .box .headline, #main .textimg.textimgbk.kids .box .text, #main .textimg.textimgbk.kids .box .buttons { padding: 0px 20px 30px 20px; } section.textxcols .box2col .cols.cnt_3 .column, section.textxcols .box2col .cols.cnt_4 .column, section.textxcols .box2col .cols.cnt_5 .column, section.textxcols .box2col .cols.cnt_6 .column, #main .mod_newslist .news-entry.col4 { width: 100%; margin-bottom: 10px; } section.textbk .limit1600.flexcontainer { /*flex-direction: column-reverse;*/ } section.kaimgs { margin-top: 20px; margin-bottom: 20px; } section.textbk div.right { width: 100%; margin: 0 0 20px 0px; justify-content: left; align-items: flex-start; } section.kaslider1.img3o { /*min-height: 510px !important;*/ margin: 40px 0 20px 0; } section.kaslider1.img3o .swiper-slide { min-width: 100vw !important; /*min-width: 200px !important; */ } section.kaslider1.img3o .swiper-slide .textblock { padding: 20px 40px 40px 40px; /*width: calc(100% - 80px);*/ } #main .textimg .swiper-button-prev, #main .textimg .swiper-button-next, section.kaslider1 .swiper-button-prev, section.kaslider1 .swiper-button-next { width: 12px; height: 40px; } #main .textimg .swiper-slide { /*min-height: 250px; */ } /* .limit1200 section.kaslider1 img { min-height:200px; object-fit: cover; } */ .limit1200 section.kaslider1.img3o .swiper-button-prev, .limit1200 section.kaslider1.img3o .swiper-button-next { top:60px; } .limit1200 section.kaslider1 .swiper-button-prev { left:10px; } .limit1200 section.kaslider1 .swiper-button-next { left: calc(100vw - 60px); } #main .textimg.scalimg img { width: 100%; height: 100%; object-fit: cover; } section.kaflipcard.grid .flips, section.kaflipcard.masonry .flips, section.kaaccs .blockaccs .grid, section.kastatement .statements { grid-template-columns: 1fr; grid-column-gap: 0px; } section.kacircleslider .image_container { position: absolute; left: auto; right: 10px; top: -170px; width: 250px; height: 250px; transform: translate(0, 0); } section.kacircleslider .swiper-slide .textbox > .grid { grid-template-columns: 1fr; grid-column-gap: 0px; grid-row-gap: 20px; } section.kacircleslider .swiper-slide .textblock .subheadline { margin: 0 0 5px 0; font-size: 28px; line-height: 32px; } section.kacircleslider .swiper-slide .textbox { padding: 20px 20px 20px 20px; } section.kaflipcard.grid .headerbox .headline { font-size: 70px; line-height: 70px; } section.kaflipcard.grid .headerbox .text { font-size: 22px; line-height: 28px; } section.katextimg2col .textblocks .textimg-container.borderleft .borderblock { padding: 20px 0px 0 20px; } section.timeline .eventblock section.event h3 { font-size: 12px; line-height: 16px; } section.timeline .eventblock section.event .left, section.timeline .eventblock section.event .right { padding: 5px 0px 0px 0px; } section.timeline .eventblock .event { grid-template-columns: 2px 80px 1fr; } section.timeline section.event.odd > .middle { order:1; } section.timeline section.event.odd > .left { order:2; text-align: left; width: 80px; padding-left:10px; } section.timeline section.event.odd > .right { order:3; width: calc(100% - 4px); } section.timeline section.event.even > .middle { order:1; } section.timeline section.event.even > .left { order:3; text-align: left; } section.timeline section.event.even > .right { order:2; padding-left:10px; } .widget { padding: 0 5px 0 5px; } .widget-text { display: flex; flex-wrap: wrap; } .widget-text label { /* Elemenete vertauschen */ order: 2; } .widget-text input { /* Elemenete vertauschen */ order: 1; } .widget-textarea { margin-top: 15px; } .widget-radio legend { max-width: 33%; } .widget-textarea label, .widget-captcha label, .widget-text label, .widget-password label, .widget-radio legend, .select label { float:none; font-size: 14px; } input.text, input.password, input.captcha, textarea, .submit, fieldset.checkbox_container { margin-right:0; margin-left:0; padding:0 5px 0 5px; width:calc(100% - 10px); max-width:calc(100% - 10px); } fieldset.checkbox_container { margin-right:0; margin-left:0; padding-right:0; padding-left:0; width:calc(100% - 0px); max-width:calc(100% - 0px); } fieldset.checkbox_container, fieldset.checkbox_container label, fieldset.checkbox_container, fieldset.checkbox_container label a { font-size: 14px; line-height: 18px; } .submit { margin:15px 0 0 0; padding:10px 0 10px 0; width:calc(100% - 0px); max-width:calc(100% - 0px); } .bildlink .image.nr5, .bildlink .image.nr6, .bildlink .image.nr7, .bildlink .image.nr8, .bildlink .image.nr9, .bildlink .image.nr10 { display:none; } .bildlink .linkbox a { padding:12px 30px; font-size:20px; } .ce_video iframe { max-width: calc(100% - 4px); } .boxwhite.shadow { width: calc(100% - 0px); margin: 0; } .ce_form.limit1000 { padding: 0; width: calc(100% - 20px); } #main fieldset.checkbox_container label a { font-family: var(--ka-font-family); font-weight: 400; letter-spacing: 0.025em; font-size: 13px; text-transform: none; } #footer { /*height:80px;*/ display: inline-block; } #footer .inside { padding-right:0px; padding-left:0px; padding-bottom: 20px; width:calc(100% - 0px); } #footer .line2 .kontakt, #footer .line2 .mod_footer_navi, #footer .line2 .reservierung { width: 100%; display: flex; flex-direction:column; align-items: center; justify-content: center; margin: 20px 0 0 0; } #footer .line2 .copyright { position: relative; left: 50%; transform: translate(-50%, 0); right: auto; top: auto; bottom: auto; margin: 40px 0 0 0; text-align: center; } #footer .line2 li { text-align: center; } #footer .line3 .links { display: flex; flex-direction:row; align-items: center; justify-content: center; } #footer .line3 .links a { display: flex; width: 50%; } } /* ****************************************************************************************************************** */ /* --- max-width: 380px Iphone SE ----------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 380px) { :root { --ka-tablet-border:16px; --ka-tablet-border2:50px; --ka-tablet-border3:30px; --ka-tablet-font-size:14px; --ka-tablet-line-height:20px; --ka-tablet-statement-font-size: 32px; --ka-tablet-statement-line-height: 40px; --ka-mobile-statement-font-size: 26px; --ka-mobile-statement-line-height: 30px; } #main .statement, #main .textimg.textimgbk div.statement .hl2 { max-width: 100%; } } /* ****************************************************************************************************************** */ /* --- max-width: 359px --------------------------------------------------------------------------------------------- */ /* ****************************************************************************************************************** */ @media only screen and (max-width: 360px) { #header .bookatable a { font-size: 12px; } } /* ****************************************************************************************************************** */ /* ****************************************************************************************************************** */ /* ****************************************************************************************************************** */