@font-face { font-family: 'Poppins'; src: url('../fonts/Poppins-Regular.woff2') format('woff2'), url('../fonts/Poppins-Regular.woff') format('woff'), local("?"); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Poppins'; src: url('../fonts/Poppins-Bold.woff2') format('woff2'), url('../fonts/Poppins-Bold.woff') format('woff'), local("?"); font-weight: 700; font-style: normal; font-display: swap; } html { box-sizing: border-box } *, *:before, *:after { box-sizing: inherit } body { background: #ffffff; overflow-x: hidden; margin: 0px; color: #000000; font-size: 14px; line-height: 24px; font-weight: 500; font-family: 'Poppins', Helvetica, Arial, sans-serif } h1 { margin: 0px; font-size: 36px; line-height: 60px; font-weight: 500 } h2 { margin: 0px; font-size: 30px; line-height: 48px; font-weight: 500 } h3 { margin: 0px; font-size: 24px; line-height: 36px; font-weight: 500 } h4 { margin: 0px; font-size: 18px; line-height: 30px; font-weight: 500 } ul { padding: 0px 0px 0px 10px; margin: 10px 0px 10px 10px; list-style-type: square } ol { padding: 0px 0px 0px 10px; margin: 10px 0px 10px 10px } img { border: none } b { font-weight: 700 } a { color: #ff8000; text-decoration: none } table { float: left; width: calc(100% + 40px); padding: 10px; border-style: none; border-spacing: 0px; margin: -20px } table tr td { position: relative; padding: 10px; text-align: left; vertical-align: top } table tr td:first-child { width: 33.3333% } input[type=radio], input[type=checkbox] { display: none } input[type=radio] + label, input[type=checkbox] + label { display: block; position: relative; float: left; width: 100%; padding: 0px 0px 0px 50px } input[type=radio] + label b { display: block; position: absolute; left: 0px; top: 0px; width: 30px; height: 30px; background-color: #ffffff; background-repeat: no-repeat; background-position: center; background-size: contain; border: solid 2px #d9d9d9; border-radius: 50% } input[type=checkbox] + label b { display: block; position: absolute; left: 0px; top: 0px; width: 30px; height: 30px; background-color: #ffffff; background-repeat: no-repeat; background-position: center; background-size: contain; border: solid 2px #d9d9d9 } input[type=radio].error + label b, input[type=checkbox].error + label b { border-color: #ff0000 } input[type=radio]:checked + label b { background-image: url(../images/layout/radio.svg); border-color: #000000 } input[type=checkbox]:checked + label b { background-image: url(../images/layout/checkbox.svg); border-color: #000000 } select, textarea, input[type=text] { float: left; width: 100%; padding: 16px; background: #ffffff; border: solid 2px #d9d9d9; color: #000000; font-size: 14px; line-height: 24px; font-weight: 500; font-family: 'Poppins', Helvetica, Arial, sans-serif; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; -webkit-appearance: none } select.error, textarea.error, input[type=text].error { border-color: #ff0000 } select + label, textarea + label, input[type=text] + label { display: block; position: absolute; left: 10px; top: 10px; padding: 18px; pointer-events: none; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } select:focus, textarea:focus, input[type=text]:focus, select:not([value=""]), textarea:not(:placeholder-shown), input[type=text]:not(:placeholder-shown) { border-color: #000000; outline: none } select:focus + label, textarea:focus + label, input[type=text]:focus + label, select:not([value=""]) + label, textarea:not(:placeholder-shown) + label, input[type=text]:not(:placeholder-shown) + label { left: 16px; top: -10px; padding: 12px; background: #ffffff; font-size: 12px; line-height: 18px } select { background-image: url(../images/layout/select.svg); background-repeat: no-repeat; background-position: right center; background-size: contain } textarea { height: 240px; overflow: auto; resize: none } input[type=submit] { float: left; width: 100%; height: 80px; padding: 0px; background: #ff8000; border: none; color: #ffffff; font-size: 18px; line-height: 18px; font-weight: 700; font-family: 'Poppins', Helvetica, Arial, sans-serif; text-transform: uppercase; cursor: pointer; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } input[type=submit]:hover { background: #000000 } .texterror { color: #ff0000 } div#refresh_captcha { position: relative; float: left; width: 100% } div#refresh_captcha div { position: absolute; top: 0px; right: 0px; width: 60px; height: 60px; background: #ff8000 url(../images/layout/update.svg) no-repeat center; background-size: 50%; border-radius: 50%; cursor: pointer; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } div#refresh_captcha div:hover { background-color: #000000 } div#refresh_captcha img { display: block; float: left; width: 100% } div.preloader { position: fixed; z-index: 2000; left: 0px; width: 100%; height: 100%; background: #ffffff } div.preloader:before { display: block; position: absolute; left: calc(50% - 40px); top: calc(50% - 40px); width: 80px; height: 80px; background: url(../images/layout/preloader.svg) no-repeat center; background-size: contain; content: '' } div.switch { display: none } ul.panel { position: fixed; z-index: 1000; right: 20px; bottom: 110px; width: 80px; padding: 5px; margin: 0px; list-style-type: none } ul.panel li { display: block; float: left; margin: 5px } ul.panel li a { display: block; float: left; width: 50px; height: 50px; background-color: #00000099; background-repeat: no-repeat; background-position: center; background-size: 50%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } ul.panel li a.phone { background-image: url(../images/layout/phone.svg) } ul.panel li a.mail { background-image: url(../images/layout/mail.svg) } ul.panel li a.facebook { background-image: url(../images/layout/facebook.svg) } ul.panel li a.instagram { background-image: url(../images/layout/instagram.svg) } ul.panel li a.up { background-image: url(../images/layout/up.svg) } ul.panel li a:hover { background-color: #000000 } a.logo { display: block; position: fixed; z-index: 3; left: 40px; top: 40px; width: 280px; height: 100px; background: #00000099 url(../images/layout/blaschke_logo.svg) no-repeat center; background-size: 240px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } a.logo:hover { background-color: #000000 !important } a.logo.small { left: 10px; top: 10px; width: 140px; height: 50px; background-color: transparent; background-size: 120px } nav { position: fixed; z-index: 2; right: 0px; top: 0px; width: 100%; padding: 30px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } nav.small { padding: 0px; background: #00000099 } nav ul { float: right; padding: 5px; margin: 0px; list-style-type: none } nav ul li { display: block; position: relative; float: left; background: #00000099; margin: 5px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } nav ul li:hover { background: #000000 !important } nav.small ul li { background: none } nav ul li a { display: block; position: relative; z-index: 2; float: left; width: 160px; padding: 18px 15px 18px 15px; color: #ffffff; line-height: 14px; text-transform: uppercase } nav ul li span { display: block; position: absolute; z-index: 1; right: 0px; top: 0px; width: 40px; height: 50px; background: url(../images/layout/plus.svg) no-repeat center; background-size: 50%; cursor: pointer } nav ul li ul { display: none; position: absolute; left: -10px; top: 50px; padding: 10px } nav ul li ul li { margin: 0px } nav.small ul li ul li { background: #00000099 } nav ul li ul li a { width: 330px; padding: 14px 15px 14px 15px; font-size: 12px; line-height: 12px } section.themes { position: relative; z-index: 1; float: left; width: 100%; background: #ffffff } section.themes .bx-prev { display: block; position: absolute; z-index: 100; right: 40px; bottom: 340px; width: 50px; height: 50px; background: #00000099 url(../images/layout/up.svg) no-repeat center; background-size: 50%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.themes .bx-next { display: block; position: absolute; z-index: 100; right: 40px; bottom: 280px; width: 50px; height: 50px; background: #00000099 url(../images/layout/down.svg) no-repeat center; background-size: 50%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.themes .bx-prev:hover, section.themes .bx-next:hover { background-color: #000000 } section.themes .bx-pager { position: absolute; z-index: 100; left: 30px; bottom: 30px; width: 30px; padding: 5px; margin: 0px; list-style-type: none } section.themes .bx-pager .bx-pager-item { display: block; float: left } section.themes .bx-pager .bx-pager-item a { display: block; float: left; width: 10px; height: 40px; background: #ffffff99; margin: 5px; color: transparent; font-size: 0px; line-height: 0px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.themes .bx-pager .bx-pager-item a.active { height: 120px; background: #ffffff } section.themes ul { float: left; width: 100%; padding: 0px; margin: 0px; list-style-type: none } section.themes ul li { display: block; position: relative; float: left; width: 100%; height: calc(100vh - 80px); overflow: hidden } section.themes.flat ul li { height: 50vh } section.themes ul li div { position: absolute; z-index: 1; left: 70px; bottom: -60px; width: calc(66.6666% - 70px); padding: 10px; opacity: 0; color: #ffffff; text-shadow: 0px 0px 20px #00000099 } section.themes ul li div.active { bottom: 20px; opacity: 1 } section.themes ul li div h4 { float: left; width: calc(100% - 20px); margin: 10px; font-size: 24px; line-height: 24px } section.themes ul li div h2 { float: left; width: calc(100% - 20px); margin: 10px; font-size: 48px; line-height: 48px; font-weight: 700; text-transform: uppercase } section.themes ul li div a { display: block; float: left; padding: 23px 40px 23px 40px; background: #ff8000; margin: 10px; color: #ffffff; line-height: 14px; text-transform: uppercase; letter-spacing: 0.2em; text-shadow: none; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.themes ul li div a:hover { background: #000000 } section.themes ul li picture { display: block; position: absolute; left: 0px; width: 100%; height: 100%; -webkit-filter: grayscale(0.2) brightness(0.8); -moz-filter: grayscale(0.2) brightness(0.8); filter: grayscale(0.2) brightness(0.8) } section.themes ul li picture img { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit: cover } section.themes ul li div.special { display: flex; flex-flow: row wrap; justify-content: center; left: auto; right: 130px; bottom: -40px; width: calc(33.3333% - 130px); padding: 120px 30px 30px 30px; background: #00000099; text-align: center; text-shadow: none } section.themes ul li div.special.active { bottom: 40px } section.themes ul li div.special:before { display: block; position: absolute; left: calc(50% - 50px); top: 0%; width: 100px; height: 100px; background: #ffffff url(../images/layout/payable.svg) no-repeat center; background-size: 90%; border-radius: 0% 0% 50% 50%; box-shadow: 0px 0px 10px #00000099; content: '' } section.themes ul li div.special h4 { font-size: 18px } section.themes ul li div.special h2 { font-size: 30px; line-height: 30px } a.extern { display: block; float: left; width: 50%; padding: 28px 30px 28px 90px; background: #747474 url(../images/layout/extern.svg) no-repeat 30px center; background-size: 30px; color: #ffffff; font-size: 24px; text-transform: uppercase } a.scrolldown { display: block; float: left; width: 50%; padding: 28px 90px 28px 30px; background-color: #ff8000; background-image: url(../images/layout/scrolldown.svg); background-repeat: no-repeat; background-position: calc(100% - 30px) center; background-size: 30px; color: #ffffff; font-size: 24px; text-transform: uppercase; text-align: right } section.content { float: left; width: 100%; padding: 40px calc(50% - 640px) 40px calc(50% - 640px); background: #ffffff } section.content.distancetop { padding: 180px calc(50% - 640px) 40px calc(50% - 640px) } section.content.special { position: relative; padding: 160px calc(50% - 640px) 0px calc(50% - 640px); background: #d9d9d9; margin: 0px 0px -40px 0px } section.content.special:before { display: block; position: absolute; left: calc(50% - 80px); top: 0%; width: 160px; height: 160px; background: #ffffff url(../images/layout/payable.svg) no-repeat center; background-size: 90%; border-radius: 0% 0% 50% 50%; box-shadow: 0px 0px 10px #00000099; content: '' } section.content .column { float: left; padding: 20px } section.content .column.full { width: 100% } section.content .column.wide { width: 66.6666% } section.content .column.medium { width: 50% } section.content .column.slim { width: 33.3333% } section.content .column picture, section.content .column a[data-fancybox] { display: block; position: relative; float: left; width: calc(100% - 40px); padding: 0% 0% calc(75% - 30px) 0%; margin: 20px } section.content .column a[data-fancybox]:before { display: block; position: absolute; left: calc(50% - 30px); top: calc(50% - 30px); width: 60px; height: 60px; background: #00000099 url(../images/layout/zoom.svg) no-repeat center; background-size: 50%; border-radius: 50%; content: ''; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.content .column a[data-fancybox]:hover:before { -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg) } section.content .column picture img, section.content .column a[data-fancybox] img { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit: cover } section.content .column .entry { float: left; width: calc(100% - 40px); margin: 20px; word-break: break-word } section.content .column.full .entry { text-align: center } section.content .column .entry h1, section.content .column .entry h2 { font-size: 48px; line-height: 48px; font-weight: 700; text-transform: uppercase } section.content .column .entry img { display: block; float: left; width: 100% } section.content .column .factsheet { float: left; width: calc(100% - 40px); margin: 20px } section.content .column .factsheet table tr td { width: 50%; border-bottom: solid 1px #d9d9d9; font-size: 14px; line-height: 24px } section.content .column .factsheet table tr:first-child td { border-top: solid 1px #d9d9d9 } section.content .column .cta { display: flex; flex-flow: row wrap; float: left; width: 100%; padding: 10px; margin: 0px; list-style-type: none } section.content .column.full .cta { justify-content: center } section.content .column .cta li { display: block; float: left; margin: 10px } section.content .column .cta li a { display: block; float: left; padding: 23px 40px 23px 40px; background: #ff8000; color: #ffffff; line-height: 14px; text-transform: uppercase; letter-spacing: 0.2em; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.content .column .cta li a:hover { background: #000000 } section.content .column #map { float: left; width: calc(100% - 40px); padding: 0% 0% calc(150% - 60px) 0%; margin: 20px; font-size: 12px; line-height: 18px; white-space: nowrap; -moz-filter: grayscale(0.8); -webkit-filter: grayscale(0.8); filter: grayscale(0.8) } section.content .column #map h4 { font-size: 14px; line-height: 24px } section.content .services { display: flex; flex-flow: row wrap; float: left; width: 100%; padding: 30px; margin: 0px; list-style-type: none } section.content .services li { display: block; float: left; width: calc(16.6666% - 20px); margin: 10px } section.content .services li a { display: block; float: left; width: 100%; height: 100%; padding: 140px 10px 10px 10px; background-repeat: no-repeat; background-position: center 10px; background-size: 120px; line-height: 18px; font-weight: 700; text-transform: uppercase; text-align: center; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.content .services li a:hover { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1) } section.content .services li a.house { background-image: url(../images/layout/house.svg) } section.content .services li a.sign { background-image: url(../images/layout/sign.svg) } section.content .services li a.hospital { background-image: url(../images/layout/hospital.svg) } section.content .services li a.swatchbook { background-image: url(../images/layout/swatchbook.svg) } section.content .services li a.broom { background-image: url(../images/layout/broom.svg) } section.content .services li a.team { background-image: url(../images/layout/team.svg) } section.content .immo { display: block; float: left; width: calc(25% - 80px); margin: 40px } section.content .immo img { display: block; float: left; width: 100%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.content .immo:hover img { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1) } section.parallax { position: relative; float: left; width: 100%; height: 100vh; overflow: hidden } section.parallax .pic { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background: url(../images/layout/parallax.jpg) no-repeat center bottom; background-size: cover; background-attachment: fixed; -webkit-filter: grayscale(0.2) brightness(0.8); -moz-filter: grayscale(0.2) brightness(0.8); filter: grayscale(0.2) brightness(0.8) } section.parallax.orange { z-index: -1 } section.parallax.orange:before { display: block; position: absolute; z-index: 1; left: 0px; top: 0px; width: 100%; height: 100%; background: #ff800099; content: '' } section.parallax.orange .text { position: fixed; z-index: 2; left: calc(50% - 480px); top: 50%; width: 960px; padding: 20px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%) } section.parallax.orange .text h2 { float: left; width: calc(100% - 40px); margin: 20px; color: #ffffff; font-size: 72px; line-height: 72px; text-transform: uppercase } section.parallax.orange .text div { float: left; width: calc(50% - 40px); margin: 20px; color: #ffffff } section.parallax.orange .pic { -webkit-filter: grayscale(1) brightness(0.8); -moz-filter: grayscale(1) brightness(0.8); filter: grayscale(1) brightness(0.8) } section.slider { float: left; width: 100%; padding: 180px calc(50% - 600px) 120px calc(50% - 600px); background: #d9d9d9 } section.slider .sliderbox { position: relative; float: left; width: 100% } section.slider .sliderbox .bx-prev { display: block; position: absolute; z-index: 100; left: 0px; top: -100px; width: 60px; height: 60px; background: #00000099 url(../images/layout/left.svg) no-repeat center; background-size: 50%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.slider .sliderbox .bx-next { display: block; position: absolute; z-index: 100; right: 0px; top: -100px; width: 60px; height: 60px; background: #00000099 url(../images/layout/right.svg) no-repeat center; background-size: 50%; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.slider .sliderbox .bx-prev:hover, section.slider .sliderbox .bx-next:hover { background-color: #000000 } section.slider .sliderbox .bx-pager { position: absolute; z-index: 100; left: calc(50% - 610px); bottom: -50px; padding: 5px; margin: 0px; list-style-type: none } section.slider .sliderbox .bx-pager .bx-pager-item { display: block; float: left } section.slider .sliderbox .bx-pager .bx-pager-item a { display: block; float: left; width: 60px; height: 10px; background: #00000099; margin: 5px; color: transparent; font-size: 0px; line-height: 0px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.slider .sliderbox .bx-pager .bx-pager-item a.active { width: 180px; background: #000000 } section.slider .sliderbox ul { float: left; width: 100%; padding: 0px; margin: 0px; list-style-type: none } section.slider .sliderbox ul li { display: block; float: left; width: 100% } section.slider .sliderbox ul li h4 { line-height: 18px } section.slider .sliderbox ul li h3 { font-size: 36px; font-weight: 700; text-transform: uppercase } section.slider .sliderbox ul li a { display: block; float: left; padding: 13px 15px 13px 15px; background: #ff8000; color: #ffffff; line-height: 14px; text-transform: uppercase; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.slider .sliderbox ul li a:hover { background: #000000 } section.slider .sliderbox ul li a.pic { position: relative; width: 50%; padding: 0% 0% 33.3333% 0%; overflow: hidden; text-transform: none } section.slider .sliderbox ul li a.pic span { display: block; position: absolute; z-index: 2; left: 0%; bottom: 0%; width: 100%; padding: 14px 0px 14px 0px; font-size: 12px; line-height: 12px; text-align: center; text-shadow: 0px 0px 5px #00000099 } section.slider .sliderbox ul li a.pic img { display: block; position: absolute; z-index: 1; left: 0%; top: 0%; width: 100%; height: 100%; object-fit: cover; -webkit-transform: scale(1.04); -moz-transform: scale(1.04); transform: scale(1.04); -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.slider .sliderbox ul li a.pic:hover img { -webkit-transform: none; -moz-transform: none; transform: none } ul.teaser { float: left; width: 100%; padding: 0px; background: #ffffff; margin: 0px; list-style-type: none } ul.teaser li { display: block; float: left; width: 50% } ul.teaser li a { display: none } ul.teaser li a:first-child { display: block; position: relative; float: left; width: 100%; padding: 0% 0% 66.6666% 0%; overflow: hidden } ul.teaser li a picture { display: block; position: absolute; left: 0px; width: 100%; height: 100%; -webkit-filter: grayscale(0.2) brightness(0.8); -moz-filter: grayscale(0.2) brightness(0.8); filter: grayscale(0.2) brightness(0.8) } ul.teaser li a picture img { display: block; position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; object-fit: cover; -webkit-transform: scale(1.04); -moz-transform: scale(1.04); transform: scale(1.04); -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } ul.teaser li a:hover picture img { -webkit-transform: none; -moz-transform: none; transform: none } ul.teaser li a div { position: absolute; z-index: 1; left: 0px; top: 0px; width: 100%; padding: 80px; color: #ffffff; text-shadow: 0px 0px 20px #00000099 } ul.teaser li a div h2 { font-size: 48px; font-weight: 700; text-transform: uppercase } ul.teaser li a div span { display: block; float: left; padding: 23px 40px 23px 40px; background: #ff8000; color: #ffffff; line-height: 14px; text-transform: uppercase; letter-spacing: 0.2em; text-shadow: none; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } ul.teaser li a:hover div span { background: #000000 } section.sitemap { float: left; width: 100%; padding: 20px calc(50% - 640px) 20px calc(50% - 640px); background: #747474 } section.sitemap ul { float: left; width: 25%; padding: 30px; margin: 0px; list-style-type: none } section.sitemap ul li { display: block; float: left; width: calc(100% - 20px); margin: 10px } section.sitemap ul li a { display: block; float: left; width: 100%; padding: 11px 0px 11px 0px; color: #ffffff; font-size: 18px; line-height: 18px; text-transform: uppercase } section.sitemap div { float: left; width: 50%; padding: 30px } section.sitemap div h4 { float: left; width: calc(100% - 20px); padding: 10px 0px 10px 0px; margin: 10px 10px 30px 10px; color: #ffffff } section.sitemap div h4 b { display: block; font-size: 36px } section.sitemap div a { display: block; float: left; width: calc(100% - 20px); padding: 23px 20px 23px 60px; background-color: #00000099; background-repeat: no-repeat; background-position: 20px center; background-size: 30px; margin: 10px; color: #ffffff; font-size: 24px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } section.sitemap div a:hover { background-color: #000000 } section.sitemap div a.phone { background-image: url(../images/layout/phone.svg) } section.sitemap div a.mail { background-image: url(../images/layout/mail.svg) } footer { float: left; width: 100%; padding: 20px calc(50% - 640px) 20px calc(50% - 640px); background: #ff8000 } footer div { float: left; width: 100%; padding: 40px; color: #ffffff } footer div a { color: #ffffff } @media only screen and (max-width: 1279px) { body { font-size: 10px; line-height: 14px } h1 { font-size: 24px; line-height: 36px } h2 { font-size: 18px; line-height: 30px } h3 { font-size: 14px; line-height: 24px } h4 { font-size: 12px; line-height: 18px } table { width: calc(100% + 20px); padding: 5px; margin: -10px } table tr td { display: block; float: left; width: 100% !important; padding: 5px } input[type=radio] + label, input[type=checkbox] + label { padding: 0px 0px 0px 30px } input[type=radio] + label b, input[type=checkbox] + label b { width: 20px; height: 20px; border-width: 1px } select, textarea, input[type=text] { padding: 12px; border-width: 1px; font-size: 10px; line-height: 14px } select + label, textarea + label, input[type=text] + label { left: 5px; top: 5px; padding: 13px } select:focus + label, textarea:focus + label, input[type=text]:focus + label, select:not([value=""]) + label, textarea:not(:placeholder-shown) + label, input[type=text]:not(:placeholder-shown) + label { left: 12px; top: -5px; padding: 6px; font-size: 8px; line-height: 12px } textarea { height: 180px } input[type=submit] { height: 60px; font-size: 12px; line-height: 12px } div#refresh_captcha div { width: 40px; height: 40px } div.preloader:before { left: calc(50% - 20px); top: calc(50% - 20px); width: 40px; height: 40px } div.switch { display: block; position: fixed; z-index: 3000; right: 20px; top: 20px; width: 40px; height: 40px; background: #00000099; cursor: pointer } div.switch span { display: block; position: absolute; left: 13px; height: 2px; background: #ffffff; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } div.switch span:nth-child(1) { top: 13px; width: 14px } div.switch span:nth-child(2), div.switch span:nth-child(3) { top: 19px; width: 10px } div.switch span:nth-child(4) { top: 25px; width: 12px } div.switch.active span:nth-child(1), div.switch.active span:nth-child(4) { top: 19px; width: 0%; left: 50% } div.switch.active span:nth-child(2) { width: 14px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } div.switch.active span:nth-child(3) { width: 14px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } ul.panel { right: 15px; bottom: 15px; width: 50px; padding: 2.5px } ul.panel li { margin: 2.5px } ul.panel li a { width: 40px; height: 40px } a.logo { position: absolute; left: 20px; top: 20px; width: 140px; height: 50px; background-size: 120px; -webkit-transition: none; -moz-transition: none; transition: none } nav { right: -240px; width: 240px; height: 100%; padding: 10px; background: #00000099; -webkit-transition: none; -moz-transition: none; transition: none } nav ul { width: 100% } nav ul li { width: calc(100% - 10px); background: none } nav ul li:hover { background: none !important } nav ul li a { width: 100%; padding: 13px 10px 13px 10px; font-size: 14px } nav ul li span { z-index: 2; height: 40px; -webkit-transition: 0.2s ease-in-out; -moz-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out } nav ul li span.active { background-image: url(../images/layout/minus.svg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); transform: rotate(360deg) } nav ul li ul { position: static; float: left; padding: 0px } nav ul li ul li a { width: 100%; padding: 10px; font-size: 10px; line-height: 10px } section.themes .bx-prev { right: 20px; bottom: 65px; width: 40px; height: 40px } section.themes .bx-next { right: 20px; bottom: 20px; width: 40px; height: 40px } section.themes .bx-pager { left: 15px; bottom: 15px; width: 15px; padding: 2.5px } section.themes .bx-pager .bx-pager-item a { width: 5px; height: 20px; margin: 2.5px } section.themes .bx-pager .bx-pager-item a.active { height: 60px } section.themes ul li { height: 400px } section.themes.flat ul li { height: 260px } section.themes ul li div { left: 35px; bottom: -30px; width: calc(100% - 105px); padding: 5px; text-shadow: 0px 0px 10px #00000099 } section.themes ul li div.active { bottom: 10px } section.themes ul li div h4 { width: calc(100% - 10px); margin: 5px; font-size: 9px; line-height: 9px } section.themes ul li div h2 { width: calc(100% - 10px); margin: 5px; font-size: 18px; line-height: 18px } section.themes ul li div a { padding: 15px 20px 15px 20px; margin: 5px; line-height: 10px } section.themes ul li div.special { justify-content: flex-start; right: auto; left: 20px; bottom: auto; top: 130px; width: calc(100% - 40px); padding: 10px 10px 10px 90px; text-align: left } section.themes ul li div.special.active { bottom: auto; top: 90px } section.themes ul li div.special:before { left: 20px; width: 60px; height: 60px; box-shadow: 0px 0px 5px #00000099; content: '' } section.themes ul li div.special h4 { font-size: 9px; line-height: 12px } section.themes ul li div.special h2 { font-size: 14px; line-height: 14px } a.extern, a.scrolldown { width: 100%; padding: 23px 15px 23px 45px; background-position: 10px center; background-size: 25px; font-size: 14px; text-align: left } section.content { padding: 20px calc(50% - 180px) 20px calc(50% - 180px) } section.content.distancetop { padding: 100px calc(50% - 180px) 20px calc(50% - 180px) } section.content.special { padding: 20px calc(50% - 100px) 0px calc(50% - 180px); margin: 0px 0px -20px 0px } section.content.special:before { left: calc(50% + 80px); width: 80px; height: 80px; box-shadow: 0px 0px 5px #00000099 } section.content.special .column .entry h3 { font-size: 12px; line-height: 18px } section.content .column { width: 100% !important; padding: 10px } section.content .column picture, section.content .column a[data-fancybox] { width: calc(100% - 20px); padding: 0% 0% calc(75% - 15px) 0%; margin: 10px } section.content .column a[data-fancybox]:before { left: calc(50% - 20px); top: calc(50% - 20px); width: 40px; height: 40px } section.content .column .entry { width: calc(100% - 20px); margin: 10px; text-align: left !important } section.content .column .entry h1, section.content .column .entry h2 { font-size: 18px; line-height: 18px } section.content .column .factsheet { width: calc(100% - 20px); margin: 10px } section.content .column .factsheet table tr td { display: table-cell; float: none; width: 50% !important; font-size: 10px; line-height: 14px } section.content .column .cta { justify-content: flex-start !important; padding: 5px } section.content .column .cta li { margin: 5px } section.content .column .cta li a { padding: 15px 20px 15px 20px; line-height: 10px } section.content .column #map { width: calc(100% - 20px); padding: 0% 0% calc(150% - 30px) 0%; margin: 10px; font-size: 8px; line-height: 12px } section.content .column #map h4 { font-size: 10px; line-height: 14px } section.content .services { padding: 15px } section.content .services li { width: calc(33.3333% - 10px); margin: 5px } section.content .services li a { padding: 70px 5px 5px 5px; background-position: center 5px; background-size: 60px; font-size: 8px; line-height: 10px } section.content .immo { width: calc(50% - 40px); margin: 20px } section.parallax .pic { background-position: center top; background-size: auto 760px } section.parallax.orange .text { left: calc(50% - 180px); top: 380px; width: 360px; padding: 10px } section.parallax.orange .text h2 { width: calc(100% - 20px); margin: 10px; font-size: 30px; line-height: 30px } section.parallax.orange .text div { width: calc(100% - 20px); margin: 10px } section.slider { padding: 100px calc(50% - 160px) 60px calc(50% - 160px) } section.slider .sliderbox .bx-prev, section.slider .sliderbox .bx-next { top: -60px; width: 40px; height: 40px } section.slider .sliderbox .bx-pager { left: calc(50% - 165px); bottom: -25px; padding: 2.5px } section.slider .sliderbox .bx-pager .bx-pager-item a { width: 30px; height: 5px; margin: 2.5px } section.slider .sliderbox .bx-pager .bx-pager-item a.active { width: 90px } section.slider .sliderbox ul li { font-size: 8px; line-height: 12px } section.slider .sliderbox ul li h4 { font-size: 10px; line-height: 10px } section.slider .sliderbox ul li h3 { font-size: 18px; line-height: 18px } section.slider .sliderbox ul li a { padding: 10px; line-height: 10px } section.slider .sliderbox ul li a.pic { width: 100%; padding: 0% 0% 66.6666% 0% } section.slider .sliderbox ul li a.pic span { padding: 10.5px 0px 10.5px 0px; font-size: 9px; line-height: 9px; text-shadow: 0px 0px 2.5px #00000099 } ul.teaser li { width: 100% } ul.teaser li a div { padding: 20px; text-shadow: 0px 0px 10px #00000099 } ul.teaser li a div h2 { font-size: 18px; line-height: 18px } ul.teaser li a div span { padding: 15px 20px 15px 20px; line-height: 10px } section.sitemap { padding: 10px calc(50% - 180px) 10px calc(50% - 180px) } section.sitemap ul { width: 50%; padding: 15px } section.sitemap ul li { width: calc(100% - 10px); margin: 5px } section.sitemap ul li a { padding: 10px 0px 10px 0px; font-size: 10px; line-height: 10px } section.sitemap div { width: 100%; padding: 15px } section.sitemap div h4 { width: calc(100% - 10px); padding: 5px 0px 5px 0px; margin: 5px 5px 15px 5px; font-size: 10px; line-height: 14px } section.sitemap div h4 b { font-size: 18px } section.sitemap div a { width: calc(100% - 70px); padding: 15px 10px 15px 40px; background-position: 10px center; background-size: 20px; margin: 5px; font-size: 10px; line-height: 10px } footer { padding: 10px calc(50% - 120px) 10px calc(50% - 180px) } footer div { padding: 20px } }