/* Theme Name: AHNEFELD LAW Description: Custom Wordpress Theme for AHNEFELD LAW FIRM Berlin Author: Sebastian Klammer Grafikdesign Berlin Author URI: https://sebastian-klammer.de/ Version: 1.00 (20.03.2026) */ /* === FONTS === */ @import url('fonts/stylesheet.css'); /* === ANIMATIONS === */ .show-on-scroll { opacity: 0; transition: transform 4s .25s cubic-bezier(0,1,.3,1), opacity .3s .25s ease-out; transform: translate(0, calc(40% + 1em)); } .show-on-scroll.is-visible { opacity: 1; transform: translate(0, 0); } #main > section#no-animation .show-on-scroll, #main > section.no-animation .show-on-scroll { opacity: 1; transform: translate(0, 0); } /* === RESET === */ body, div, h1, h2, h3, h4, h5, h6, p, blockquote, pre, code, ol, ul, li, dl, dt, dd, figure, table, th, td, form, fieldset, legend, input, textarea { margin: 0; padding: 0; } header, footer, nav, section, aside, article, figure, figcaption { display: block } table { border-spacing: 0; border-collapse: collapse; } caption, th, td { text-align: left; text-align: start; vertical-align: top; } abbr, acronym { font-variant: normal; border-bottom: 1px dotted #666; cursor: help; } blockquote, q { quotes: none; } fieldset, img { border: 0; } ul { list-style-type: none; } ul li { margin-bottom: 10px; line-height: 1.6 !important; } .inclcontent ol li { margin-bottom: 10px !important; line-height: 1.6 !important; } sup { vertical-align: text-top; } sub { vertical-align: text-bottom; } del { text-decoration: line-through; } ins { text-decoration: none; } *, *:before, *:after { box-sizing: inherit; } html { position: relative; overflow-y: scroll; height: 100%; } body { overflow-y: scroll; overflow-x: hidden; } input, button, textarea, select { vertical-align: baseline; *vertical-align: middle; } button, input.submit { *overflow: visible; } table { font-size: inherit; } img, object, embed, video { max-width: 100%; } a img { border: none; display: block; } img { height: auto; } /* === GENERIC === */ .desk-size { display: block; } .tablet-size { display: none; } .phone-size { display: none; } .clr { clear: both; } .clrfix:after { content: "."; clear: both; display: block; visibility: hidden; height: 0; } .hideMobile { display: block; } .showMobile { display: none; } a { color: #c18a07; text-decoration: none; transition: all .2s ease; } a.back-arrow { color: #c18a07; font-weight: bold; } a.back-arrow:hover { color: #e2a410; } a:hover { color: #e2a410; text-decoration: none; } .button { display: inline-block; padding: 0.8em 1.6em; font-size: 0.9em; font-weight: normal; background-color: #c18a07; color: #fff; text-decoration: none; text-transform: uppercase; letter-spacing: .75px; } .button.small { padding: 0.5em 1.2em; font-size: .7em; } .button:hover { background-color: #e2a410; text-decoration: none; color: #fff; cursor: pointer; transform: scale(1.05); } .button + .button { margin-left: 20px; } .readmore .button { background-color: #c18a07; color: #fff; } .readmore .button:hover { background-color: #e2a410; color: #fff; } .float-left { display: inline; float: left; margin-right: 1.5em; } .float-right { display: inline; float: right; margin-left: 1.5em; } .float-none { float: none; } .clear { clear: both; } .clear-left { clear: left; } .clear-right { clear: right; } .aligncenter { display: block; margin-right: auto; margin-left: auto; } .alignleft { float: left; margin-right: 2em; } .alignright { float: right; margin-left: 2em; } .align-left { text-align: left; } .align-right { text-align: right; } .align-center { text-align: center; } .align-justify { text-align: justify; } .vertical-center { display: flex; align-items: center; /*justify-content: center; */} #main > section { position: relative; display: flex; align-items: center; background-position: center center; background-repeat: no-repeat; background-size: cover; } .inside { width: 100%; position: relative; max-width: 1480px; margin: 0 auto; box-sizing: border-box; padding: 6em 80px; } section.transparent + section.transparent .inside, section.white + section.white .inside, section.lightgrey + section.lightgrey .inside, section.blue + section.blue .inside { padding-top: 0; } section.lightgrey + section.lightgrey.with-padding .inside { padding: 6em 80px; } .white { background-color: #fff; } .white.semi-transparent { background-color: rgba(255,255,255,0.7); backdrop-filter: saturate(180%) blur(20px); } .lightgrey { background-color: #FAF6F3; } .gold { background-color: #C18A07; } .blue { background-color: #13213D; color: #fff; } .blue.dark-blue { background-color: #0d182e; } .blue.medium-blue { background-color: #23314e; } .blue.semi-transparent { background-color: rgba(13,24,46,0.9); backdrop-filter: saturate(180%) blur(20px); } .bgimage-black { color: #fff; } .image-overlay { opacity: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/bg_image-overlay.png); background-position: center center; background-size: cover; background-repeat: no-repeat; transition: opacity .2s ease-in-out; } .image-overlay:hover { opacity: 1; } .vh25 { height: auto; min-height: 25vh !important; } .vh50 { height: auto; min-height: 50vh !important; } .vh75 { height: auto; min-height: 75vh !important; } .vh100 { height: auto; min-height: 100vh !important; } .two-columns { column-count: 2; column-gap: 4em; } .three-columns { column-count: 3; } #banner .banner-content h1, #banner .banner-content h2, #banner .banner-content p { color: #fff; } #banner .banner-content h1, #banner .banner-content h2 { padding-bottom: .5em; } /* === FONTS === */ html { font-size: 62.5%; /* font-size 1em = 10px on default browser settings */ } body, button, input, select, textarea { line-height: 1.5; color: #261F1A; font-family: 'SFPro', sans-serif; font-weight: 300; font-size: 18px; font-size: 1.8rem; } h1, h2, h3, h4, h5, h6 { font-family: 'Ahnefeld-Light', sans-serif; font-weight: normal; font-style: normal; line-height: 1.3; margin-top: 0; margin-bottom: 0; padding-bottom: 1em; position: relative; } h1 { font-size: 4.5em; } h2 { font-size: 2.5em; } h2 +h2 { font-size: 1.9em; margin-top: -1.2em; } h2.section-header { font-size: 3.5em; text-align: center; } h2.no-bottom-margin { margin-bottom: 0; padding-bottom: .2em; } h2.highlight { font-size: 3em; color: #c18a07 !important; margin-bottom: 0; padding-bottom: .2em; } h3 { font-size: 1.8em; } h3 + h3 { margin-top: -1em; } h3.small { font-size: 1.75em; } h4 { font-family: 'SFPro', sans-serif; font-weight: 400; color: #C18A07; font-size: 1.5em; margin-bottom: 0.25em; } h5 { font-size: 1.1em; text-transform: uppercase; padding-bottom: .5em; } h5 + p { color: #C18A07; padding-bottom: 1em; margin-bottom: 1em !important; border-bottom: 1px solid rgba(193, 138, 7, 0.54); } .blue h1, .blue h2, .blue h3, .blue h5 { color: #fff; } .blue p { color: #fff; } .blue h2.highlight { color: #fff; } .blue > .inside > .columns > .clmn.transparent > .clmn-content > h1, .blue > .inside > .columns > .clmn.transparent > .clmn-content > h2, .blue > .inside > .columns > .clmn.transparent > .clmn-content > h3, .blue > .inside > .columns > .clmn.transparent > .clmn-content > h5 { color: #fff; } .blue > .inside > .columns > .clmn.transparent > .clmn-content > p { color: #fff; } .blue > .inside > .columns > .clmn.transparent > .clmn-content > h2.highlight { color: #fff; } .blue > .inside > .columns > .clmn.white > .clmn-content > h1, .blue > .inside > .columns > .clmn.white > .clmn-content > h2, .blue > .inside > .columns > .clmn.white > .clmn-content > h3, .blue > .inside > .columns > .clmn.white > .clmn-content > h5 { color: #192b3c; } .blue > .inside > .columns > .clmn.white > .clmn-content > p { color: #192b3c; } .blue > .inside > .columns > .clmn.white > .clmn-content > h2.highlight { color: #192b3c; } .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > h1, .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > h2, .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > h3, .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > h4, .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > h5 { color: #192b3c; } .blue > .inside > .columns > .clmn.lightgrey > .clmn-content > p { color: #192b3c; } .gold h1, .gold h2, .gold h3, .gold h5 { color: #fff; } .gold p { color: #fff; } .gold h2.highlight { color: #fff; } .gold a { color: #fff; } .gold a:hover { color: #fff; } .gold .button { background-color: #13213D; color: #fff; } .gold .button:hover { background-color: #13213D; color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > h1, .gold > .inside > .columns > .clmn.transparent > .clmn-content > h2, .gold > .inside > .columns > .clmn.transparent > .clmn-content > h3, .gold > .inside > .columns > .clmn.transparent > .clmn-content > h5 { color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > p { color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > h2.highlight { color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > a { color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > a:hover { color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > .button { background-color: #13213D; color: #fff; } .gold > .inside > .columns > .clmn.transparent > .clmn-content > .button:hover { background-color: #13213D; color: #fff; } .gold > .inside > .columns > .clmn.white > .clmn-content > h1, .gold > .inside > .columns > .clmn.white > .clmn-content > h2, .gold > .inside > .columns > .clmn.white > .clmn-content > h3, .gold > .inside > .columns > .clmn.white > .clmn-content > h5 { color: #192b3c; } .gold > .inside > .columns > .clmn.white > .clmn-content > p { color: #192b3c; } .gold > .inside > .columns > .clmn.white > .clmn-content > h2.highlight { color: #192b3c; } .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > h1, .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > h2, .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > h3, .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > h4, .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > h5 { color: #192b3c; } .gold > .inside > .columns > .clmn.lightgrey > .clmn-content > p { color: #192b3c; } .bgimage-black h1, .bgimage-black h2, .bgimage-black h3, .bgimage-black h4, .bgimage-black h5 { color: #fff; } .bgimage-black p { color: #fff; } .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > h1, .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > h2, .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > h3, .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > h4, .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > h5 { color: #fff; } .bgimage-black > .inside > .columns > .clmn.transparent > .clmn-content > p { color: #fff; } .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > h1, .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > h2, .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > h3, .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > h4, .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > h5 { color: #192b3c; } .bgimage-black > .inside > .columns > .clmn.white > .clmn-content > p { color: #192b3c; } .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > h1, .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > h2, .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > h3, .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > h4, .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > h5 { color: #192b3c; } .bgimage-black > .inside > .columns > .clmn.lightgrey > .clmn-content > p { color: #192b3c; } p { margin: 0 0 2em; width: 100%; hyphens: auto; height: auto; } p.large { font-size: 1.5em; margin-top: -1.8em; } p.small { font-size: 0.8em; } p:last-of-type { margin-bottom: 0; } p.highlight { position: relative; font-family: 'Ahnefeld-Light', serif; color: #192b3c; font-size: 1.3em !important; font-style: normal; padding-bottom: 1.5em; box-sizing: border-box; } p.highlight:after { display: block; margin: 0 auto; margin-top: 2em; content: ""; width: 10vw; height: 1px; background-color: #C18A07; } b, strong { font-weight: bold; } p > strong { font-weight: bold; } article#main { width: 100%; height: auto; overflow: hidden; } article ul, article ol { margin: 0 0 1.5em; zoom: 1; } article ul { list-style-type: none; } article ol { list-style-type: decimal; } article ol li { margin: 0 0 0 1em; padding: 0 0 0 0.5em; } article ul li { position: relative; margin: 0 0 0 0.75em; padding: 0 0 0 0.5em; } .large-number-left .clmn-content { position: relative; } .large-number-left p.number { margin: 0; padding: 0; line-height: 1; font-family: 'Ahnefeld-Light', serif; font-size: 3.5em; font-weight: normal; color: #c18a07; width: 15%; float: left; } .large-number-left p.number + h4 { width: 85%; float: right; text-align: left; padding-bottom: 0; } .large-number-left p.number + h4 + p { width: 85%; float: right; } /* === HEADER === */ #header { position: fixed; top: 0; display: block; height: auto; width: 100%; padding: 0; box-sizing: border-box; z-index: 9; transition: .5s all ease-in-out; } #header * { transition: all .2s ease; } #header .inside { display: block; padding: 0 80px; text-align: center; } #header .clmn { padding: 0; } #header .logo { display: inline-block; position: absolute; left: 80px; height: 45px; margin: 46px 0; margin-bottom: 0; background-image: url(images/rechtsanwalt-berlin_ahnefeld-law_white.svg); background-position: top left; background-size: auto 100%; background-repeat: no-repeat; } #header .logo img { display: block; height: 100%; width: auto; } .navToggle { display: none; } #mainmenu { width: auto; margin: 0 auto; display: inline-block; } #mainmenu ul { width: 100%; text-align: right; } #mainmenu ul.menu > li { display: inline-block; position: relative; float: left; margin-top: 42px; } #mainmenu ul.menu > li > a { display: block; color: #fff; font-weight: 300; font-size: 0.9em; letter-spacing: 2px; padding: 0.8em 1.2em; text-transform: uppercase; } #mainmenu ul.menu > li > a:hover { color: #e2a410; cursor: pointer; text-decoration: none; } #mainmenu ul.menu > li.current-menu-item > a, #mainmenu ul.menu > li.current_page_item > a, #mainmenu ul.menu > li.current-page-ancestor > a { color: #c18a07; text-decoration: none; } #mainmenu ul.menu > li.menu-item-has-children:hover { background-color: #162748; } #mainmenu ul.menu > li.menu-item-has-children:hover > a { color: #e2a410; } #mainmenu ul.menu > li > ul.sub-menu { display: none; position: absolute; top: 100%; left: 0; width: auto; box-shadow: 0px 10px 10px rgba(0,0,0,0.2); } #mainmenu ul.menu > li:hover > ul.sub-menu { display: block; background-color: #162748; text-align: left; } #mainmenu ul.sub-menu > li { position: relative; display: block; padding: 0; margin: 0; } #mainmenu ul.sub-menu > li > a { display: block; font-size: 0.9em; font-weight: normal; color: #fff; padding: 0.75em 1.2em; white-space: nowrap; margin: 0; } #mainmenu ul.sub-menu > li > a:hover, #mainmenu ul.sub-menu > li.current-menu-item > a { background-color: #13213D; color: #e2a410; text-decoration: none; } #mainmenu ul.sub-menu > li > ul.sub-menu { display: none; position: absolute; top: 0; left: 100%; box-shadow: 0px 10px 10px rgba(0,0,0,0.2); } #mainmenu ul.sub-menu > li:hover > ul.sub-menu { display: block; } #mainmenu ul.sub-menu > li > ul.sub-menu > li > a { background-color: #fff; text-align: left; } #header .header-widgets { display: inline-block; position: absolute; top: 40px; right: 80px; } #header .language { display: block; width: 50px; height: 50px; margin-top: 9px; box-sizing: border-box; border-radius: 30px; border: none; background-color: transparent; background-image: url(images/ico_language_white.svg); background-size: 80% auto; background-repeat: no-repeat; background-position: top 6px center; overflow: hidden; transition: all .2s ease-out; } #header .language:hover, #header .language:focus { height: auto; background-color: #e2a410; color: #fff; cursor: pointer; } #header .language a { color: #494e55; text-align: center; width:100%; display: block; margin-bottom: 5px; } #header .language a:hover { color: #e2a410; } #header .language a:first-child { margin-top: 45px; } #header .language a:last-child { margin-bottom: 10px; } #header .language a.current_language { font-weight: bold; color: #e2a410; } .contact-button { position: fixed; z-index: 2000; bottom: 50vh; right: 20px; width: 80px; height: 80px; padding: 12px; box-sizing: border-box; overflow: hidden; text-align: center; background-color: #c18a07; border-radius: 100%; box-shadow: 3px 3px 6px rgba(0,0,0,0.25); transition: all .2s ease-in-out; } .contact-button img { width: 100%; height: auto; } .contact-button:hover { cursor: pointer; background-color: #e2a410; transform: scale(1.1); } /* --- SCROLLING HEADER --- */ body.scrolling { } body.scrolling #header { height: auto; background-color: #13213D; text-align: center; } body.scrolling #header .inside { margin: 0 auto; text-align: center; } body.scrolling #header .logo { display: inline-block; height: 45px; margin: 18px 0; margin-bottom: 0; background-image: url(images/rechtsanwalt-berlin_ahnefeld-law_white.svg); } body.scrolling #header .header-widgets { top: 18px; } body.scrolling #mainmenu { margin: 0 auto; } body.scrolling #mainmenu ul.menu > li { margin-top: 0; margin-bottom: 0; } body.scrolling #mainmenu ul.menu > li > a { color: #fff; padding: 1.7em 1.2em; } body.scrolling #mainmenu ul.menu > li > a:hover, body.scrolling #mainmenu ul.menu > li.current-menu-item > a, body.scrolling #mainmenu ul.menu > li.current-page-ancestor > a { color: #e2a410; } body.scrolling #mainmenu ul.menu > li.menu-item-has-children:hover { background-color: #162748; } body.scrolling #mainmenu ul.menu > li.menu-item-has-children:hover > a { color: #e2a410; } body.scrolling #header .language { background-image: url(images/ico_language_black.svg); } body.scrolling #header .language:hover, body.scrolling #header .language:focus { height: auto; background-color: #fff; color: #494e55; cursor: pointer; } /* --- BLOG HEADER --- */ body.blog #header { background-color: #fff; background-image: none; box-shadow: 0 0 10px rgba(0,0,0,0.05); } body.blog #header .logo { background-image: url(images/rechtsanwalt-berlin_ahnefeld-law_white.svg); } body.blog #mainmenu ul.menu > li > a { color: #192b3c; } body.blog #mainmenu ul.menu > li > a:hover, body.blog #mainmenu ul.menu > li.current-menu-item > a, body.blog #mainmenu ul.menu > li.current-page-ancestor > a { color: #e2a410; } body.blog #header .language { background-image: url(images/ico_language_black.svg); } body.blog #header .language:hover, body.blog #header .language:focus { height: auto; background-color: #fff; color: #494e55; cursor: pointer; } /* === Slider === */ .slider { width: 100% !important; max-width: 5000px; overflow: hidden; } .slider ul.bjqs { height: 100% !important; width: 100% !important; list-style-type: none; position: relative; margin: 0; } .slider ul.bjqs li.bjqs-slide { position: absolute; background-size: cover; background-position: center center; background-repeat: no-repeat; height: 100% !important; width: 100% !important; margin: 0; padding: 0; box-sizing: border-box; display: none; } .slider ul.bjqs li.bjqs-slide:before { display: none; } .slider .slider-image-wrapper { background-size: cover; background-repeat: no-repeat; position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; } .slider .slider-image-wrapper.bg-position-top { background-position: top center; } .slider .slider-image-wrapper.bg-position-center { background-position: center center; } .slider .slider-image-wrapper.bg-position-bottom { background-position: bottom center; } .slider .slider-content-wrapper { position: relative; width: 100%; height: 100%; margin: 0; display: flex; align-items: center; z-index: 2; } .slider .slider-content-wrapper .inside { position: relative; box-sizing: border-box;} .slider .slider-content-wrapper.slider-content-left .inside { max-width: 1660px; margin: 0 auto; box-sizing: border-box; padding-right: 30%; } .slider .slider-content-wrapper.slider-content-center .inside { width: 100%; padding-left: 10%; padding-right: 10%; text-align: center;} .slider .slider-content-wrapper.slider-content-right .inside { max-width: 1460px; margin: 0 auto; box-sizing: border-box; padding-left: 30%; } .slider .slider-content-wrapper .inside h1 { font-size: 4.5em; padding-bottom: 0em; position: relative; margin-top: 1em; } .slider .slider-content-wrapper .inside h1.small { font-size: 2.0em; } .slider .slider-content-wrapper .inside h1.large { } .slider .slider-content-wrapper h1 + h2 { font-family: 'SFPro', sans-serif; font-weight: 300; font-size: 1.4em; } .slider .slider-content-wrapper .inside p { font-size: 1.5em; font-weight: 300; margin-top: 1em; margin-bottom: 2em; } .slider .slider-content-wrapper .inside.slider-text-white h1, .slider .slider-content-wrapper .inside.slider-text-white h2, .slider .slider-content-wrapper .inside.slider-text-white p { color: #fff; } .slider .slider-content-wrapper .inside.slider-text-lightblue h1, .slider .slider-content-wrapper .inside.slider-text-lightblue h2 { color: #fff; } .slider .slider-content-wrapper .inside.slider-text-lightblue p { color: #a2bcbd; } .slider .slider-content-wrapper .inside.slider-text-black h1, .slider .slider-content-wrapper .inside.slider-text-black h2 { color: #192b3c; } .slider .slider-content-wrapper .inside.slider-text-black p { color: #192b3c; } .slider .bjqs-markers { position: absolute; bottom: 0; margin: 0; left: 0 !important; height: 60px; width: 100%; text-align: center; background-image: url(images/bg_bjqs-markers.png); background-position: bottom center; background-repeat: repeat-x; z-index: 1; } .slider .bjqs-markers li { display: inline-block; margin: 0 5px; line-height: 30px; } .slider .bjqs-markers li a { font-size: 0; background-color: #fff; display: block; width: 8px; height: 8px; border: 2px solid #fff; border-radius: 16px; } .slider .bjqs-markers li.active-marker a { background-color: #fff; width: 50px; } .slider .bjqs-controls li { margin: 0.75em; padding: 0; transition: all .2s ease-in-out; } .slider .bjqs-controls li:hover { transform: scale(1.2); } .slider .bjqs-controls li:last-of-type { margin-left: 0; } .slider .bjqs-controls li.bjqs-prev a { background-image: url(images/icon_slider_prev.svg); background-position: center center; background-repeat: no-repeat; background-size: 100% auto; } .slider .bjqs-controls li.bjqs-next a { background-image: url(images/icon_slider_next.svg); background-position: center center; background-repeat: no-repeat; background-size: 100% auto; } .slider.slider-default { } .slider.slider-left, .slider.slider-right { margin: 0 auto; padding: 0; max-width: 5000px; box-sizing: border-box; } .slider.slider-left .slider-content-wrapper .inside, .slider.slider-right .slider-content-wrapper .inside { padding-left: 0; padding-right: 0; } .slider.slider-left .bjqs-markers, .slider.slider-right .bjqs-markers { display: none; } .slider.slider-left .bjqs-controls, .slider.slider-right .bjqs-controls { position: absolute; top: 90%; z-index: 3; } .slider.slider-left .bjqs-controls { left: 50%; } .slider.slider-right .bjqs-controls { left: 42%; } .slider.slider-left .bjqs-controls li, .slider.slider-right .bjqs-controls li { display: inline-block; } .slider.slider-left .bjqs-controls li:before, .slider.slider-right .bjqs-controls li:before { display: none; } .slider.slider-left .bjqs-controls li a, .slider.slider-right .bjqs-controls li a { box-sizing: border-box; display: block; width: 40px; height: 40px; font-size: 0; } .slider.slider-left { } .slider.slider-left .slider-image-wrapper { z-index: 0; position: absolute; left: 0; top: 0; width: 50%; box-sizing: border-box; } .slider.slider-left .slider-content-wrapper { z-index: 2; position: absolute; left: 50%; top: 0; width: 50%; box-sizing: border-box; padding: 6em 12em 6em 6em; } .slider.slider-right { } .slider.slider-right .slider-image-wrapper { position: absolute; left: 50%; top: 0; width: 50%; box-sizing: border-box; } .slider.slider-right .slider-content-wrapper { position: absolute; left: 0; top: 0; width: 50%; box-sizing: border-box; padding: 4em 6em 6em 6em; } .slider.slider-default .slider-overlay { display: block; z-index: 1; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #031334; opacity: .8; mix-blend-mode: multiply; } .slider.slider-left .slider-overlay, .slider.slider-right .slider-overlay { display: none; } .slider.slider-left .slider-content-wrapper img.logo, .slider.slider-right .slider-content-wrapper img.logo { max-width: 50%; margin-bottom: 2em; } /* === BANNER === */ #banner { position: relative; height: 55vh; background-color: #192b3c; } #banner .banner-content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; z-index: 1; } #banner .banner-background { background-size: cover; background-position: center center; background-repeat: no-repeat; height: 100%; width: 100%; } #banner .banner-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-image: url(images/slider-overlay.png); background-size: cover; background-position: center center; } /* === MAIN === */ .pagecontent, .inclcontent { box-sizing: border-box; } .inclcontent.vh25 { min-height: 25vh; } .inclcontent.vh50 { min-height: 50vh; } .inclcontent.vh75 { min-height: 75vh; } .inclcontent.vh100 { min-height: 100vh; } /* === COLUMNS === */ .columns { width: calc(100% + 2em); height: 100%; position: relative; flex-wrap: wrap; display: flex; padding-top: 4em; padding-bottom: 4em; margin-left: -1em; } .columns+.columns { padding-top: 0; } .columns:first-of-type { padding-top: 0; } .columns:last-of-type { padding-bottom: 0; } .clmn { box-sizing: border-box; float: left; margin-left: 1em; margin-right: 1em; padding: 0; } .clmn.transparent { padding: 0; } .clmn.white, .clmn.blue, .clmn.lightgrey, .clmn.gold, .clmn.with-padding { padding: 2em; /* box-shadow: 0 .2em .5em rgba(0,0,0,0.2); */ } .clmn.col25.white, .clmn.col25.blue, .clmn.col25.lightgrey, .clmn.gold { padding: 2em; } .clmn.col20 { width: calc(20% - 2em); } .clmn.col25 { width: calc(25% - 2em); } .clmn.col33 { width: calc(33.633333% - 2.3em); } .clmn.col50 { width: calc(50% - 2em); } .clmn.col60 { width: calc(60% - 2em); } .clmn.col67 { width: calc(67% - 2.3em); } .clmn.col75 { width: calc(75% - 2em); } .clmn.col80 { width: calc(80% - 2em); } .clmn.col100 { width: calc(100% - 2em); } #header .columns { border-radius: none; } #header .columns .clmn { margin-left: 0; } #header .columns .clmn.col20 { width: 20%; } #header .columns .clmn.col60 { width: 60%; } .clmn.col_align_left { /*margin-left: 0;*/ } .clmn.col_align_center { margin: 0 auto; } .clmn.col_align_right { float:right; margin-left: auto;} .clmn.align-center ul li { text-align: left; } .clmn img { width: 100%; height: auto; } .clmn.highlighted p { border-left: 4px solid #192b3c; margin-bottom: 0; padding-bottom: 2em; padding-left: 2em; box-sizing: border-box; } .clmn.highlighted p:last-of-type { padding-bottom: 0; } .clmn.lines-top-bottom { border-top: 1px solid #C18A07; border-bottom: 1px solid #C18A07; padding-top: 2em; padding-bottom: 2em; } .section-header + .columns { padding-top: 0; } /* --- CUSTOM COLUMN STYLES --- */ .clmn.icon { text-align: center; } .clmn.icon .clmn-content h3:after { display: none; margin-bottom: 0; } .clmn.icon img { float: none; width: 125px; height: 125px; margin: 0 auto; margin-bottom: -1em; } .clmn.profile-image { padding: 0; } .clmn.profile-image img { } .clmn.profile-image .profile-content { padding: 2em; box-sizing: border-box; width: 100%; } /* === TEASER-BOXES === */ section.teaser h2.section-header { margin-top: -1em !important; margin-bottom: .5em !important; } .clmn.teaser-item { margin-bottom: 2em; transition: all .2s ease; } .clmn.teaser-item:hover { transform: scale(1.03); box-shadow: 0 .2em 1em rgba(25,43,60,0.2); } .clmn.teaser-item .image { position: relative; } .clmn.teaser-item .image img { min-width: 100%; } .clmn.teaser-item .box { padding: 1.5em; box-sizing: border-box; } .clmn.teaser-item a { color: #192b3c; width: 100%; height: 100%; text-decoration: none; } .clmn.teaser-item h3 { /* margin-top: 1em; */ margin-top: 0; font-size: 1.3em; color: #192b3c; } .clmn.teaser-item p { font-size: 0.9em; color: #192b3c; } .clmn.teaser-item.col25 h3 { font-size: 1.1em; margin-top: 0; } .clmn.teaser-item.col25 p { font-size: .9em; } .teaser.lightgrey .teaser-item { background-color: #fff; } .teaser.white .teaser-item, .teaser.transparent .teaser-item { /* background-color: #f2f2eb; */ background-color: #FAF6F3; } .teaser.blue .teaser-item { background-color: #fff; } .teaser.blue .teaser-item h3, .teaser.blue .teaser-item p { color: #192b3c; } .teaser .teaser-item:hover { background-color: #192b3c; } .teaser .teaser-item:hover h3 { color: #fff; } .teaser .teaser-item:hover p { color: #e2a410; } /* === IMAGE FORMATS === */ .gallery { text-align: center; } .gallery .gallery-item { float: none !important; display: inline-block !important; box-sizing: border-box; padding: 20px; padding-top: 0; } .gallery .gallery-item img { border: none !important; } .gallery.gallery-columns-2 .gallery-item { margin-left: 10px; margin-right: 10px; padding-left: 0; padding-right: 0; width: calc(50% - 20px) !important; } /* === SOCIAL ICONS === */ ul.social-icons { display: block; list-style-type: none; margin-bottom: 2.5em; } ul.social-icons li { display: inline-block; margin: 0; padding: 0; } ul.social-icons li:before { display: none; } ul.social-icons li a { display: block; width: 36px; height: 36px; font-size: 0px; margin: 0 8px; background-position: center center; background-size: 100% auto; background-repeat: no-repeat; } ul.social-icons li:first-of-type a { margin-left: 0; } ul.social-icons li:last-of-type a { margin-right: 0; } ul.social-icons li a:hover { transform: scale(1.2); } ul.social-icons li a.xing { background-image: url(images/icon_socials_xing_gold.svg); } ul.social-icons li a.linkedin { background-image: url(images/icon_socials_linkedin_gold.svg); } ul.social-icons li a.instagram { background-image: url(images/icon_socials_instagram_blue.svg); } ul.social-icons li a.youtube { background-image: url(images/icon_socials_youtube_gold.svg); } ul.social-icons li a.web { background-image: url(images/icon_socials_web_gold.svg); } ul.social-icons.transparent li a { background-color: transparent; } ul.social-icons.transparent li a:hover { background-color: rgba(255,255,255,0.2); } ul.social-icons.blue li a { background-color: #c18a07; } ul.social-icons.blue li a:hover { background-color: #e2a410; } /* === ARTICLES OVERVIEW === */ body.blog ul.categories { display: block; margin-top: 1.5em; } body.blog li.cat-item { } body.blog li.cat-item { font-size: 0; display: inline-block; } body.blog li.cat-item a { font-size: 1.6rem !important; background-color: rgba(0,0,0,0.05); color: #192b3c; padding: .2em 1em; border-radius: 30px; margin-left: 5px; font-weight: bolder; } body.blog li.cat-item a:hover { text-decoration: none; background-color: #c18a07; color: #fff; } body.blog li.cat-item.current-cat a { background-color: #c18a07; color: #fff; } .blog-title { display: block; float: left; width: 100%; padding-top: 8em; } .blog-title .inside { padding: 1em 80px; } section.bloglist { clear: left; border-left: none; } section.bloglist .inside { padding: 0 80px; } #blog-overview { padding: 0; margin: 0; width: 100%; } #blog-overview h1 { padding-left: 1em; margin-top: 1em; margin-bottom: 0; } #blog-overview .item { position: relative; padding: 0; margin: 0 0 1.5em; background-color: #f1f1f1; width: calc(50% - 1em); } #blog-overview .item:nth-of-type(odd) { clear: left; } #blog-overview .item:nth-of-type(even) { margin-left: 2em; } #blog-overview .item h3 { color: #252627; } #blog-overview .item p { color: rgba(0,0,0,0.75); } #blog-overview .item:hover h3, #blog-overview .item:hover p { color: #192b3c; } #blog-overview .item .button:hover { background-color: #252627; cursor: pointer; } #blog-overview .clmn.item .meta { position: absolute; top: 0; left: 0; box-sizing: border-box; padding: 1em; background-color: #252627; color: #fff; font-size: .8em; } #blog-overview .clmn.item .image { position: relative; border-radius: 0; overflow: hidden; margin-bottom: 2em; padding: 0; margin: 0; width: 100%; } #blog-overview .clmn.item .text { padding: 1.5em; box-sizing: border-box; } #blog-overview .clmn.item h3 { margin-bottom: 0.5em; margin-top: 1em; line-height: 1.2; } #blog-overview .clmn.item .excerpt { font-size: .9em; line-height: 1.5; } #blog-sidebar { padding-top: 4.5em; } #blog-sidebar .sidebar-widget { width: 100%; float: left; display: block; margin-bottom: 2em; padding-bottom: 2em; border-bottom: 2px dotted #8da67f; } #blog-sidebar h3 { text-transform: none; font-size: 1.5em; } #blog-sidebar #searchform .screen-reader-text { display: none; } #blog-sidebar #searchform input#s { width: 100%; background-color: #265171; border-radius: 30px; border: none; padding: .5em 1em; } #blog-sidebar #searchform #searchsubmit { display: none; } /* === BLOG ARTICLES === */ section.blogcontent { margin-top: 4em; margin-bottom: 4em; } section.blogcontent .inside { padding: 0 80px; } section.blogcontent h1 + section.blogcontent h2 { margin-top: -1em; } section.blogcontent h2 { font-size: 1.8em; font-weight: normal; } section.blogcontent h3 { font-size: 1.25em; margin-top: 1em; font-weight: normal; } section.blogcontent .col75 p { text-align: justify; hyphens: auto;} .blogcontent .col75 img { display:block; overflow:hidden; margin-top:1.5em; margin-bottom:1.5em; } .blogcontent .col75 .blog-highlight { display: block; border-radius: 1.5em; overflow: hidden; margin-top: 1.5em; margin-bottom: 1.5em; box-sizing: border-box; padding: 1.5em; color: #fff; background-color: #265171; } .blogcontent .col75 .blog-highlight p, .blogcontent .col75 .blog-highlight h1, .blogcontent .col75 .blog-highlight h2, .blogcontent .col75 .blog-highlight h3 { text-align: center; color: #fff; } .blogcontent .col75 .blog-highlight h1, .blogcontent .col75 .blog-highlight h2, .blogcontent .col75 .blog-highlight h3 { margin-bottom: .5em; } .blogcontent .col75 .blog-highlight h2:before { display: none; } .blogcontent .col75 .blog-highlight .button { background-color: #fff; color: #265171; } .blogcontent .col75 .blog-highlight .button.arrow { background-image: url("images/arrow_black.png"); } .blogcontent .clmn img { width: auto; height: auto; } .blogcontent .col75 .wp-block-columns { display: flex; margin-bottom: 2em; } .blogcontent .col75 .wp-block-columns .wp-block-column { padding-left: 2em; box-sizing: border-box; } .blogcontent .col75 .wp-block-columns .wp-block-column:first-of-type { padding-left: 0; } .blogcontent .col75 .wp-block-columns .wp-block-column img { margin-top: 0; } .blogcontent .col75 .wp-block-columns .wp-block-column.has-background { padding-left: 2em; } .blogcontent .col75 .wp-block-columns .wp-block-column a.wp-block-button__link { display: inline-block; background-color: #c18a07; color: #fff; padding: 0.8em 1.6em; margin-top: 2em; font-size: 0.8em; font-weight: 300; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; } .blogcontent .col75 .wp-block-columns .wp-block-column a.wp-block-button__link:hover { background-color: #192b3c; } .blogcontent .col75 .wp-block-columns.cta .wp-block-column { background-color: #f6f6f6; padding: 2em; border-left: 8px solid #00b3a1; font-weight: 300; } /* — SIDEBAR —— */ .blogcontent .aside.col25 { width: calc(25% - 2em); padding: 0 2em; } .blogcontent .aside .sidebar-widget {display:block; margin-bottom: 2em; padding-bottom: 2em; border-bottom: 1px solid #e3ebde; } .blogcontent .aside .sidebar-widget h3 { text-transform: none; font-size: 1.3em; } .blogcontent .aside .sidebar-widget h3:after {display: none !important; } .blogcontent .aside .sidebar-widget p { font-size: 16px; font-size: 1.6rem; line-height: 1.6; } .blogcontent .aside .sidebar-widget iframe { max-width: 100% !important; } .blogcontent .aside .sidebar-widget img { border-radius: 1.5em; } .blogcontent .aside .sidebar-widget ul li { margin-left: 0; padding-left: 0; font-size: 0.9em; line-height: 1.2 !important; margin-bottom: 1em; } .blogcontent .aside .sidebar-widget ul li:before { display: none; } .blogcontent .aside .sidebar-widget a { } .blogcontent .aside .sidebar-widget a:hover { color: #265171; } /* --- TESTIMONIAL SLIDER --- */ .testimonialSlider .cbp-fwslider { position: relative; margin: 0 0 10px; display: block; height: auto; overflow: hidden; margin-top: 3em; } .testimonialSlider .cbp-fwslider ul { margin: 0; padding: 0; white-space: normal; list-style-type: none; } .testimonialSlider .cbp-fwslider ul li { transform: translateZ(0); float: left; display: block; margin: 0; margin-bottom: 0px; padding: 0; font-size: 1.1em; font-family: 'Ahnefeld-Light', serif; font-style: normal; font-weight: lighter; text-align: center !important; } .testimonialSlider .cbp-fwslider img, .testimonialSlider .cbp-fwslider ul li img { display: block; width: 10em; height: auto; margin: 0 auto; margin-bottom: 1em; } .testimonialSlider .cbp-fwslider ul li span.small { display: block; margin-top: 1em; font-size: .7em; font-style: normal; font-weight: normal; color: #c18a07; } .testimonialSlider .cbp-fwslider ul li:before { display: none; } .testimonialSlider .cbp-fwslider ul li > a, .testimonialSlider .cbp-fwslider ul li > div { display: block; text-align: center; outline: none; } .testimonialSlider .cbp-fwslider ul li > a img { border: none; display: block; margin: 0 auto; max-width: 75%; } .testimonialSlider .cbp-fwslider nav { display: none; } .testimonialSlider .cbp-fwslider nav span { position: absolute; top: 50%; width: 50px; height: 100px; background: transparent; color: #c18a07; text-align: center; margin-top: -50px; line-height: 100px; cursor: pointer; } .testimonialSlider .cbp-fwslider nav span:hover { color: #203548; background: transparent; } .testimonialSlider .cbp-fwslider nav span.cbp-fwnext { right: 0px; } .testimonialSlider .cbp-fwslider nav span.cbp-fwprev { left: 0px; } .testimonialSlider .cbp-fwdots { position: absolute; bottom: 0px; white-space: nowrap; text-align: center; width: 100%; } .testimonialSlider .cbp-fwdots span { display: inline-block; width: 10px; height: 10px; background: #e9efef; margin: 4px; border-radius: 50%; cursor: pointer; } .testimonialSlider .cbp-fwdots span:hover { background: #2d364c; } .testimonialSlider .cbp-fwdots span.cbp-fwcurrent { background: #c18a07; box-shadow: 0 0 0 2px #c18a07; transition: box-shadow 0.2s ease-in-out; } .testimonialSlider .cbp-fwslider p { font-size: 1em; text-align: center; } /* === TABELLEN === */ table { width: 100%; margin-top: 2em; margin-bottom: 2em; overflow: hidden !important; } table tbody, table tbody tr { width: 100%; } table.lines tbody tr { border-bottom: 1px solid #fff; } table tbody tr:nth-of-type(odd) { } table tbody tr:nth-of-type(even) { } table tbody tr td { padding: .5em 0; box-sizing: border-box; } table.checkmarks tr td { background-image: url(images/icon_checkmark_blue.svg); background-size: auto 40%; background-position: center left; background-repeat: no-repeat; padding-left: 40px; box-sizing: border-box; } /* === LISTEN STYLES === */ ul.fancylist { margin-top: 0 !important; } ul.fancylist li { display: inline-block; position: relative; width: 100%; padding: .75em 0 .75em 2em; margin-left: 0; border-bottom: 1px solid #dfdfd5; font-size: 1em; } ul.fancylist li:before { content: ""; display: block; height: 1em; width: 1em; background-image: url(images/list-arrow_blue.svg); background-size: 100% auto; background-repeat: no-repeat; position: absolute; left: 0; margin-top: 5px; } ul.checklist li { margin: 1em 0 0 1.2em; text-align: left; } ul.checklist li:before { content: "✓"; position:absolute; color: #c18a07; left:-1em; top:-0,2em; font-size:1.3em; } .clmn.blue ul.checklist li:before { color: #fff; } ul.arrowlist li { margin: 1em 0 0 1.5em; text-align: left; } ul.arrowlist li:before { content: url('images/list-arrow_gold.svg'); position: absolute; left: -1em; margin-top: -2px; width: .8em; height: .8em; } .clmn.blue ul.arrowlist li:before { content: url('images/list-arrow_white.svg'); } ul.arrowlist.large li { margin: 0 0 0 2.0em; text-align: left; font-size: 1.25em; } ul.arrowlist.large li:before { left: -2em; margin-top: 6px; width: 1.5em; height: 1.5em; } ul.questionlist li { margin: 1em 0 0 1.2em; } ul.questionlist li:before { content: "?"; position:absolute; color: #c18a07; left:-1em; top:0; font-weight:300; font-size:1.3em; } ul.contentlist { list-style-type: none !important; } ul.contentlist li { display: block; width: 100%; border-bottom: 1px solid #00b3a1; margin-left: 0; margin-bottom: 1.5em !important; padding-left: 0; padding-bottom: 1.3em; } ul.contentlist li:before { display: none; } ul.contentlist li:last-of-type { border-bottom: none; margin-bottom: 0; } ul.tag-list li { display: inline-block; margin: 2px; margin-bottom: 2px; border-radius: 30px; background-color: rgba(0,0,0,0.1); color: inherit; padding: .4em 1.4em; } ul.tag-list li:before { display: none; } iframe.googlemap { height: 550px; } /* === FOOTER === */ #bottom { background-color: #0f1a32; position: relative; font-size: 0.9em; font-weight: 300; color: rgba(255,255,255,0.5); padding: .5em 0; background-size: cover; background-position: center center; background-repeat: no-repeat; } #bottom .inside { padding-top: 2em; padding-bottom: 2em; } #bottom .inside .columns { padding: 2em; } #bottom .clmn { margin-left: 5%; margin-right: 0; } #bottom .clmn.col25 { width: 19%; } #bottom .clmn.col33 { width: 28%; } #bottom .clmn:first-of-type { margin-left: 0; } #bottom .footer-widget { margin-bottom: 2em; } #bottom .footer-widget img { max-width: 50% !important; } #bottom .footer-widget h3 { font-size: 1.2em; text-transform: uppercase; padding-bottom: .75em; color: #fff; letter-spacing: 1px; } #bottom .footer-widget h3:after { background-color: #c18a07; } #bottom .footer-widget p { color: rgba(255,255,255,0.5); } #bottom .footer-widget ul li { margin-bottom: 0 !important; } #bottom .footer-widget ul li a { display: block; padding: 0.3em 0; } #bottom a, #bottom .footer-widget a { color: #c18a07; } #bottom a:hover, #bottom .footer-widget a:hover { color: #fff; text-decoration: none; } #bottom.landingpage .textwidget p {text-align: center; } #bottom p.small { color: #fff; } #bottom p.border-top { border-top: 1px solid rgba(255,255,255,0.5); padding-top: 1em; } .credits { width: 100%; box-sizing: border-box; display: block; background-color: #0f1a32; padding:20px; margin:0; text-align: center; line-height: 1em; font-size: .7em; color: #9899a8; } .credits .inside { padding: 0 40px; } .credits a { color: #c18a07; text-decoration: none; } .credits a:hover { color: #fff; text-decoration: none; } /* === GUTENBER CUSZOMIZATION === */ .wp-block-column.has-background { padding: 2em; margin-bottom: 2em; } /* === ARCONIX FAQ CUSZOMIZATION === */ h3.arconix-faq-term-title { display: none !important; } .clmn-content .ui-widget { font-family: inherit; font-size: 1.5em; width: 100%; } .clmn-content .ui-accordion .ui-accordion-header { color: #241D18; border: none; background-color: transparent; border-radius: 0; padding: 1em 0 1em 1.5em; margin-bottom: 10px; font-family: 'Ahnefeld-Light', serif; font-size: .9em; font-weight: normal; transition: all .2s ease-in-out; border-bottom: 1px solid #c18a07; } .clmn-content .ui-accordion .ui-accordion-header:hover { color: #c18a07; } .clmn-content .ui-accordion .ui-accordion-header.ui-state-active { color: #c18a07; margin-bottom: 0; } .clmn-content .arconix-faq-accordion-title.ui-accordion-header span.ui-icon { background-image: url(images/arconix_icon_gold_plus.png); margin-top: -7px; left: -1em; right: 0; width: 30px; height: 30px; background-position: center center; background-size: 100%; } .clmn-content .arconix-faq-accordion-title.ui-accordion-header.ui-accordion-header-active .ui-icon { background-image: url(images/arconix_icon_gold_minus.png); } .clmn-content .ui-widget-content { position: relative; border: none; border-radius: 0; background-color: transparent; margin-bottom: 10px; background-image: none; } .clmn-content .ui-accordion .ui-accordion-content { padding: 0; padding-top: 1em; overflow: visible; border: none; } .clmn-content .arconix-faq-accordion-content h3 { margin-bottom: 1em; } .clmn-content .arconix-faq-accordion-content p { font-family: 'SFPro', sans-serif; font-weight: 300; font-size: 18px; font-size: 1.8rem; line-height: 1.6; color: #241D18; } .clmn-content .arconix-faq-accordion-content a { color: #c18a07; } .clmn-content .arconix-faq-accordion-content a:hover { color: #c18a07; text-decoration: underline; } .clmn-content .arconix-faq-accordion-content a.button { color: #fff; } .clmn-content .arconix-faq-accordion-content a.button:hover { color: #fff; text-decoration: none; } .clmn-content .arconix-faq-accordion-content ul {margin-top: 1em; } .clmn-content .arconix-faq-accordion-content ul li { font-size: 0.65em; color: #fff; border-bottom-color: rgba(255,255,255,0.25); } .clmn-content .arconix-faq-accordion-content ul li:before { color: #192b3c; } .clmn-content .arconix-faq-accordion-content table { width: auto; margin-top: 0; margin-bottom: 0; border-radius: 0; font-size: 0.6em; } .clmn-content .arconix-faq-accordion-content table tbody tr { background-color: transparent; } /* === CONTACT FORM 7 CUSTOMIZATION == */ .wpcf7 { width: 100%; display: block; height: auto; } .wpcf7 .wpcf7-form { width: 100%; } .wpcf7 input, .wpcf7 textarea { width: 100% ; background-color: #f2f2f2; color: #192b3c; font-size: 1em; border: none; padding: .6em 1em; margin-bottom: 10px; } .wpcf7 input.half-width { width: 48%; float: left; margin-left: 1%; margin-right: 1%; } .wpcf7 .button { width: auto; border: none; padding-left: 3em; padding-right: 3em; background-color: #c18a07; color: #fff; } .wpcf7 .button:hover { cursor: pointer; background-color: #16d46a; color: #fff; } .blue .wpcf7 .button { background-color: #192b3c; color: #fff; border-radius: 0 !important; } .blue .wpcf7 .button:hover { cursor: pointer; background-color: #192b3c; } .wpcf7 .wpcf7-acceptance input { display: inline-block; width: auto; margin-left: -10px; margin-top: -10px; } .wpcf7 .wpcf7-acceptance .wpcf7-list-item-label { display: inline-block; font-size: .75em; float: right; width: 97%; line-height: 1.4; margin-bottom: 1em; } .wpcf7 ::placeholder { color: #313032; } .wpcf7 .wpcf7-not-valid-tip { position: relative; font-size: .75em; background: #ffffff; border-radius: .35em; padding: .5em 1em; margin-top: .75em; } .wpcf7 .wpcf7-not-valid-tip:after { bottom: 100%; left: 10%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 10px; margin-left: -10px; } .wpcf7 form .wpcf7-response-output { margin: 0 !important; padding: 1em; border-radius: .35em; } .wpcf7 form.invalid .wpcf7-response-output { border-color: #ffc900 !important; background-color: #ffc900 !important; } .wpcf7 form.sent .wpcf7-response-output { border-color: #46b450 !important; background-color: #46b450 !important; color: #fff !important; } /* === WP SHOW POSTS CUSTOMIZATION === */ .wpsp-card-list .wp-show-posts-columns { margin-bottom: 1em; } .wpsp-card-list .wp-show-posts-single { transition: all .2s ease-in-out; margin-bottom: 1em !important; } .wpsp-card-list .wp-show-posts-single:hover { transform: scale(1.03); } .wpsp-card-list .wp-show-posts-single:hover .wp-show-posts-inner { box-shadow: 0 .2em 1em rgba(25,43,60,0.2); } .wpsp-card-list .wp-show-posts-columns .wp-show-posts-single { margin-bottom: 0 !important; } .wpsp-card-list .wp-show-posts-inner { transition: all .2s ease-in-out; } section.transparent .wpsp-card-list .wp-show-posts-inner { background-color: #f2f2eb; } section.white .wpsp-card-list .wp-show-posts-inner { background-color: #f2f2eb; } section.lightgrey .wpsp-card-list .wp-show-posts-inner { background-color: #fff; } section.blue .wpsp-card-list .wp-show-posts-inner { background-color: rgba(255,255,255,0.1); } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-image { margin: 0; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-header { padding: 1.5em; margin: 0; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-title { position: relative; text-align: left; color: #192b3c; font-size: 1.2em; padding-bottom: 0; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-title a { color: #192b3c; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-title:hover a { color: #c18a07; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-meta a { display: block; position: relative; color: #c18a07; text-align: left; margin-top: -.5em; } .wpsp-card-list .wp-show-posts-inner .wp-show-posts-entry-summary { padding: 1.5em; padding-top: 0; margin-bottom: 0; text-align: left; font-size: .9em; } .wpsp-card-list .wp-show-posts-inner .wpsp-read-more { text-align: left; float: left; margin: 1.5em !important; margin-top: 0 !important; } .wpsp-card-list .wp-show-posts-inner .wpsp-read-more a { text-align: left; margin: 0; padding: 0; font-size: .9em; font-weight: 300; border: none; text-shadow: none; color: #c18a07; } .wpsp-card-list .wp-show-posts-inner .wpsp-read-more a:hover { border: none; transform: none; background-color: transparent; color: #c18a07; } section.transparent .wpsp-card-list .wp-show-posts-inner:hover { background-color: #192b3c; color: #a2bcbd; } section.transparent .wpsp-card-list .wp-show-posts-inner:hover .wp-show-posts-entry-title a { color: #fff; } section.white .wpsp-card-list .wp-show-posts-inner:hover { background-color: #192b3c; color: #a2bcbd; } section.white .wpsp-card-list .wp-show-posts-inner:hover .wp-show-posts-entry-title a { color: #fff; } section.lightgrey .wpsp-card-list .wp-show-posts-inner:hover { background-color: #192b3c; color: #a2bcbd; } section.lightgrey .wpsp-card-list .wp-show-posts-inner:hover .wp-show-posts-entry-title a { color: #fff; } /* WPSP List */ .wpsp-list .wp-show-posts-single { transition: all .2s ease-in-out; margin-bottom: 1.5em !important; padding-bottom: 1.5em; border-bottom: 1px solid #dfdfd5; } .wpsp-list .wp-show-posts-single:hover { transform: scale(1.03); } .clmn.blue .wpsp-list .wp-show-posts-inner { } .wpsp-list .wp-show-posts-inner .wp-show-posts-image { margin: 0; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-header { padding-bottom: .5em; margin: 0; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-title { display: block; position: relative; width: 100%; height: auto; overflow: hidden; color: #192b3c; font-size: 1.6em; padding-bottom: 0; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-title a { color: #192b3c; position: relative; float: left; margin-left: 1.6em; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-title a:before { content: ""; display: block; height: 1em; width: 1em; background-image: url(images/list-arrow_blue.svg); background-size: 100% auto; background-repeat: no-repeat; float: left; position: relative; margin-right: .5em; margin-top: 2px; margin-left: -1.6em; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-title:hover a { color: #c18a07; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-meta a { display: block; color: #c18a07; } .wpsp-list .wp-show-posts-inner .wp-show-posts-entry-summary { padding-bottom: 0; padding-left: 2.5em; margin-bottom: 0; font-size: 1em; } .wpsp-list .wp-show-posts-inner .wpsp-read-more { margin-top: .5em; } .wpsp-list .wp-show-posts-inner .wpsp-read-more a { margin: 0; padding: 0; padding-left: 2.5em; font-size: 1em; font-weight: 300; border: none; text-shadow: none; color: #c18a07; } .wpsp-list .wp-show-posts-inner .wpsp-read-more a:hover { border: none; transform: none; background-color: transparent; color: #c18a07; } /* WPSP Compact List */ .wpsp-compact-list .wp-show-posts-single { transition: all .2s ease-in-out; margin-bottom: 1em !important; padding-bottom: 1em; border-bottom: 1px solid #dfdfd5; } .wpsp-compact-list .wp-show-posts-single:hover { transform: scale(1.03); } .clmn.blue .wpsp-compact-list .wp-show-posts-inner { } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-image { margin: 0; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-header { padding-bottom: .5em; margin: 0; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-title { display: block; position: relative; width: 100%; height: auto; overflow: hidden; color: #192b3c; font-size: 1.1em; padding-bottom: 0; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-title a { color: #192b3c; position: relative; float: left; margin-left: 1.6em; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-title a:before { content: ""; display: block; height: 1em; width: 1em; background-image: url(images/list-arrow_blue.svg); background-size: 100% auto; background-repeat: no-repeat; float: left; position: relative; margin-right: .5em; margin-top: 2px; margin-left: -1.6em; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-title:hover a { color: #c18a07; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-meta a { display: block; color: #c18a07; } .wpsp-compact-list .wp-show-posts-inner .wp-show-posts-entry-summary { padding-bottom: 0; margin-bottom: 0; font-size: .9em; } .wpsp-compact-list .wp-show-posts-inner .wpsp-read-more { } .wpsp-compact-list .wp-show-posts-inner .wpsp-read-more a { margin: 0; padding: 0; font-size: .9em; font-weight: 300; border: none; text-shadow: none; color: #c18a07; } .wpsp-compact-list .wp-show-posts-inner .wpsp-read-more a:hover { border: none; transform: none; background-color: transparent; color: #c18a07; } /* === RESPONSIVENESS === */ @media screen and (max-width:1720px) { body { font-size: 16px; font-size: 1.6rem; } #header .logo { height: 42px; } body.scrolling #header .logo { height: 42px; margin: 15px 0; } .navToggle .bar.two { top: 14px; } .navToggle .bar.three { top: 28px; } .slider.slider-left .slider-content-wrapper { padding: 4em 4em 4em 4em; } .slider.slider-right .slider-content-wrapper { padding: 4em 4em 4em 4em; } p.number-circle { width: 52px; height: 52px; line-height: 52px; } .contact-button { width: 60px; height: 60px; } } @media screen and (max-width:1280px) { body { font-size: 15px; font-size: 1.5rem; } .inside { padding: 5em 40px; } #header .inside { padding: 0 40px; } #header .logo { height: 38px; } body.scrolling #header .logo { height: 38px; margin: 15px 0; } } @media screen and (max-width:1023px) { #header { } body.scrolling #header { background-color: #fff; } #header .inside { position: relative; float: left; width: 100%; padding: 0 40px; } #header .logo, body.scrolling #header .logo { height: 28px; margin: 10px 0; } #header .language { margin-top: -2px; } #headermenu ul.menu > li { margin-top: 26px; } #headermenu ul.menu > li > a { padding: 0 1em; } #header .menu-widgets { right: 70px; } .navToggle { display: block; position: absolute; z-index: 999; top: 14px; right: 36px; height: 30px; width: 30px; } .navToggle .bar { position: absolute; width: 30px; height: 1.5px; border-radius: 6px; background-color: #fff; transition: all .2s ease-in-out; } .navToggle:hover .bar { background-color: #00b3a1; } .navToggle .bar.one {top: 0; } .navToggle .bar.two {top: 10px; } .navToggle .bar.three {top: 20px; } .navToggle.active .bar { background-color: #192b3c; } .navToggle.active:hover .bar { background-color: #00b3a1; } .navToggle.active .bar.one { transform: rotate(135deg); top: 12px; } .navToggle.active .bar.two { visibility: none; opacity: 0; } .navToggle.active .bar.three { transform: rotate(45deg); top: 12px; } body.scrolling .navToggle .bar { background-color: #192b3c; } #mainmenu { display: block; opacity: 0; position: absolute; top: 0; right: -200px; width: 33%; height: 100vh; z-index: -1; overflow: hidden; background-color: #fff; transition: all .5s ease; } #mainmenu.open { right: 0; opacity: 1; } #mainmenu ul.menu { display: block; box-sizing: border-box; padding: 25% 2em; width: 100%; margin: 0 auto; text-align: left; } #mainmenu ul.menu li { display: block; width: 100%; margin-top: 0 !important; margin-bottom: 0; } #mainmenu ul.menu li a { color: #192b3c !important; padding: .2em 0 !important; text-align: left; font-size: 1.1em; letter-spacing: 0; } #mainmenu ul.menu li a:hover { background-color: transparent; color: #c18a07 !important; } #mainmenu ul.menu > li > a { font-weight: bold; padding: .5em 0 !important; border-top: 1px solid rgba(0,0,0,0.1); } #mainmenu ul.menu > li:first-of-type > a { border-top: none; } #mainmenu ul.menu li.current-menu-item > a { color: #c18a07 !important; background-color: transparent !important; } #mainmenu ul.menu > li > ul.sub-menu { display: block; position: relative; box-shadow: none; background-color: transparent; margin-top: 0; margin-bottom: .5em; } body.scrolling #mainmenu ul.menu > li > a { color: #192b3c; } body.scrolling #mainmenu ul.menu > li > a:hover, body.scrolling #mainmenu ul.menu > li.current-menu-item > a, body.scrolling #mainmenu ul.menu > li.current-page-ancestor > a { color: #192b3c; } body.scrolling #mainmenu ul.menu > li.menu-item-has-children:hover { background-color: transparent; } body.scrolling #mainmenu ul.menu > li.menu-item-has-children:hover > a { color: #192b3c; } body.scrolling #mainmenu ul.menu > li:hover > ul.sub-menu { background-color: transparent; } body.scrolling #mainmenu ul.sub-menu > li > a { color: #192b3c; } body.scrolling #mainmenu ul.sub-menu > li > a:hover, body.scrolling #mainmenu ul.sub-menu > li.current-menu-item > a { background-color: transparent; color: #192b3c; } #banner { height: 40vh; background-position: center center; } #banner .banner-content h1 { font-size: 1.6em; } .inside { padding-left: 40px; padding-right: 40px; } .slider.slider-right .slider-content-wrapper { padding: 2em; } .slider { min-height: 640px; max-height: 640px; } .inclcontent ol li { padding: 0 0 0 80px !important; min-height: 90px; } .inclcontent ol li::before { width: 70px; height: 70px; line-height: 70px; } h1, h2, h3, h4 { hyphens: auto;} h2 + h2 { margin-top: -0.7em; } em { padding-top: 70px; background-size: 60px auto; } .icon img { width: 80px; height: 80px; margin-bottom: 1em; } .gallery .gallery-item { width: 33% !important; padding: 0 25px !important; } section.blogcontent .inside { padding: 0 40px; } .blogcontent .aside.col25 { width: 25%; padding: 0; margin: 0; } .clmn.highlighted p { border-left-width: 3px; } } @media screen and (max-width:640px) { .hideMobile { display: none; } .showMobile { display: block; } body { font-weight: 300; } body.scrolling #header { background-color: #f2f2ebf0; } #header .inside { padding-left: 20px; padding-right: 20px; } .two-columns, three-columns { column-count: 1; } .contact-button { position: fixed; bottom: 20px; right: 15px; width: 56px; height: 56px; } .navToggle { right: 20px; } #headermenu { display: none; } #header .menu-widgets { right: 64px; top: 10px; } #header .menu-widget a.button { padding: 0.5em 1.2em; } #mainmenu { width: 100%; right: -100%; } #mainmenu ul.menu { padding: 20% 1.1em; } .inside { padding: 3em 40px; } .vh50, .vh75 { min-height: 40% !important; max-height: 40% !important; } .vh100 { min-height: 100vh; max-height: 100vh; } .slider.slider-right .slider-content-wrapper { position: relative; width: 100%; box-sizing: border-box; padding: 0; margin: 0; background-image: url(images/slider-overlay.png); background-position: center center; background-size: 100% 100%; } .slider.slider-right .slider-image-wrapper { position: absolute; left: 0; width: 100%; margin: 0; } .slider .slider-image-wrapper, .slider .slider-content-wrapper { margin-top: 0; } .slider .slider-content-wrapper.slider-content-left .inside, .slider .slider-content-wrapper.slider-content-right .inside { padding-left: 20px; padding-right: 20px; } .slider .slider-content-wrapper .inside h1 { font-size: 2.5em; color: #fff !important; } .slider .slider-content-wrapper .inside p { font-size: 1.2em !important; color: #fff !important; line-height: 1.2; margin-bottom: 2em; } .slider .slider-content-wrapper .inside h1.small { font-size: 1.3em; } .slider .slider-content-wrapper .inside h2.large { font-size: 2.0em; } .slider .slider-content-wrapper .inside .button { font-size: .75em; } .slider .bjqs-controls { position: relative; width: 80%; padding: 0; top: 87% !important; left: 0 !important; margin-left: 10%; margin-right: 10%; } .slider .bjqs-controls li.bjqs-prev { position: absolute; left: 0; } .slider .bjqs-controls li.bjqs-next { position: absolute; right: 0; } .slider .bjqs-controls li a { opacity: 0.5; } .slider .bjqs-controls li a:hover { opacity: 1.0; } .slider ul.social-icons.blue li a { background-color: transparent; } .slider ul.social-icons.blue li a:hover { background-color: rgba(255,255,255,0.2); } .slider.slider-left .slider-content-wrapper, .slider.slider-right .slider-content-wrapper { left: 0; top: 50%; width: 100%; padding: .5em; height: 50%; display: flex; align-items: center; } .slider.slider-left .slider-content-wrapper .inside, .slider.slider-right .slider-content-wrapper .inside { padding-top: 0; padding-bottom: 0; height: auto; overflow: hidden; } .slider.slider-left .slider-content-wrapper .inside .highlight, .slider.slider-right .slider-content-wrapper .inside .highlight { border-left: none; padding-left: 0; margin-top: 0; line-height: 1.4; } .slider.slider-left .slider-content-wrapper img.logo, .slider.slider-right .slider-content-wrapper img.logo { max-width: 40%; margin-bottom: 0; } .slider.slider-left .slider-image-wrapper, .slider.slider-right .slider-image-wrapper { height: 50%; width: 100%; } .slider.slider-left.black .slider-content-wrapper, .slider.slider-right.black .slider-content-wrapper { background-color: #192b3c; } .button { display: inline-block; width: auto; font-size: 1em; hyphens: none; } .button.small { padding: 0.8em 1.5em; font-size: 1em; } .button + .button { margin-left: 0; margin-top: 10px; } h1.section-header, h2.section-header { padding-top: 0; padding-left: 0; padding-right: 0; margin-left: -0.6em; margin-top: -0.6em; text-align: center; } .inclcontent ol li { padding: 0 0 0 80px !important; min-height: 90px; } .inclcontent ol li::before { width: 70px; height: 70px; line-height: 70px; } .inclcontent .clmn, .blogcontent .clmn { padding: 0; margin: 0; } .inclcontent .clmn.col100, .inclcontent .clmn.col80, .inclcontent .clmn.col75, .inclcontent .clmn.col67, .inclcontent .clmn.col50, .inclcontent .clmn.col33, .inclcontent .clmn.col25, .blogcontent .clmn.col75, .blogcontent .clmn.col67, .blogcontent .clmn.col33, .blogcontent .clmn.col25, .teaser-item.clmn, .inclcontent .clmn.col20 { width: 100%; } .clmn+.clmn { margin-top: 1em; } .clmn.white, .clmn.grey, .clmn.lightgrey, .clmn.blue { padding: 1.5em; } .clmn.image-80percent img { width: 50% !important; height: auto; } .clmn.highlighted p { border-left-width: 2px; } .inclcontent h1, .inclcontent h2, .inclcontent h3 { hyphens: none; } .inclcontent h1 { font-size: 2.1em; margin-bottom: -0.4em; } .inclcontent h2 { font-size: 2.1em; line-height: 1.4; } .inclcontent h3 { font-size: 1.6em; } .inclcontent ol li { padding: 0 0 0 65px !important; min-height: 100px; } .teaser-box .teaserbox-content { padding: 2em; } .teaser-box .teaserbox-content .button { left: 4em; bottom: 4em; } .teaser-item { margin: 0; } .teaser-item h3 { margin-top: 0 !important; } .clmn.profile-image { padding: 0; padding-bottom: 1.5em; } .clmn.profile-image .clmn-content { float: left; } .clmn.profile-image .clmn-content * { float: left; } .clmn.profile-image .clmn-content h3 { margin-left: 1.5em; margin-top: 1.5em; margin-bottom: .5em; } .clmn.profile-image .clmn-content p { margin-left: 2em; display: block; width: 85%; font-size: 1em; margin-top: 0; } .clmn.profile-image .clmn-content p:first-of-type { margin-left: 0; width: 100%; } .clmn.profile-image .clmn-content img { position: relative; width: 100%; } .clmn.profile-image section.bloglist .inside { padding: 0 1.2em; } section.bloglist .inside .columns { width: 100%; margin-left: 0; } section.bloglist .inside .columns .col100 { width: 100%; } #blog-overview { margin-left: 0; padding-top: 0; } #blog-overview .clmn.col33.item { width: 100%; padding-left: 0; margin-left: 0; border-bottom: 2px dotted rgba(227,235,222,1); border-radius: 0; padding-bottom: 1.4em; } .blog-title { padding-top: 6em; } .blog-title .inside { padding: 0 1.2em; } #blog-overview .clmn.item { width: 100%; margin-left: 0; } #blog-overview .clmn.item h3 { font-size: 1.2em; text-align: left; margin: 0; } #blog-overview .clmn.item .text { padding: 1em; margin: 0; } #blog-overview .clmn.item .meta { font-size: .8em; margin-bottom: 1.5em; text-align: center; } #blog-overview .clmn.item .excerpt { font-size: 1em; line-height: 1.6; } #blog-overview .clmn.item .readmore .button { text-align: center; } section.blogcontent { margin-top: 2em; margin-bottom: 2em; } section.blogcontent h1 { font-size: 2em; } section.blogcontent h3 { margin-top: 0; } .blog-title .clmn.col50 { width: 100%; } .blog-title h1 { padding-bottom: 0; } body.blog ul.categories { margin-top: 0; text-align: left; } body.blog li.cat-item { } .blogcontent .col75 .wp-block-columns { display: block; } .blogcontent .col75 .wp-block-columns .wp-block-column { padding-left: 0; } .blogcontent .col75 .wp-block-columns .wp-block-column.has-background { padding-left: 2em; } .wp-block-column + .wp-block-column { margin-top: 2em; } .gallery .gallery-item { width: 33% !important; padding: 0px 10px !important; } .gallery br { display: none !important; } #bottom { font-size: 1em; } #bottom .inside { padding-left: 0; padding-right: 0; } #bottom .columns { padding-bottom: 0; } #bottom .clmn.col33, #bottom .clmn.col25 { width: 100%; box-sizing: border-box; padding: 0 40px; margin: 0 !important; } #bottom .clmn .footer-widget { } #bottom .clmn .footer-widget img { width: 100%; height: auto; margin: 0 auto; } #bottom .footer-widget h3 { font-size: 1em; text-align: left; } #bottom .footer-widget p { font-size: 1em; } #bottom .footer-widget ul li { text-align: left; } .clmn-content .arconix-faq-accordion-title.ui-accordion-header span.ui-icon { display: none !important; } .clmn-content .arconix-faq-accordion-content p { font-size: 16px; font-size: 1.6rem; } .clmn-content .ui-accordion .ui-accordion-header { padding: 1em !important; } .clmn-content .ui-accordion .ui-accordion-content { padding: 1em !important; } .clmn-content .arconix-faq-accordion-content ul li { font-size: .75em; } .clmn-content .wp-show-posts-inner .wp-show-posts-entry-summary { font-size: 1em; } .clmn-content .wp-show-posts-inner .wpsp-read-more a { font-size: 1em; } }