html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: transparent; -webkit-overflow-scrolling: touch; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body { background: #f5f5f5; width: 100%; font-family: 'Poppins', sans-serif; color: #3C3C3B; font-size: 100%; font-weight: 400; line-height: 1.45; } *, *::before, *::after { box-sizing: border-box; padding: 0; margin: 0; } a { color: #82706c; text-decoration: none; font-weight: 600; } a:hover { color: #438d45; } img, iframe { border: none; } *:focus { outline: none; } select:-moz-focusring { color: transparent; text-shadow: 0 0 0 #000; } a[href^=tel] { color:inherit; text-decoration: none; font-weight: inherit; } input, button, select, optgroup, textarea { font-family: inherit; font-size: inherit; line-height: inherit; } .clear { clear: both; height: 0; } .clearfix::after, .widthFix::after { display: block; content: ""; height: 0; clear: both; visibility: hidden; } h1, h2, h3, h4, h5, h6 { margin: 10px 0 0 0; line-height: 1.35; } p { margin: 15px 0 0 0; } h3 + p { margin: 8px 0 0 0; } h4 + p { margin: 0; } h1 { font-size: 30px; font-weight: 600; color: #82706c; margin: 0; } h2 { font-size: 22px; font-weight: 600; color: #3C3C3B; margin-top: 20px; } h1 + h2 { color: #000; font-size: 20px; font-weight: 400; margin-top: 5px; } h3, h4 { font-size: 18px; font-weight: 600; color: #3C3C3B; margin-top: 20px; } h3 { border-bottom: 1px solid #c9c9c9; clear: both; } span.title { display: block; font-size: 15px; font-weight: 600; color: #000; margin: 0; } .text-center { text-align: center; } strong { font-weight: 600; } #header, #mainNav, #emotion, #main, section, #footer { width: 100%; position: relative; overflow: hidden; z-index: 1; } .widthFix { max-width: 1440px; position: relative; margin: 0 auto; } #emotion img, .blog img, .offer img, .ctaLink img, .navItem img, .room img, .gallery img { display: block; width: 100%; height: auto; } ul.nav { list-style-type: none; } ul.nav a { font-weight: 400; text-decoration: none; } #stickyFix, .misc, .d-none { display: none; } .bookingLink.hide, .bookingFrame.hide, .mobileLink.hide { display: none !important; } #modalContent { display: none; max-width: 600px; padding: 20px; margin: 20px 0; border-radius: .3em; box-shadow: 0 0.1em 0.4em rgba(0,0,0,.3); } #modalContent h2 { margin: 0; } /* MIT SPRACHAUSWAHL */ #header { background: #fff; height: 80px; z-index: 100; overflow: visible; } #header .topCol { width: 100%; padding: 5px 15px 0 15px; position: absolute; top: 0; left: 0; z-index: 200; } #header .hotline { position: absolute; top: 40px; right: 15px; } #header .hotline * { display: inline-block; height: 34px; font-size: 16px; font-weight: 600; line-height: 35px; vertical-align: middle; } #header .hotline span { display: none; margin-right: 10px; } #header .hotline i { margin-right: 5px; } /* Sprachumschaltung */ #google_translate_element { display: none; position: absolute; top: 0; left: -1000px; } #language-switch { position: relative; float: right; margin-left: 15px; z-index: 300; } #language-switch button { display: block; background: transparent; font-size: 16px; line-height: 32px; text-align: left; border: none; padding-left: 40px; } #language-switch button:hover { background-color: #e5e5e5; } #language-switch .btn-header { padding-right: 34px; border: 1px solid #ccc; border-radius: 6px; background-color: #fff; background-image: url(/gfx/arrow.png); background-position: right top; background-repeat: no-repeat; background-size: 33px auto; } #language-switch .dropdown-item { width: 100%; position: relative; padding-right: 9px; } #language-switch .btn-header::before, #language-switch .dropdown-item::before { content: ''; display: block; width: 24px; height: 16px; background-image: url(/gfx/flags.svg); background-repeat: no-repeat; background-position: 0 0; background-size: auto 100%; position: absolute; left: 10px; top: 50%; margin-top: -8px; } #language-switch button.de::before { background-position: 0 0; } #language-switch button.en::before { background-position: -24px 0; } #language-switch button.fr::before { background-position: -48px 0; } #language-switch button.it::before { background-position: -72px 0; } #language-switch button.nl::before { background-position: -96px 0; } #language-switch button.es::before { background-position: -120px 0; } #language-switch .dropdown-menu { display: none; background: #fff; border: 1px solid #ccc; border-radius: 6px; padding: 5px 0; position: absolute; top: 48px; left: 50%; margin-left: -66px; } #language-switch.show .dropdown-menu { display: block; } #language-switch .dropdown-menu:after, #language-switch .dropdown-menu:before { content: ''; width: 0; height: 0; position: absolute; bottom: 100%; left: 50%; border: solid transparent; pointer-events: none; } #language-switch .dropdown-menu:after { border-color: rgba(255, 255, 255, 0); border-bottom-color: #fff; border-width: 10px; margin-left: -10px; } #language-switch .dropdown-menu:before { border-color: rgba(79, 58, 42, 0); border-bottom-color: #ccc; border-width: 11px; margin-left: -11px; } #mainNav { background: #716663; z-index: 15; position: absolute; top: 80px; left: 0; } #menu { width: 100%; position: relative; opacity: 0; max-height: 0; overflow: hidden; } .menuActive #menu { opacity: 1; max-height: 1500px; } #menu ul li { position: relative; } #menu ul li a { width: 100%; display: block; font-size: 19px; line-height: 50px; padding: 0 50px 0 15px; color: #fff; border-top: 1px solid #E3DFD7; } #menu ul li a:hover, #menu ul li.active > a { background: #716663; color: #fff; } #menu ul li span.more { display: block; cursor: row-resize; width: 50px; height: 50px; font-size: 30px; line-height: 50px; color: #fff; position: absolute; top: 1px; right: 0; } #menu ul li span.more::before, #menu ul li.active.open span.more::before { content: '\f107'; width: 100%; } #menu ul li.open span.more, #menu ul li.active span.more { line-height: 48px; } #menu ul li.open span.more::before, #menu ul li.active span.more::before { content: '\f106'; } /* ZWEITE MENÜEBENE */ #menu ul ul, #menu ul li.active.open ul { max-height: 0; overflow: hidden; padding: 0; } #menu ul li.open ul, #menu ul li.active ul { max-height: 500px; } #menu ul ul li a { max-height: 42px; font-size: 17px; line-height: 42px; padding: 0 0 0 30px; margin-top: 1px; border: none; } #emotion .imageContainer { width: 100%; max-height: 800px; position: relative; } /*#emotion .imageContainer img { -webkit-filter: brightness(.6); filter: brightness(.6); }*/ #emotion .slick-arrow { display: block; background: transparent; width: 30px; height: 100%; border: 0; color: #fff; cursor: pointer; position: absolute; top: 0; z-index: 20; opacity: .5; } #emotion .slick-arrow:hover { opacity: 1; } #emotion .slick-arrow.prev { left: 0; } #emotion .slick-arrow.next { right: 0; } #emotion .slick-arrow::before { content: '\f104'; font-size: 40px; line-height: 100%; } #emotion .slick-arrow.next::before { content: '\f105'; } #emotion ul.slick-dots { width: 100%; height: 10px; text-align: center; position: absolute; left: 0; bottom: 10px; z-index: 20; } #emotion li { display: inline-block; margin: 0 3px; } #emotion li button { display: block; background: rgba(255,255,255,.5); width: 10px; height: 10px; text-indent: -5000px; border: none; border-radius: 50%; cursor: pointer; } #emotion li.slick-active button { background: rgba(255,255,255,1); } #emotion .responsive-video { width: 100%; position: relative; padding-bottom: 43%; height: 0; overflow: hidden; } #emotion .responsive-video video#homeVideo { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #logo { width: auto; height: 50%; position: absolute; top: 20px; left: 50%; transform: translate(-50%, 0); z-index: 100; } #logo a, #logo img { display: block; width: auto; height: 100%; filter: drop-shadow(0 0 4px rgba(0,0,0,.5)); } #main { background: #f5f5f5; padding: 5px 0 15px 0; } #main .widthFix { padding: 0 15px; } #main section { padding: 15px 0; overflow: visible; } #main section#webBlog .blogArticle { max-width: 980px; margin: 0 auto; } #footer { background: #716663; font-size: 1em; color: #fff; padding: 10px 0; } #footer a, #ending a { color: #fff; font-weight: 400; text-decoration: none; } #footer a:hover, #footer li.active a { color: #3C3C3B; } #footer .column { width: 100%; padding: 0 15px 15px 15px; position: relative; } #footer .colHead { padding-top: 15px; border-bottom: 1px dotted #fff; position: relative; } #footer .colHead h3 { display: inline-block; text-transform: uppercase; color: #fff; font-size: 18px; line-height: 24px; font-weight: 400; margin: 0 0 -1px 0; border-bottom: 2px solid #fff; } /* FOOTER ANSCHRIFT */ #footer .identity .brand { display: none; } #footer .identity .address, #footer .identity .contact { display: inline-block; vertical-align: top; line-height: 1.45; } #footer .identity .address { margin-right: 35px; } /* FOOTER NAVIGATION */ #footer ul.nav { margin-top: 15px; } #footer .arrow a { display: block; font-size: 1em; line-height: 40px; padding-left: 10px; position: relative; border-bottom: 1px dotted rgba(255,255,255,.5); } #footer .arrow a::before { content: '\f105'; font-size: 1em; line-height: 40px; position: absolute; top: 0; right: 10px; } #footer .arrow a:hover, #footer .arrow li.active a { background: rgba(255,255,255,.5); } /* FOOTER SOCIAL MEDIA */ #footer .colBottom { padding-top: 15px; } #footer ul.social a { background: #E3DFD7; display: block; float: left; width: 42px; height: 42px; font-size: 26px; line-height: 42px; color: #716663; text-align: center; padding: 0; margin: 0 12px 0 0; border-radius: 4px; } #footer ul.social span { display: block; text-indent: -5000px; } #footer ul.social a.facebook { line-height: 44px; } #footer ul.social a.instagram, #footer ul.social a.whatsapp { font-size: 30px; } #footer ul.social a:hover { color: #fff; } #footer ul.social a.facebook:hover { background: #3b5998; } #footer ul.social a.instagram:hover { background: #c13584; } #footer ul.social a.youtube:hover { background: #ff0000; } #footer ul.social a.tripadvisor:hover { background: #00a680; } #footer ul.social a.whatsapp:hover { background: #2bb640; } /* FOOTER ENDING */ #ending { background: #3C3C3B; font-size: 14px; line-height: 1.3; color: #fff; padding: 15px 100px 15px 15px; text-align: left; } #ending .copyright span, #ending .copyright a { display: block; } #ending .copyright a { color: rgba(255,255,255,.5); padding-top: 5px; } #ending .copyright a:hover { color: rgba(255,255,255,1); } /* EFFEKTE */ .fast, #footer a, #footer a::before, #footer a::after, #ending a, .pdf h2, .expand h2, .expand h2::after, .paginationWrapper a { -webkit-transition: all .4s ease-out; transition: all .4s ease-out; } .slow, #onepagebooking a::after, .btn, .btn::after, .navItem img, .offer img, .ctaLink img, .gallery a.group::after, .gallery img { -webkit-transition: all .6s ease-out; transition: all .6s ease-out; } .navItem .boxBody { -webkit-transition: max-height .8s ease-in-out, background-color .4s ease-in-out; transition: max-height .8s ease-in-out, background-color .4s ease-in-out; } .fixed #signet { -webkit-transition: all .8s ease-out .4s; transition: all .8s ease-out .4s; } #logo, #menu, #menu ul, #menu a, #menu a::before, #emotion .imageContainer img, #deals .slick-arrow { -webkit-transition: all .4s ease-out; -moz-transition: all .4s ease-out; -ms-transition: none !important; transition: all .4s ease-out; } /* Responsive Menu */ #toggleNavbar { display: block; background: #716663; width: 48px; height: 48px; padding: 0; position: absolute; top: 16px; left: 15px; z-index: 1000; border-radius: 50%; transition: 0.6s ease; transition-timing-function: cubic-bezier(.75, 0, .29, 1.01); } #toggleNavbar .icon, #toggleNavbar .icon::before, #toggleNavbar .icon::after { background: #fff; width: 22px; height: 2px; position: absolute; transition: 0.6s ease; transition-timing-function: cubic-bezier(.75, 0, .29, 1.01); } #toggleNavbar .icon { top: 23px; left: 13px; } #toggleNavbar .icon::before { content: ""; top: -6px; } #toggleNavbar .icon::after { content: ""; top: 6px; } /* on activation */ .menuActive #toggleNavbar { background: #438d45; } .menuActive #toggleNavbar .icon { background: transparent; } .menuActive #toggleNavbar .icon::before { top: 0 !important; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .menuActive #toggleNavbar .icon::after { top: 0 !important; -moz-transform: rotate(-225deg); -webkit-transform: rotate(-225deg); -o-transform: rotate(-225deg); -ms-transform: rotate(-225deg); transform: rotate(-225deg); } /* SUBNAV ÜBERSICHT */ #subNav .navItem, #deals .offer, #contactBar .ctaLink { display: block; width: 100%; position: relative; overflow: hidden; border-radius: 6px; margin-top: 25px; } #subNav .navItem:first-child { margin-top: 0; } #subNav .navItem:hover img { transform: scale(1.05); } #subNav .navItem .boxBody { background: rgba(0,0,0,.6); width: 100%; padding: 10px; max-height: 40px; font-size: 1em; font-weight: 400; color: #fff; text-shadow: 0 0 7px rgba(0,0,0,.75); position: absolute; bottom: 0; left: 0; z-index: 10; } #subNav .navItem .boxBody h3 { font-size: 20px; line-height: 1; font-weight: 600; color: #fff; border: none; margin: 0; } #subNav .navItem .boxBody p { margin-top: 15px; } #subNav .navItem:hover .boxBody { background: rgba(0,0,0,.8); max-height: 100%; } /* ANGEBOTE ÜBERSICHT + KONTAKT LINKS */ #deals .dealSlider .offer { margin-top: 0; } #deals .offer::before, #contactBar .ctaLink::before { content: ''; background: #000; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 5; opacity: .2; } #deals .offer:hover::before, #contactBar .ctaLink:hover::before { opacity: .5; } #deals .offer:hover img, #contactBar .ctaLink:hover img { transform: scale(1.05); } #deals .offer div, #contactBar .ctaLink div { width: 100%; text-align: center; padding: 0 55px; position: absolute; top: 50%; left: 0; z-index: 10; } #deals .offer .boxHeader h3, #contactBar .ctaLink .boxHeader h3 { font-size: 26px; font-size: 8vw; font-weight: 600; line-height: 1.25; color: #fff; border: none; margin: 0; padding: 0; text-shadow: 0 0 7px rgba(0,0,0,.75); } #deals .offer .boxBody { font-size: 16px; font-weight: 400; color: #fff; text-shadow: 0 0 7px rgba(0,0,0,.75); } #deals .offer:hover .boxHeader, #deals .offer .boxBody { transform: translateY(-50%) scale(0); transition-delay: 0s; } #deals .offer .boxHeader, #deals .offer:hover .boxBody { transform: translateY(-50%) scale(1); transition-delay: .25s; } #deals .slick-arrow { display: block; background: #fff; width: 48px; height: 48px; color: #3C3C3B; border: 1px solid #E3DFD7; border-radius: 50%; cursor: pointer; position: absolute; top: 50%; z-index: 20; overflow: hidden; transform: translateY(-50%); } #deals .slick-arrow:hover { background: #3C3C3B; color: #fff; border-color: #3C3C3B; } #deals .slick-arrow.slick-disabled:hover { background: #fff; color: #3C3C3B; border-color: #E3DFD7; cursor: auto; } #deals .slick-arrow.prev { left: -10px; } #deals .slick-arrow.next { right: -10px; } #deals .slick-arrow::before { content: '\f104'; width: 100%; height: 100%; font-size: 32px; transform: translateX(-1px); } #deals .slick-arrow.slick-disabled::before { opacity: .2; } #deals .slick-arrow.next::before { content: '\f105'; transform: translateX(1px); } /* KONTAKT LINKS */ #contactBar .ctaLink .boxHeader { transform: translateY(-50%); } /* BOX */ #main .box { background: #fff; display: block; width: 100%; font-size: 1em; text-align: left; padding: 15px; margin-top: 15px; border: 1px solid #E3DFD7; border-radius: 8px; position: relative; } #main .blog img { width: 100%; } #main .box *:first-child { margin-top: 0; } #main .news *:nth-child(-n+2) { margin-top: 0; } #main .news .date { font-size: 16px; font-weight: 400; line-height: 32px; background: #716663; color: #fff; padding: 0 18px; float: right; margin: -16px -16px 10px 10px; border-radius: 0 8px 0 8px; } #main .news img { padding-top: 15px; } #main .news h4 { color: #4e4640; margin: 10px 0; } /* ADDONBOX */ #main .addonArea { max-width: 980px; margin: 0 auto; padding-top: 15px; } #main .addon.icon { padding-left: 55px; } #main .addon::before { width: 32px; height: 32px; font-size: 32px; line-height: 1; color: #3C3C3B; position: absolute; top: 50%; left: 10px; margin-top: -16px; } #main .addon.clock::before { content: '\e800'; } #main .addon.bulb::before { content: '\f0eb'; } #main .addon.attention::before { content: '\e80a'; font-size: 28px; margin-top: -14px; } #main .addon.talk::before { content: '\f0e6'; } #main .addon.marker::before { content: '\e809'; } #main .addon.pdf { padding-left: 55px; padding-right: 80px; font-weight: 400; } #main .addon.pdf::before { content: ''; background-image: url(/gfx/icon-pdf.svg); background-repeat: no-repeat; background-position: center center; background-size: auto 100%; } #main .addon.pdf h2 { font-size: 17px; color: #3C3C3B; } #main .addon.pdf .loadSize { font-size: 14px; line-height: 1; color: #000; position: absolute; position: absolute; top: 50%; right: 15px; margin-top: -7px; } #main .addon.pdf:hover { box-shadow: 0 0 7px 1px rgba(0,0,0,.2); } #main .addon.pdf:hover h2 { color: #438d45; } .alert { font-size: .8em; position: relative; padding-left: 32px; } .alert::before { content:'\e80a'; display: block; font-size: 22px; line-height: 22px; width: 22px; height: 22px; color: #B91547; position: absolute; top: 50%; left: 0; margin-top: -11px; } /* ZIMMER */ #main .room img.roomImg { border-radius: 8px; } #main .roomGallery { margin-top: 30px; } #main .roomGallery .gallery { justify-content: left; } /* BILDER */ .picBanner, .pic3left, .pic3right { display: block; width: 100%; height: auto; margin: 15px 0 0 0; border-radius: 6px; } #content .db { width: 234px; height: 60px; float: right; margin: 15px 0 15px 15px; } /* TABELLEN + LISTEN */ table { width: 100%; font-size: 1em; line-height: 1.35; margin-top: 25px; } table a, table p { font-weight: 400; } table p { margin-top: 5px; font-size: 16px; } table td, table th { background: #fff; padding: 8px 10px; text-align: left; vertical-align: top; border-radius: 4px; } table th { font-weight: 600; background: #716663; color: #fff; } table th.divider { background: #fff; color: #3C3C3B; } table.planTable tr.plan { display: none; } table.alignRight th:nth-child(n+2), table.alignRight td:nth-child(n+2) { text-align: right; white-space: nowrap; } #main ul, #main ol { padding-left: 20px; margin-top: 15px; } #main ul li, #main ol li { padding: 3px 0; } /* SITEMAP + STELLENANGEBOTE */ #main ul.sitemap, #main ul.hc-joblist-offer-list { padding: 0; list-style-type: none; } #main ul.sitemap li { padding: 8px 0; } #main ul.sitemap li a, #main a.hc-joblist-offer-link { font-size: 20px; padding-left: 15px; position: relative; display: inline-block; text-decoration: none; } #main ul.sitemap a::before, #main a.hc-joblist-offer-link::before { content: '\f105'; font-size: inherit; position: absolute; top: 0; left: 2px; } #main ul.sitemap span.sectionheader { font-size: 20px; padding-left: 15px; display: inline-block; font-weight: 600; } #main ul.sitemap li p { font-size: 15px; margin: 0; padding: 2px 0 0 16px; } #main ul.sitemap ul { padding: 8px 0 8px 35px; margin: 0; border: none; list-style-type: none; } #main ul.sitemap ul li a { font-size: 17px; } #main ul.hc-joblist-offer-list { padding: 20px 0; } #main span.hc-joblist-offer-date { display: block; width: 100%; font-size: 14px; color: #3C3C3B; margin: 0 0 10px 0; } #main li.hc-joblist-listitem { padding: 15px 0; border-top: 1px solid #c3c1c0; } #main li.hc-joblist-listitem:last-child { border-bottom: 1px solid #c3c1c0; } #main a.hc-joblisten-logo { display: block; float: right; } /* GOOGLE MAPS */ .responsiveContainer { width: 100%; position: relative; padding-top: 15px; padding-bottom: 70%; height: 0; margin: 0 0 15px 0; overflow: hidden; } .video.responsiveContainer { padding-bottom: 55.1%; } #gmap.responsiveContainer { padding-bottom: 60%; margin: 0; } #notice { font-size: 16px; padding: 5px; white-space: nowrap; text-align: center; } #notice h4 { font-size: 17px; line-height: 120%; padding: 0; margin: 0; } #notice p { margin-top: 5px; } #notice .btn { margin-top: 10px; } #map, .video iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* GALLERY */ #main .gallery { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -5px; } #main .gallery a.group { width: calc(50% - 10px); margin: 10px 5px 0 5px; position: relative; overflow: hidden; border-radius: 6px; } #main .gallery a.group::after { content: ''; position: absolute; left: 3%; right: 3%; top: 4%; bottom: 4%; border: 1px solid rgba(255,255,255,.7); border-radius: 5px; z-index: 10; } #main .gallery a.group:hover img { transform: scale(1.05); } #main .gallery a.group:hover::after { left: 0; right: 0; top: 0; bottom: 0; border-color: rgba(255,255,255,0); } #main section[id*="pageGallery"] .separator { margin-bottom: 20px; } /* SEPARATOR */ #main .separator { width: 100%; padding: 10px 0; margin-bottom: 30px; position: relative; text-align: center; clear: both; } #main .separator h2 { font-size: 24px; margin: 0; } #main .separator::before, #main .separator::after { content:''; background: #c3c1c0; width: 35%; height: 2px; position: absolute; top: 85%; left: 15%; } #main .separator::after { left: auto; right: 15%; } #main .separator.signet i { display: block; width: 50px; height: 50px; margin: 0 auto; background-image: url(/gfx/logo-alpenhof-signet.svg); background-position: center center; background-repeat: no-repeat; background-size: 100% 100%; } #main .separator.signet::before, #main .separator.signet::after { width: calc(40% - 50px); top: 50%; left: 10%; } #main .separator.signet::after { left: auto; right: 10%; } /* KONTAKTFORMULAR */ .contactform { text-align: left; margin: 0 auto; } .contactform fieldset { border: none; } .contactform legend { display: block; width: 100%; font-size: 18px; font-weight: 600; color: #438d45; padding-top: 20px; border-bottom: 1px solid #c9c9c9; } .contactform .form-group { margin-top: 15px; position: relative; } label, input, select { display: inline-block; font-size: 1em; line-height: 1; font-weight: 400; border: none; border-radius: 0; vertical-align: middle; -webkit-appearance: none; -moz-appearance: none; appearance: none; } fieldset label { line-height: 1.8; margin-right: 15px; } fieldset .form-control { background-color: #fff; height: 40px; line-height: 40px; padding-left: 10px; border: 1px solid #c9c9c9; border-radius: 4px; } fieldset input.form-control:focus { border-color: #3C3C3B; } fieldset select.form-control { padding-right: 36px; background-image: url(/gfx/arrow.png); background-position: right 2px; background-repeat: no-repeat; background-size: 34px auto; margin: 0 15px 15px 0; } fieldset select::-ms-expand { display: none; } .contactSelect label, .infoSelect label { font-size: .9em; } .contactSelect .form-control, .infoSelect .form-control { width: 100%; } .channelSelect .misc .form-control { width: 100%; } .dateSelect label { width: 75px; margin: 0; } .dateSelect input.form-control { min-width: 150px; padding-left: 45px; position: relative; cursor: pointer; } .dateSelect .form-group i { background: #c9c9c9; color: #fff; width: 40px; height: 40px; font-size: 1em; line-height: 40px; text-align: center; border-radius: 4px 0 0 4px; position: absolute; top: 0; left: 75px; } .dateSelect .form-group input:focus ~ i { background: #3C3C3B; } .personSelect select { min-width: 170px; } .kidsAge select { min-width: 116px; } .roomSelect label { padding-top: 4px; padding-bottom: 4px; } /* NORMALIZE RADIO + CHECKBOX */ .contactform input[type='checkbox']:checked, .contactform input[type='checkbox']:not(:checked), .contactform input[type='radio']:checked, .contactform input[type='radio']:not(:checked) { width: 0; height: 0; background: transparent; position: absolute; } .contactform input[type='checkbox'] + label, .contactform input[type='radio'] + label { cursor: pointer; position: relative; padding-left: 30px; } .contactform input[type='checkbox']:checked + label::before, .contactform input[type='checkbox']:not(:checked) + label::before, .contactform input[type='radio']:checked + label::before, .contactform input[type='radio']:not(:checked) + label::before { content:''; background: #fff; display: inline-block; width: 18px; height: 18px; position: absolute; top: 50%; left: 0; border: 1px solid #c9c9c9; margin-top: -9px; } .contactform input[type='checkbox']:hover + label::before, .contactform input[type='radio']:hover + label::before { background: #c9c9c9; box-shadow: inset 0 0 0 3px #fff; } .contactform input[type='checkbox']:checked + label::before, .contactform input[type='radio']:checked + label::before { background: #438d45; box-shadow: inset 0 0 0 3px #fff; } .commentSelect label { display: none; } .commentSelect textarea { width: 100%; height: 150px; line-height: 1.3; padding: 10px; border: 1px solid #c9c9c9; border-radius: 4px; } .contactform .privacySelect label { font-size: 16px; line-height: 1.3; } .contactform .privacySelect input[type='checkbox'] + label::before { top: 3px; margin: 0; } .contactform .buttonCol { padding-top: 15px; margin-bottom: 15px; } .contactform .buttonCol .btn { width: 180px; } #voucher .buttonCol .btn { width: 240px; } /* FEHLERMELDUNGEN + SPAM */ #main .contactform .form-row.hpsp { height: 0; overflow: hidden; visibility: hidden; } #main ul.error { background: #fff; list-style-type: none; color: #c00; padding: 10px 15px; margin-top: 30px; margin-bottom: 0; border: 3px solid #bb0000; } .contactform div.error { display: block; width: 100%; font-size: .8em; color: #c00; line-height: 1.25; margin: 0; padding-top: 5px; } .contactform input.error, fieldset input.error:focus { border-color: #c00; } .dateSelect .form-group input.error ~ i { background: #c00; } /* GUTSCHEINE */ #voucher .selectChange div.form-check { position: relative; margin-bottom: 4%; } #voucher .selectChange label { display: block; background: #fff; width: 100%; height: 100%; line-height: 1.3; text-align: center; margin: 0; padding: 0; border-radius: 4px; border: 1px solid #ccc; overflow: hidden; } #voucher .selectChange input[type='radio']:checked + label::before, #voucher .selectChange input[type='radio']:not(:checked) + label::before { display: none; } #voucher .amount, #voucher .motiv { display: flex; flex-wrap: wrap; justify-content: space-between; } #voucher .amount div.form-check { flex-basis: 48%; } #voucher .amount label { font-size: 24px; line-height: 50px; } #voucher .amount input[type="radio"]:checked + label { background: #438d45; color: #fff; border-color: #438d45; } #voucher .motiv div.form-check { flex-basis: 100%; } #voucher .motiv label { opacity: .5; } #voucher .motiv label span { text-indent: -9999px; display: none; } #voucher .motiv label img { display: block; width: 100%; height: auto; -webkit-filter: grayscale(75%); filter: grayscale(75%); pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #voucher .motiv input[type="radio"]:checked + label { opacity: 1; } #voucher .motiv input[type="radio"]:checked + label img { -webkit-filter: none; filter: none; } /* KARRIERE */ #experience .expBox { width: 100%; position: relative; margin-top: 20px; } #experience .expBox h2 { padding-left: 36px; margin-top: 0;} #experience .expBox p { margin-top: 5px;} #experience .expBox::before { width: 22px; height: 22px; font-size: 22px; line-height: 1; color: #438d45; position: absolute; top: 3px; left: 0; } #experience .expBox.euro::before { content: '\f153'; top: 4px; } #experience .expBox.family::before { content: '\e802'; } #experience .expBox.clock::before { content: '\e800'; } #experience .expBox.award::before { content: '\e803'; } #experience .expBox.sun::before { content: '\f185'; } #experience .expBox.badge::before { content: '\e804'; top: 4px; } /* FAQ */ #main .expand.box { padding: 0; overflow: hidden; } #main.start .expand.box { margin-top: 30px; } #faq .expand.box:last-child { margin-bottom: 0; } #main .expand h2 { font-size: 18px; color: #333; padding: 15px 45px 15px 15px; margin: 0; cursor: pointer; position: relative; } #main .expand h2::after { font-size: 22px; line-height: 22px; color: #666; position: absolute; top: 50%; right: 12px; margin-top: -11px; } #main .expand h2.off::after { content: '\e805'; } #main .expand h2.on::after { content: '\e806'; } #main .expand h2:hover, #main .expand h2:hover::after, #main .expand h2.on, #main .expand h2.on::after { color: #438d45; } #main .expand .panel { display: none; background: #fff; padding: 0 15px 15px 15px; } .no-js #main .expand h2::after { display: none; } .no-js #main .expand .panel { display: block; } #main .expand ul { list-style-type: none; margin: 0; padding: 0; } #main .expand ul li { display: block; padding: 5px 0 5px 15px; position: relative; } #main .expand ul li::before { content: '\f105'; font-size: inherit; position: absolute; top: 4px; left: 0; } #faq .careerContact { background: #438d45; color: #fff; } #faq .careerContact h2 { color: #fff; margin: 0; padding: 0; } #appArea .expArea, #appArea .confirm, #appArea .error, #application { max-width: 980px; margin: 0 auto; } #appArea .confirm { padding-top: 30px; } #application { padding-top: 15px; } #appArea .appBox { width: 100%; position: relative; margin-bottom: 20px; } #appArea .appBox h4 { margin-top: 0;} #appArea .appBox p { margin: 0; } /* BUTTONS */ .btn { display: inline-block; background: #716663; font-size: 1.125em; font-weight: 400; line-height: 40px; color: #fff !important; border: none; border-radius: 4px; vertical-align: top; padding: 0 20px; margin-top: 15px; text-decoration: none; cursor: pointer; position: relative; overflow: hidden; z-index: 10; } .btn::after { content: ''; width: 200%; height: 100%; position: absolute; top: 0; left: -200%; z-index: -1; background: rgb(67,141,69); background: linear-gradient(to right, rgba(67,141,69,1) 0%,rgba(67,141,69,1) 50%,rgba(113,103,99,1) 100%); } .btn:hover::after { left: 0; } .buttonCol { width: 100%; display: table; padding-top: 5px; text-align: center; } .buttonCol.offer { display: block; padding-top: 20px; text-align: left; } .buttonCol .btn { margin: 15px 7px 0 7px; } .buttonCol .btn-left { float: left; margin: 15px 0 0 0; } .buttonCol .btn-right { float: right; margin: 15px 0 0 15px; } /* BUCHUNGSBUTTON */ #onepagebooking a { display: block; background: #82706c; color: #fff; font-size: 16px; text-decoration: none; text-transform: uppercase; text-align: right; padding: 7px 15px 5px 15px; position: relative; overflow: hidden; z-index: 10; } #onepagebooking a::after { content: ''; width: 200%; height: 100%; position: absolute; top: 0; left: -200%; z-index: -1; background: rgb(67,141,69); background: linear-gradient(to right, rgba(67,141,69,1) 0%,rgba(67,141,69,1) 50%,rgba(130,112,108,1) 100%); } #onepagebooking a:hover::after { left: 0; } #stickyBooking { display: block; width: 1px; height: 1px; position: absolute; bottom: 0; left: 0; } .fixedBooking #emotion { z-index: 1000; } .fixedBooking #onepagebooking { display: block; width: 100%; position: fixed; top: 0; left: 0; } /* CONTENTLOADER */ #privacy-settings { background: rgba(255,255,255,.5); width: 100%; height: auto; position: absolute; top: 50%; left: 0; padding: 15px; text-align: center; transform: translateY(-50%); z-index: 100; } .contentLoader { background: #fff; padding: 20px; margin: 30px 0; text-align: center; border: 1px solid #c9c9c9; border-radius: 8px; z-index: 100; position: relative; } #privacy-settings p:first-child, .contentLoader p:first-child { margin: 0; } #privacy-settings .btn, .contentLoader .btn { margin-top: 20px; } #gmap { background-image: url(/gfx/mapPlaceholder.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; } /* PAGINATION BLOG */ #content .pagination { width: 100%; padding: 25px 0px 10px 0; text-align: center; } #content .paginationWrapper * { display: inline-block; margin: 0 3px; line-height: 1; height: 40px; } #content .paginationWrapper a { background: #fff; width: 40px; font-size: 24px; line-height: 37px; border: 1px solid #c9c9c9; border-radius: 50%; } #content .paginationWrapper a:hover { background: #438d45; color: #fff; border-color: #438d45; } /* NEWSLETTER */ .sh-container {position:relative;overflow:hidden;width:100%;} .sh-responsive-iframe {border:0;width:100%;height:100%;} /* COOKIEBAR */ #cookie-bar { background: rgba(0,0,0,.8); font-size: 15px; color: #fff; } #cookie-bar.fixed { width: 100%; position: fixed; top: 0; left: 0; } #cookie-bar.fixed.bottom { bottom: 0; top: auto; } #cookie-bar .widthFix { padding: 10px 15px; } #cookie-bar .message { padding-bottom: 65px; } #cookie-bar .message span { margin-right: 10px; } #cookie-bar a { color: #fff; text-decoration: none; } #cookie-bar .button { display: inline-block; background: #438d45; font-size: 1em; line-height: 40px; text-transform: uppercase; color: #fff !important; border: none; border-radius: 4px; padding: 0 15px; position: absolute; bottom: 15px; right: 15px; } #cookie-bar .cb-enable { right: 15px; } #cookie-bar .cb-disable { right: 150px; } #cookie-bar a.button:hover { background: #438d45; } #cookie-bar a.button.cb-enable:hover { background: #01ba12; } /* table fix ---------------------------- */ @media screen and (max-width: 600px) { /* Force table to not be like tables anymore */ table.responsive, table.responsive tbody, table.responsive tr, table.responsive th, table.responsive th.divider, table.responsive td { display: block; } /* Hide table headers */ table.responsive th:nth-of-type(n+2) { display: none; } table.responsive td:nth-of-type(1) { margin-bottom: 2px; } table.responsive td:nth-of-type(n+2) { position: relative; padding-left: 40%; text-align: right; margin-bottom: 2px; } table.responsive td:nth-of-type(n+2)::before { content:attr(data-label); position: absolute; top: 8px; left: 10px; white-space: nowrap; text-align: left; } table.responsive th.divider { background: #3C3C3B; color: #fff; margin-bottom: 2px; } } /* little fixes ---------------------------- */ @media screen and (min-width: 370px) { #header .hotline * { font-size: 18px; } .pic3left { float: left; width: 33%; margin: 4px 15px 10px 0; } .pic3right { float: right; width: 33%; margin: 4px 0 10px 15px; } /* GUTSCHEINE */ #voucher .amount::after { content: ''; width: 31%; } /* Flexbox float left fix */ #voucher .amount div.form-check { flex-basis: 31%; } #voucher .motiv div.form-check { flex-basis: 48%; } } /* Landscape phone to portrait tablet ---------------------------- */ @media screen and (min-width: 480px) { #header { height: 60px; } #header .topCol { padding-top: 12px; } #header .hotline { position: relative; top: 0; right: 0; float: right; } #toggleNavbar { top: 6px; } #mainNav { top: 60px; } #emotion .slick-arrow { width: 36px; } #emotion .slick-arrow::before { font-size: 50px; } #emotion ul.slick-dots { height: 12px; bottom: 10px; } #emotion li { margin: 0 4px; } #emotion li button { width: 12px; height: 12px; } #main { padding: 15px 0; } #main .widthFix { max-width: 600px; padding: 0 20px; } #footer .column { padding: 0 20px; } /* SUBNAV ÜBERSICHT */ #subNav .navItem .boxBody { padding: 10px 15px; } /* ANGEBOTE ÜBERSICHT + KONTAKT LINKS */ #deals .offer div, #contactBar .ctaLink div { padding: 0 12%; } #deals .offer .boxHeader h3, #contactBar .ctaLink .boxHeader h3 { font-size: 34px; font-size: 7vw; } #deals .offer .boxBody { font-size: 18px; } #deals .slick-arrow.prev { left: -15px; } #deals .slick-arrow.next { right: -15px; } /* BOX */ #main .box { margin-top: 20px; } #main .blog img { width: 32%; float: right; margin: 0 0 10px 25px; } #main .blog h2 { margin: 0; } /* ADDONBOX */ #main .addon.icon, #main .addon.pdf { padding-left: 65px; } #main .addon::before { left: 15px; } #main .addon.pdf h2 { font-size: 18px; } /* FAQ */ #main.start .expand.box { margin-top: 40px; } #main .expand h2 { font-size: 21px; } #main .expand h2::after { font-size: 24px; line-height: 24px; margin-top: -12px; } /* GALLERY */ #main .gallery { margin: 0 -7px; } #main .gallery a.group { width: calc(33.3% - 14px); margin: 14px 7px 0 7px; } #main section[id*="pageGallery"] .separator { margin-bottom: 16px; } /* BUCHUNGSBUTTON */ #onepagebooking a { font-size: 18px; padding: 7px 20px 5px 20px; } /* COOKIEBAR */ #cookie-bar { font-size: 16px; } #cookie-bar .widthFix { padding: 20px; } #cookie-bar .cb-enable { right: 20px; } #cookie-bar .cb-disable { right: 155px; } } /* logo height fix ---------------------------- */ @media screen and (min-width: 600px) { #header .topCol { padding: 12px 20px 0 20px; } #toggleNavbar { right: 20px; } #language-switch { margin-left: 30px; } #footer .column, #footer .colTop, #footer .colBottom { width: 50%; display: inline-block; vertical-align: top; } #footer .legal { width: 100%; } #footer .colTop { padding-right: 20px; } #footer .colBottom { padding-left: 20px; padding-top: 0; } #footer ul.nav.bestW { margin-top: 40px; } /* FOOTER ENDING */ #ending { padding: 15px; text-align: center; } /* ANGEBOTE ÜBERSICHT + KONTAKT LINKS */ #deals .offer .boxHeader h3, #contactBar .ctaLink .boxHeader h3 { font-size: 42px; } /* SEPARATOR */ #main .separator::before, #main .separator::after { width: calc(40% - 100px); top: 50%; left: 10%; } #main .separator::after { left: auto; right: 10%; } #main .separator.long::before, #main .separator.long::after { width: calc(40% - 150px); } /* KONTAKTFORMULAR */ .contactform legend { padding-top: 25px; } .contactform .form-group { margin-top: 20px; } .contactform .form-group.misc { margin-top: 5px; } .contactSelect .form-row { display: flex; justify-content: space-between; align-items: flex-start; } .contactSelect .form-row .form-group { flex-basis: 48.5%; } .contactSelect .form-row.asym .form-group { flex-basis: 63%; } .contactSelect .form-row.asym .form-group:first-child { flex-basis: 34%; } .infoSelect label { width: 210px; display: inline-block; } .infoSelect .form-control { width: calc(100% - 225px); max-width: 340px; display: inline-block; } .dateSelect .form-group, .roomSelect .form-check { width: auto; display: inline-block; margin-right: 30px; vertical-align: top; } .roomSelect .form-check { margin-right: 20px; } .channelSelect .misc .form-control { width: 300px; } .contactform textarea { height: 200px; padding: 15px; } /* KARRIERE */ #experience .expArea { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -10px; } #experience .expArea .expBox { width: calc(50% - 20px); margin: 20px 10px 0 10px; } #experience .separator { margin-top: 10px; margin-bottom: 10px; } #experience .separator.long::before, #experience .separator.long::after { width: calc(40% - 170px); } /* TABELLEN + LISTEN */ table td, table th { padding: 9px 12px; } table.planTable tr.plan { display: table-row; } table.planTable tr.plan td { line-height: 0; } table.planTable tr.plan td::before { content: ''; display: block; width: 50px; height: 50px; background-image: url(/gfx/planSprite.svg); background-repeat: no-repeat; background-position: 0 0; background-size: auto 100%; margin: 0 auto; } table.planTable tr.plan td:nth-of-type(1)::before { display: none; } table.planTable tr.plan td:nth-of-type(2)::before { background-position: 0 0; } table.planTable tr.plan td:nth-of-type(3)::before { background-position: 25% 0; } table.planTable tr.plan td:nth-of-type(4)::before { background-position: 50% 0; } table.planTable tr.plan td:nth-of-type(5)::before { background-position: 75% 0; } table.planTable tr.plan td:nth-of-type(6)::before { background-position: 100% 0; } } /* Portrait tablet to landscape and desktop ------------------------------------- */ @media screen and (min-width: 768px) { h1 { font-size: 36px; } h2 { font-size: 24px; } h1 + h2 { font-size: 22px; } span.title { font-size: 16px; } #header .topCol { padding: 12px 25px 0 25px; } #header .hotline span { display: inline-block; } #toggleNavbar { right: 25px; } #logo { height: 30%; top: 40px; } #main .widthFix { max-width: 1440px; padding: 0 25px; } #main section { padding: 20px 0; } #footer .column { padding: 0 25px 20px 25px; } #footer .identity .brand { display: block; width: 233px; height: 40px; background-image: url(/gfx/logo-alpenhof-mobile.png); background-repeat: no-repeat; background-position: 0 0; background-size: 100% auto; text-indent: -9999px; } #footer .colTop { padding-right: 25px; } #footer .colBottom { padding-left: 25px; } /* SUBNAV ÜBERSICHT */ #main section#subNav { width: auto; display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 0; margin: 0 -10px; } #subNav .navItem { width: calc(50% - 20px); margin: 0 10px 20px 10px; } /* ANGEBOTE ÜBERSICHT */ #deals { width: auto; margin: 0 -10px; } #deals .offer { margin: 0 10px; } #deals .offer .boxHeader h3 { font-size: 26px; font-size: 3.8vw; } #deals .slick-arrow.prev { left: -10px; } #deals .slick-arrow.next { right: -10px; } /* ANGEBOTE Unterseite */ #deals .offersOverview { width: auto; display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 0; margin: 0 -10px; } #deals .offersOverview .offer { width: calc(50% - 20px); margin: 0 10px 20px 10px; } /* KONTAKT LINKS */ #contactBar .contactLinks { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -10px; } #contactBar .ctaLink { width: calc(50% - 20px); margin: 0 10px 20px 10px; } #contactBar .ctaLink div { padding: 0 10%; } #contactBar .ctaLink .boxHeader h3 { font-size: 26px; font-size: 3.8vw; } /* BOX */ #main .blog img { width: 25%; } /* ADDONBOX */ #main .addon.icon { padding-left: 100px; min-height: 70px; } #main .addon::before { width: 52px; height: 52px; font-size: 52px; left: 20px; margin-top: -26px; } #main .addon.attention::before { font-size: 46px; margin-top: -23px; } #main .addon.pdf { padding: 25px 80px 25px 100px; } #main .addon.pdf::before { width: 44px; height: 44px; left: 23px; margin-top: -22px; } #main .addon.pdf .loadSize { right: 20px; } /* GALLERY */ #main .gallery { margin: 0 -10px; } #main .gallery a.group { width: calc(33.3% - 20px); margin: 20px 10px 0 10px; } #main section[id*="pageGallery"] .separator { margin-bottom: 20px; } /* SEPARATOR */ #main .separator { margin-bottom: 40px; } #main .separator h2 { font-size: 28px; } #main .separator::before, #main .separator::after { width: calc(40% - 120px); } #main .separator.signet i { width: 60px; height: 60px; } #main .separator.signet::before, #main .separator.signet::after { width: calc(40% - 70px); } #main .separator.long::before, #main .separator.long::after { width: calc(40% - 180px); } /* TABELLEN + LISTEN */ table td, table th { padding: 10px 15px; } /* TABELLEN + LISTEN */ table.planTable tr.plan td::before { width: 60px; height: 60px; } /* BUTTONS */ .buttonCol { padding-top: 10px; } .room .buttonCol { padding-top: 15px; text-align: right; } .room .buttonCol .btn { margin-left: 15px; margin-right: 0; } /* BUCHUNGSBUTTON */ #onepagebooking { width: auto; position: absolute; right: 0; top: 40px; } #onepagebooking a { background: #438d45; color: #fff; font-size: 22px; padding: 10px 25px 8px 30px; border-radius: 7px 0 0 7px; box-shadow: 0 0 8px 2px rgba(0,0,0,.3); } #onepagebooking a::after { background: rgb(60,60,59); background: linear-gradient(to right, rgba(255,255,255,1) 0%,rgba(255,255,255,1) 50%,rgba(67,141,69,1) 100%); } #onepagebooking a:hover { color: #438d45; } #stickyBooking { top: 0; bottom: auto; } .fixedBooking #onepagebooking { display: inline-block; width: auto; position: fixed; top: 40px; left: auto; } /* GUTSCHEINE */ #voucher .amount::after { display: none; } #voucher .amount div.form-check { flex-basis: 18%; } /* KARRIERE */ #experience .expArea { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -15px; } #experience .expArea .expBox { width: calc(50% - 30px); margin: 25px 15px 0 15px; } #experience .expBox::before { width: 24px; height: 24px; font-size: 24px; } #experience .separator { margin-top: 20px; margin-bottom: 20px; } #experience .separator.long::before, #experience .separator.long::after { width: calc(40% - 190px); } #careerNews .blog img { max-width: 200px; } /* FAQ */ #faq .faqItems { width: calc(100% - 300px); display: inline-block; vertical-align: top; } #faq .careerContact { width: 280px; display: inline-block; vertical-align: top; margin-left: 20px; } #faq .separator { margin-bottom: 20px; } /* PAGINATION BLOG */ #content .pagination { padding: 30px 0px 15px 0; } #content .paginationWrapper * { margin: 0 7px; height: 50px; } #content .paginationWrapper a { width: 50px; font-size: 28px; line-height: 47px; } /* COOKIEBAR */ #cookie-bar .widthFix { padding: 20px 25px; } #cookie-bar .message { padding: 0 270px 0 0; } #cookie-bar .button { bottom: auto; top: 50%; right: 25px; margin-top: -20px; } #cookie-bar .cb-disable { right: 160px; } } /* desktop small ------------------------------------------- */ @media screen and (min-width: 992px) { h1 { font-size: 30px; } h2 { font-size: 22px; } h1 + h2 { font-size: 20px; } span.title { font-size: 15px; margin-top: 8px; } #header { position: fixed; top: 0; left: 0; z-index: 10000; box-shadow: 0 4px 8px rgba(0,0,0,.3);} #header .topCol { width: 320px; float: right; padding: 12px 15px; position: relative; z-index: 1100; } #header .hotline * { font-size: 15px; } #language-switch { margin-left: 15px; } #toggleNavbar { display: none; } #stickyFix { display: block !important; width: 1px; height: 1px; position: absolute; top: 0; left: 0; } .translated-ltr .fixed #headerNav, .translated-ltr .fixed #header { top: 39px; } .translated-ltr #stickyFix { top: 15px; } #mainNav { background: transparent; overflow: visible; position: absolute; top: 0; left: 0; z-index: 1000; } #mainNav .widthFix { padding: 0 8px; } #menu { width: auto; float: left; opacity: 1; max-height: 1000px; overflow: visible; } #menu ul li { float: left; margin-left: 1px; overflow: hidden; } #menu ul li:hover { overflow: visible; } #menu ul li a { color: #3C3C3B; font-size: 15px; font-weight: 600; line-height: 60px; padding: 0 6px; border: none; } #menu ul li:hover > a { background: #716663; color: #fff;} #menu ul li span.more { display: none; } /* ZWEITE MENÜEBENE */ #menu ul ul { max-height: none; padding: 0; position: absolute; top: 60px; left: 0; } #menu > ul > li:last-child ul { left: auto; right: 0; } #menu ul ul li { margin: 1px 0 0 0; float: none; overflow: visible; } #menu ul ul li a { max-height: 0; background: #fff; color: #3C3C3B; width: 100%; font-size: 15px; line-height: 42px; padding: 0 6px; white-space: nowrap; } #menu ul li:hover ul li a { max-height: 42px; } #menu ul ul li a:hover, #menu ul li a.current, #menu ul ul li.active a { background: #716663; } #emotion { margin-top: 60px; } #emotion .slick-arrow { width: 45px; height: 100%; top: 0; } #emotion .slick-arrow::before { font-size: 60px; } #emotion ul.slick-dots { bottom: 15px; } #main section { padding: 30px 0; } #content .left, #content .right { display: inline-block; vertical-align: top; } #content .left { width: 40%; text-align: right; padding-right: 30px; } #content .right { width: 60%; margin-top: -4px; } #content .right > *:first-child { margin-top: 10px; } #footer .identity { width: 38%; } #footer .footerNav, #footer .legal { width: 31%; } #footer .colTop, #footer .colBottom { width: 100%; padding: 0; } #footer .colBottom { padding-top: 25px; } #footer ul.nav.bestW { margin-top: 88px; } /* SUBNAV ÜBERSICHT */ #main section#subNav { margin: 0 -15px; } #subNav .navItem { width: calc(50% - 30px); margin: 0 15px 30px 15px; } #subNav .navItem .boxBody { padding: 15px; max-height: 52px; } #subNav .navItem .boxBody h3 { font-size: 22px; } /* VERSETZE ANORDNUNG */ #subNav.offset .navItem:nth-child(4n-2), #subNav.offset .navItem:nth-child(4n-1) { width: calc(40% - 30px); height: 340px; } #subNav.offset .navItem:nth-child(4n+0), #subNav.offset .navItem:nth-child(4n+1) { width: calc(60% - 30px); height: 340px; } #subNav.offset .navItem img { width: auto; height: 122%; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); } #subNav.offset .navItem:nth-child(4n-2) img, #subNav.offset .navItem:nth-child(4n-1) img { height: 100%; } #subNav.offset .navItem:hover img { transform: translateX(-50%) translateY(-50%) scale(1.05); } /* ANGEBOTE ÜBERSICHT */ #deals { width: 100%; margin: 0; } #deals .offer { margin: 0 15px; } #deals .offer .boxHeader h3 { font-size: 38px; font-size: 3.6vw; } #deals .slick-arrow.prev { left: -10px; } #deals .slick-arrow.next { right: -10px; } /* ANGEBOTE Unterseite */ #deals .offersOverview { margin: 0 -15px; } #deals .offersOverview .offer { width: calc(50% - 30px); margin: 0 15px 30px 15px; } /* KONTAKT LINKS */ #contactBar .ctaLink { width: calc(33.3% - 20px); margin: 0 10px; } #contactBar .ctaLink .boxHeader h3 { font-size: 30px; font-size: 2.8vw; } /* BOX */ #main .blog img { width: 30%; } /* ADDONBOX */ #main .addonArea { padding-top: 30px; } #main .addon.icon { padding-left: 110px; min-height: 80px; } #main .addon::before { width: 64px; height: 64px; font-size: 64px; margin-top: -32px; } #main .addon.attention::before { font-size: 54px; margin-top: -27px; } #main .addon.pdf { padding: 25px 100px 25px 110px; } #main .addon.pdf::before { width: 50px; height: 50px; left: 27px; margin-top: -25px; } #main .addon.pdf h2 { font-size: 20px; } #main .addon.pdf .loadSize { font-size: 16px; margin-top: -8px; } /* ZIMMER */ #main .roomContent, #main .roomGallery { display: inline-block; vertical-align: top; } #main .roomContent { width: 66%; background: #fff; padding: 15px; margin: -75px 0 0 15px; border: 1px solid #c9c9c9; border-radius: 8px; box-shadow: 0 0 10px 1px rgba(0,0,0,.2); } #main .roomContent > *:first-child { margin-top: 0; } #main .roomContent h2 { font-size: 28px; } #main .roomContent table td, #main .roomContent table th.divider { background: #f2ede9; } #main .roomGallery { width: calc(34% - 15px); margin: 0; padding: 30px 0 0 30px; } #main .roomGallery .gallery { justify-content: right; margin: 0 -8px; } #main .roomGallery .gallery a.group { width: calc(50% - 16px); margin: 0 8px 16px 8px; } #main .roomGallery a.group::after { display: none; } /* TABELLEN + LISTEN */ table td, table th { padding: 8px 10px; } /* TABELLEN + LISTEN */ table.planTable tr.plan td::before { width: 70px; height: 70px; } /* GALLERY */ #main .gallery a.group { width: calc(25% - 20px); } /* SEPARATOR */ #main .separator { padding: 0; margin-bottom: 60px; } /* BUTTONS */ .buttonCol { padding-top: 15px; } .buttonCol.offer { padding-top: 35px; } /* BUCHUNGSBUTTON */ #onepagebooking a { font-size: 24px; padding: 10px 30px 8px 35px; border-radius: 10px 0 0 10px; } #stickyBooking { top: -60px; } .fixedBooking #onepagebooking { top: 100px; } /* KARRIERE */ #experience .expArea { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -15px; } #experience .expArea .expBox { width: calc(33% - 30px); margin: 25px 15px 0 15px; } #experience .expBox::before { width: 22px; height: 22px; font-size: 22px; } #experience .separator { margin-top: 20px; margin-bottom: 35px; } /* FAQ */ #main .expand h2 { font-size: 22px; padding: 20px 45px 20px 20px; } #main .expand h2::after { right: 20px; } #main .expand .panel { padding: 0 20px 20px 20px; } #faq .faqItems { width: calc(100% - 350px); display: inline-block; vertical-align: top; } #faq .careerContact { width: 320px; display: inline-block; vertical-align: top; margin-left: 30px; padding: 20px; } #faq .separator { margin-bottom: 35px; } /* PAGINATION BLOG */ #content .pagination:first-child { padding: 0; } } /* headerNav Fix ------------------------------------------- */ @media screen and (min-width: 1100px) { #header .hotline * { font-size: 16px; } #menu ul li a { font-size: 16px; padding: 0 8px; } #menu ul ul li a { font-size: 16px; padding: 0 8px; } } /* desktop ------------------------------------------- */ @media screen and (min-width: 1200px) { body { font-size: 18px; } h1 { font-size: 40px; } h2 { font-size: 26px; } h3, h4 { font-size: 20px; } h2, h3, h4 { margin-top: 25px; } h1 + h2 { font-size: 26px; } span.title { font-size: 18px; } .pic3left { margin: 4px 20px 15px 0; } .pic3right { margin: 4px 0 15px 20px; } #header .topCol { padding: 12px 12px; } #header .hotline * { font-size: 17px; } #mainNav .widthFix { padding: 0 12px; } #menu ul li a { font-size: 17px; padding: 0 12px; } /* ZWEITE MENÜEBENE */ #menu ul ul li a { font-size: 17px; line-height: 48px; padding: 0 12px; } #menu ul li:hover ul li a { max-height: 48px; } #logo { height: 25%; top: 50px; } #main { padding: 20px 0; } #main .widthFix { padding: 0 40px; } #main section { padding: 40px 0; } #content .left { width: 50%; padding-right: 60px; } #content .right { width: 50%; } #footer { font-size: 18px; padding: 20px 0 0 0; } #footer .column { padding: 0 40px 40px 40px; } #footer .colHead h3 { font-size: 20px; } #footer .colBottom { padding-top: 37px; } #footer .arrow a, #footer .arrow a::before { line-height: 44px; } #footer ul.nav.bestW { margin-top: 99px; } #footer ul.nav.bestW a { line-height: 28px; } /* SUBNAV ÜBERSICHT */ #main section#subNav { margin: 0 -20px; } #subNav .navItem { width: calc(50% - 40px); margin: 0 20px 40px 20px; } #subNav .navItem .boxBody { padding: 15px 25px; max-height: 54px; } #subNav .navItem .boxBody h3 { font-size: 24px; } /* SUBNAV 3-SPALTIG */ #main section#subNav.threeCol { margin: 0 -15px; padding-bottom: 10px; } #subNav.threeCol .navItem { width: calc(33.3% - 30px); margin: 0 15px 30px 15px; } #subNav.threeCol .navItem .boxBody { padding: 15px 20px; max-height: 50px; } #subNav.threeCol .navItem .boxBody h3 { font-size: 20px; } #subNav.threeCol .navItem .boxBody p { font-size: 16px; } #subNav.threeCol .navItem:hover .boxBody { max-height: 100%; } /* VERSETZE ANORDNUNG */ #subNav.offset .navItem:nth-child(4n-2), #subNav.offset .navItem:nth-child(4n-1) { width: calc(40% - 40px); height: 400px; } #subNav.offset .navItem:nth-child(4n+0), #subNav.offset .navItem:nth-child(4n+1) { width: calc(60% - 40px); height: 400px; } /* ANGEBOTE ÜBERSICHT */ #deals .offer .boxHeader h3 { font-size: 26px; font-size: 2.2vw; } /* ANGEBOTE Unterseite */ #deals .offersOverview .offer { width: calc(33.3% - 30px); } /* KONTAKT LINKS */ #contactBar .contactLinks { margin: 0 -15px; } #contactBar .ctaLink { width: calc(33.3% - 30px); margin: 0 15px; } /* BOX */ #main .box { padding: 20px; margin-top: 25px; } #main .news .date { line-height: 36px; margin: -21px -21px 15px 15px; } /* ADDONBOX */ #main .addonArea { padding-top: 40px; } #main .addon.icon, #main .addon.pdf { padding-left: 120px; } #main .addon.pdf::before { left: 32px; } /* ZIMMER */ #main .roomContent { width: 60%; padding: 20px; margin: -90px 0 0 30px; border-radius: 8px; } #main .roomContent h2 { font-size: 30px; } #main .roomGallery { width: calc(40% - 30px); padding: 40px 0 0 40px; } #main .roomGallery .gallery a.group { width: calc(33.3% - 16px); } #main .room .addon.box { font-size: 16px; } /* GALLERY */ #main .gallery { margin: 0 -12px; } #main .gallery a.group { width: calc(25% - 24px); margin: 25px 12px 0 12px; } #main section[id*="pageGallery"] .separator { margin-bottom: 55px; } /* SEPARATOR */ #main .separator { margin-bottom: 80px; } #main .separator h2 { font-size: 32px; } #main .separator::before, #main .separator::after { width: calc(40% - 140px); } #main .separator.signet i { width: 70px; height: 70px; } #main .separator.signet::before, #main .separator.signet::after { width: calc(40% - 80px); } #main .separator.long::before, #main .separator.long::after { width: calc(40% - 210px); } /* TABELLEN + LISTEN */ table td, table th { padding: 10px 15px; } table.planTable tr.plan td::before { width: 70px; height: 70px; } /* BUTTONS */ .buttonCol { padding-top: 20px; } .buttonCol.offer { padding-top: 45px; } /* COOKIEBAR */ #cookie-bar .widthFix { padding: 20px 40px; } #cookie-bar .cb-enable { right: 40px; } #cookie-bar .cb-disable { right: 175px; } /* BUCHUNGSBUTTON */ #onepagebooking { top: 60px; } #onepagebooking a { font-size: 28px; padding: 12px 40px 10px 45px; border-radius: 12px 0 0 12px; } #stickyBooking { top: -50px; } .fixedBooking #onepagebooking { top: 108px; } /* KARRIERE */ #experience .expArea { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -20px; } #experience .expArea .expBox { width: calc(33% - 40px); margin: 40px 20px 0 20px; } #experience .expBox h2 { padding-left: 40px; } #experience .expBox::before { width: 26px; height: 26px; font-size: 26px; } #experience .separator { margin-bottom: 40px; } /* FAQ */ #faq .faqItems { width: calc(100% - 450px); } #faq .careerContact { width: 410px; margin-left: 40px; } #faq .separator { margin-bottom: 50px; } } /* Fix ------------------------------------------- */ @media screen and (min-width: 1440px) { #header .topCol { width: 340px; } #header .hotline * { font-size: 18px; } #language-switch { margin-left: 20px; } #menu ul li a { font-size: 18px; padding: 0 15px; } #menu ul ul li a { font-size: 18px; padding: 0 15px; } #deals .offer .boxHeader h3, #contactBar .ctaLink .boxHeader h3 { font-size: 36px; } /* BUCHUNGSBUTTON */ #onepagebooking { top: 70px; } table.planTable tr.plan td::before { width: 80px; height: 80px; } } @font-face { font-family: 'Poppins'; src: url('../font/Poppins-Bold.woff2') format('woff2'), url('../font/Poppins-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Poppins'; src: url('../font/Poppins-Light.woff2') format('woff2'), url('../font/Poppins-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Poppins'; src: url('../font/Poppins-Regular.woff2') format('woff2'), url('../font/Poppins-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Poppins'; src: url('../font/Poppins-SemiBold.woff2') format('woff2'), url('../font/Poppins-SemiBold.woff') format('woff'); font-weight: 600; font-style: normal; font-display: swap; } @font-face { font-family: 'fontello'; src: url('../font/fontello.eot?3077375'); src: url('../font/fontello.eot?3077375#iefix') format('embedded-opentype'), url('../font/fontello.woff2?3077375') format('woff2'), url('../font/fontello.woff?3077375') format('woff'), url('../font/fontello.ttf?3077375') format('truetype'), url('../font/fontello.svg?3077375#fontello') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"]::before, [class*="icon"]::before, #menu span.more::before, .expBox::before, #footer .nav a::before, .alert::before, .sitemap a::before, .expand h2::after, .expand ul li::before, .hc-joblist-offer-link::before { font-family: "fontello"; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; speak: none; display: inline-block; text-decoration: inherit; text-align: center; } .icon-clock:before { content: '\e800'; } /* '' */ .icon-calendar:before { content: '\e801'; } /* '' */ .icon-users:before { content: '\e802'; } /* '' */ .icon-award:before { content: '\e803'; } /* '' */ .icon-tag:before { content: '\e804'; } /* '' */ .icon-minus-circled:before { content: '\e805'; } /* '' */ .icon-plus-circled:before { content: '\e806'; } /* '' */ .icon-mail:before { content: '\e807'; } /* '' */ .icon-phone:before { content: '\e808'; } /* '' */ .icon-location:before { content: '\e809'; } /* '' */ .icon-attention:before { content: '\e80a'; } /* '' */ .icon-facebook:before { content: '\f09a'; } /* '' */ .icon-mail-alt:before { content: '\f0e0'; } /* '' */ .icon-chat:before { content: '\f0e6'; } /* '' */ .icon-lightbulb:before { content: '\f0eb'; } /* '' */ .icon-angle-left:before { content: '\f104'; } /* '' */ .icon-angle-right:before { content: '\f105'; } /* '' */ .icon-angle-up:before { content: '\f106'; } /* '' */ .icon-angle-down:before { content: '\f107'; } /* '' */ .icon-euro:before { content: '\f153'; } /* '' */ .icon-youtube:before { content: '\f167'; } /* '' */ .icon-instagram:before { content: '\f16d'; } /* '' */ .icon-sun:before { content: '\f185'; } /* '' */ .icon-whatsapp:before { content: '\f232'; } /* '' */ .icon-bed:before { content: '\f236'; } /* '' */ .icon-tripadvisor:before { content: '\f262'; } /* '' */ /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /*! fancyBox v3 */ body.compensate-for-scrollbar{overflow:hidden}.fancybox-active{height:auto}.fancybox-is-hidden{left:-9999px;margin:0;position:absolute!important;top:-9999px;visibility:hidden}.fancybox-container{-webkit-backface-visibility:hidden;backface-visibility:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;height:100%;left:0;position:fixed;-webkit-tap-highlight-color:transparent;top:0;-webkit-transform:translateZ(0);transform:translateZ(0);width:100%;z-index:99992}.fancybox-container *{box-sizing:border-box}.fancybox-bg,.fancybox-inner,.fancybox-outer,.fancybox-stage{bottom:0;left:0;position:absolute;right:0;top:0}.fancybox-outer{-webkit-overflow-scrolling:touch;overflow-y:auto}.fancybox-bg{background:#1e1e1e;opacity:0;transition-duration:inherit;transition-property:opacity;transition-timing-function:cubic-bezier(.47,0,.74,.71)}.fancybox-is-open .fancybox-bg{opacity:.87;transition-timing-function:cubic-bezier(.22,.61,.36,1)}.fancybox-caption,.fancybox-infobar,.fancybox-navigation .fancybox-button,.fancybox-toolbar{direction:ltr;opacity:0;position:absolute;transition:opacity .25s,visibility 0s linear .25s;visibility:hidden;z-index:99997}.fancybox-show-caption .fancybox-caption,.fancybox-show-infobar .fancybox-infobar,.fancybox-show-nav .fancybox-navigation .fancybox-button,.fancybox-show-toolbar .fancybox-toolbar{opacity:1;transition:opacity .25s,visibility 0s;visibility:visible}.fancybox-infobar{color:#ccc;font-size:13px;-webkit-font-smoothing:subpixel-antialiased;height:44px;left:0;line-height:44px;min-width:44px;mix-blend-mode:difference;padding:0 10px;pointer-events:none;text-align:center;top:0;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.fancybox-toolbar{right:0;top:0}.fancybox-stage{direction:ltr;overflow:visible;-webkit-transform:translateZ(0);z-index:99994}.fancybox-is-open .fancybox-stage{overflow:hidden}.fancybox-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;display:none;height:100%;left:0;outline:none;overflow:auto;-webkit-overflow-scrolling:touch;padding:44px;position:absolute;text-align:center;top:0;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;white-space:normal;width:100%;z-index:99994}.fancybox-slide:before{content:"";display:inline-block;height:100%;margin-right:-.25em;vertical-align:middle;width:0}.fancybox-is-sliding .fancybox-slide,.fancybox-slide--current,.fancybox-slide--next,.fancybox-slide--previous{display:block}.fancybox-slide--next{z-index:99995}.fancybox-slide--image{overflow:visible;padding:44px 0}.fancybox-slide--image:before{display:none}.fancybox-slide--html{padding:6px 6px 0}.fancybox-slide--iframe{padding:44px 44px 0}.fancybox-content{background:#fff;display:inline-block;margin:0 0 6px;max-width:100%;overflow:auto;padding:0;padding:24px;position:relative;text-align:left;vertical-align:middle}.fancybox-slide--image .fancybox-content{-webkit-animation-timing-function:cubic-bezier(.5,0,.14,1);animation-timing-function:cubic-bezier(.5,0,.14,1);-webkit-backface-visibility:hidden;backface-visibility:hidden;background:transparent;background-repeat:no-repeat;background-size:100% 100%;left:0;margin:0;max-width:none;overflow:visible;padding:0;position:absolute;top:0;-webkit-transform-origin:top left;transform-origin:top left;transition-property:opacity,-webkit-transform;transition-property:transform,opacity;transition-property:transform,opacity,-webkit-transform;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:99995}.fancybox-can-zoomOut .fancybox-content{cursor:zoom-out}.fancybox-can-zoomIn .fancybox-content{cursor:zoom-in}.fancybox-can-drag .fancybox-content{cursor:-webkit-grab;cursor:grab}.fancybox-is-dragging .fancybox-content{cursor:-webkit-grabbing;cursor:grabbing}.fancybox-container [data-selectable=true]{cursor:text}.fancybox-image,.fancybox-spaceball{background:transparent;border:0;height:100%;left:0;margin:0;max-height:none;max-width:none;padding:0;position:absolute;top:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:100%}.fancybox-spaceball{z-index:1}.fancybox-slide--html .fancybox-content{margin-bottom:6px}.fancybox-slide--iframe .fancybox-content,.fancybox-slide--map .fancybox-content,.fancybox-slide--video .fancybox-content{height:100%;margin:0;overflow:visible;padding:0;width:100%}.fancybox-slide--video .fancybox-content{background:#000}.fancybox-slide--map .fancybox-content{background:#e5e3df}.fancybox-slide--iframe .fancybox-content{background:#fff;height:calc(100% - 44px);margin-bottom:44px}.fancybox-iframe,.fancybox-video{background:transparent;border:0;height:100%;margin:0;overflow:hidden;padding:0;width:100%}.fancybox-iframe{vertical-align:top}.fancybox-error{background:#fff;cursor:default;max-width:400px;padding:40px;width:100%}.fancybox-error p{color:#444;font-size:16px;line-height:20px;margin:0;padding:0}.fancybox-button{background:rgba(30,30,30,.6);border:0;border-radius:0;cursor:pointer;display:inline-block;height:44px;margin:0;outline:none;padding:10px;transition:color .2s;vertical-align:top;width:44px}.fancybox-button,.fancybox-button:link,.fancybox-button:visited{color:#ccc}.fancybox-button:focus,.fancybox-button:hover{color:#fff}.fancybox-button.disabled,.fancybox-button.disabled:hover,.fancybox-button[disabled],.fancybox-button[disabled]:hover{color:#888;cursor:default}.fancybox-button svg{display:block;overflow:visible;position:relative;shape-rendering:geometricPrecision}.fancybox-button svg path{fill:transparent;stroke:currentColor;stroke-linejoin:round;stroke-width:3}.fancybox-button--pause svg path:nth-child(1),.fancybox-button--play svg path:nth-child(2){display:none}.fancybox-button--play svg path,.fancybox-button--share svg path,.fancybox-button--thumbs svg path{fill:currentColor}.fancybox-button--share svg path{stroke-width:1}.fancybox-navigation .fancybox-button{height:38px;opacity:0;padding:6px;position:absolute;top:50%;width:38px}.fancybox-show-nav .fancybox-navigation .fancybox-button{transition:opacity .25s,visibility 0s,color .25s}.fancybox-navigation .fancybox-button:after{content:"";left:-25px;padding:50px;position:absolute;top:-25px}.fancybox-navigation .fancybox-button--arrow_left{left:6px}.fancybox-navigation .fancybox-button--arrow_right{right:6px}.fancybox-close-small{background:transparent;border:0;border-radius:0;color:#555;cursor:pointer;height:44px;margin:0;padding:6px;position:absolute;right:0;top:0;width:44px;z-index:10}.fancybox-close-small svg{fill:transparent;opacity:.8;stroke:currentColor;stroke-width:1.5;transition:stroke .1s}.fancybox-close-small:focus{outline:none}.fancybox-close-small:hover svg{opacity:1}.fancybox-slide--iframe .fancybox-close-small,.fancybox-slide--image .fancybox-close-small,.fancybox-slide--video .fancybox-close-small{color:#ccc;padding:5px;right:-12px;top:-44px}.fancybox-slide--iframe .fancybox-close-small:hover svg,.fancybox-slide--image .fancybox-close-small:hover svg,.fancybox-slide--video .fancybox-close-small:hover svg{background:transparent;color:#fff}.fancybox-is-scaling .fancybox-close-small,.fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small{display:none}.fancybox-caption{bottom:0;color:#fff;font-size:14px;font-weight:400;left:0;line-height:1.5;padding:25px 44px;right:0}.fancybox-caption:before{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAEtCAQAAABjBcL7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAHRJREFUKM+Vk8EOgDAIQ0vj/3+xBw8qIZZueFnIKC90MCAI8DlrkHGeqqGIU6lVigrBtpCWqeRWoHDNqs0F7VNVBVxmHRlvoVqjaYkdnDIaivH2HqZ5+oZj3JUzWB+cOz4G48Bg+tsJ/tqu4dLC/4Xb+0GcF5BwBC0AA53qAAAAAElFTkSuQmCC);background-repeat:repeat-x;background-size:contain;bottom:0;content:"";display:block;left:0;pointer-events:none;position:absolute;right:0;top:-25px;z-index:-1}.fancybox-caption:after{border-bottom:1px solid hsla(0,0%,100%,.3);content:"";display:block;left:44px;position:absolute;right:44px;top:0}.fancybox-caption a,.fancybox-caption a:link,.fancybox-caption a:visited{color:#ccc;text-decoration:none}.fancybox-caption a:hover{color:#fff;text-decoration:underline}.fancybox-loading{-webkit-animation:a .8s infinite linear;animation:a .8s infinite linear;background:transparent;border:6px solid hsla(0,0%,39%,.5);border-radius:100%;border-top-color:#fff;height:60px;left:50%;margin:-30px 0 0 -30px;opacity:.6;padding:0;position:absolute;top:50%;width:60px;z-index:99999}@-webkit-keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes a{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.fancybox-animated{transition-timing-function:cubic-bezier(0,0,.25,1)}.fancybox-fx-slide.fancybox-slide--previous{opacity:0;-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}.fancybox-fx-slide.fancybox-slide--next{opacity:0;-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}.fancybox-fx-slide.fancybox-slide--current{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}.fancybox-fx-fade.fancybox-slide--next,.fancybox-fx-fade.fancybox-slide--previous{opacity:0;transition-timing-function:cubic-bezier(.19,1,.22,1)}.fancybox-fx-fade.fancybox-slide--current{opacity:1}.fancybox-fx-zoom-in-out.fancybox-slide--previous{opacity:0;-webkit-transform:scale3d(1.5,1.5,1.5);transform:scale3d(1.5,1.5,1.5)}.fancybox-fx-zoom-in-out.fancybox-slide--next{opacity:0;-webkit-transform:scale3d(.5,.5,.5);transform:scale3d(.5,.5,.5)}.fancybox-fx-zoom-in-out.fancybox-slide--current{opacity:1;-webkit-transform:scaleX(1);transform:scaleX(1)}.fancybox-fx-rotate.fancybox-slide--previous{opacity:0;-webkit-transform:rotate(-1turn);transform:rotate(-1turn)}.fancybox-fx-rotate.fancybox-slide--next{opacity:0;-webkit-transform:rotate(1turn);transform:rotate(1turn)}.fancybox-fx-rotate.fancybox-slide--current{opacity:1;-webkit-transform:rotate(0deg);transform:rotate(0deg)}.fancybox-fx-circular.fancybox-slide--previous{opacity:0;-webkit-transform:scale3d(0,0,0) translate3d(-100%,0,0);transform:scale3d(0,0,0) translate3d(-100%,0,0)}.fancybox-fx-circular.fancybox-slide--next{opacity:0;-webkit-transform:scale3d(0,0,0) translate3d(100%,0,0);transform:scale3d(0,0,0) translate3d(100%,0,0)}.fancybox-fx-circular.fancybox-slide--current{opacity:1;-webkit-transform:scaleX(1) translateZ(0);transform:scaleX(1) translateZ(0)}.fancybox-fx-tube.fancybox-slide--previous{-webkit-transform:translate3d(-100%,0,0) scale(.1) skew(-10deg);transform:translate3d(-100%,0,0) scale(.1) skew(-10deg)}.fancybox-fx-tube.fancybox-slide--next{-webkit-transform:translate3d(100%,0,0) scale(.1) skew(10deg);transform:translate3d(100%,0,0) scale(.1) skew(10deg)}.fancybox-fx-tube.fancybox-slide--current{-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}.fancybox-share{background:#f4f4f4;border-radius:3px;max-width:90%;padding:30px;text-align:center}.fancybox-share h1{color:#222;font-size:35px;font-weight:700;margin:0 0 20px}.fancybox-share p{margin:0;padding:0}.fancybox-share__button{border:0;border-radius:3px;display:inline-block;font-size:14px;font-weight:700;line-height:40px;margin:0 5px 10px;min-width:130px;padding:0 15px;text-decoration:none;transition:all .2s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap}.fancybox-share__button:link,.fancybox-share__button:visited{color:#fff}.fancybox-share__button:hover{text-decoration:none}.fancybox-share__button--fb{background:#3b5998}.fancybox-share__button--fb:hover{background:#344e86}.fancybox-share__button--pt{background:#bd081d}.fancybox-share__button--pt:hover{background:#aa0719}.fancybox-share__button--tw{background:#1da1f2}.fancybox-share__button--tw:hover{background:#0d95e8}.fancybox-share__button svg{height:25px;margin-right:7px;position:relative;top:-1px;vertical-align:middle;width:25px}.fancybox-share__button svg path{fill:#fff}.fancybox-share__input{background:transparent;border:0;border-bottom:1px solid #d7d7d7;border-radius:0;color:#5d5b5b;font-size:14px;margin:10px 0 0;outline:none;padding:10px 15px;width:100%}.fancybox-thumbs{background:#fff;bottom:0;display:none;margin:0;-webkit-overflow-scrolling:touch;-ms-overflow-style:-ms-autohiding-scrollbar;padding:2px 2px 4px;position:absolute;right:0;-webkit-tap-highlight-color:transparent;top:0;width:212px;z-index:99995}.fancybox-thumbs-x{overflow-x:auto;overflow-y:hidden}.fancybox-show-thumbs .fancybox-thumbs{display:block}.fancybox-show-thumbs .fancybox-inner{right:212px}.fancybox-thumbs>ul{font-size:0;height:100%;list-style:none;margin:0;overflow-x:hidden;overflow-y:auto;padding:0;position:absolute;position:relative;white-space:nowrap;width:100%}.fancybox-thumbs-x>ul{overflow:hidden}.fancybox-thumbs-y>ul::-webkit-scrollbar{width:7px}.fancybox-thumbs-y>ul::-webkit-scrollbar-track{background:#fff;border-radius:10px;box-shadow:inset 0 0 6px rgba(0,0,0,.3)}.fancybox-thumbs-y>ul::-webkit-scrollbar-thumb{background:#2a2a2a;border-radius:10px}.fancybox-thumbs>ul>li{-webkit-backface-visibility:hidden;backface-visibility:hidden;cursor:pointer;float:left;height:75px;margin:2px;max-height:calc(100% - 8px);max-width:calc(50% - 4px);outline:none;overflow:hidden;padding:0;position:relative;-webkit-tap-highlight-color:transparent;width:100px}.fancybox-thumbs-loading{background:rgba(0,0,0,.1)}.fancybox-thumbs>ul>li{background-position:50%;background-repeat:no-repeat;background-size:cover}.fancybox-thumbs>ul>li:before{border:4px solid #4ea7f9;bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:all .2s cubic-bezier(.25,.46,.45,.94);z-index:99991}.fancybox-thumbs .fancybox-thumbs-active:before{opacity:1}@media (max-width:800px){.fancybox-thumbs{width:110px}.fancybox-show-thumbs .fancybox-inner{right:110px}.fancybox-thumbs>ul>li{max-width:calc(100% - 10px)}}