/*
Theme Name: Drohnenblick Hamburg
Theme URI: https://www.drohnenblick-hamburg.de/
Description: Template für Drohnenblick Hamburg
Author: hf-netsolution e.K.
Author URI: https://www.hf-netsolution.com
Version: 1.0.0
Text Domain: dbh
*/
/* 1. Hauptfarbe: rgba(61, 90, 128, 1); */
/* 1. Hauptfarbe: #3d5a80; */
/* 2. Sekundärfarbe: rgba(41, 50, 65, 1); */
/* 2. Sekundärfarbe: #293241; */
/* 3. Schriftfarbe: rgba(33, 37, 41, 1); */
/* 3. Schriftfarbe: #212529; */
/* 4. Hintergrund Grau: rgba(247, 248, 249, 1); */
/* 4. Hintergrund Grau: #f7f8f9; */
/* 5. Linkfarbe: rgba(238, 108, 77, 1); */
/* 5. Linkfarbe: #ee6c4d; */
/* ###################
## Farbvariablen ##
################### */
:root,
[data-bs-theme=light] {
--dbh-primary-color: #3d5a80;
--dbh-secondary-color: #293241;
--dbh-font-color: #343434;
--dbh-title-color: #3d5a80;
--dbh-footer-bg: #3d5a80;
--dbh-link-color: #ee6c4d;
--dbh-light-grey: #f7f8f9;
--dbh-white: #fff;
--dbh-white-bg: #fff;
--dbh-light-blue: #eef4fb;
--dbh-social-color: #fff;
--dbh-social-link: #3d5a80;
--dbh-social-hover: #ee6c4d;
--dbh-nav: #3d5a80;
--dbh-nav-hover: #ee6c4d;
--dbh-nav-trans: rgba(255, 255, 255, .9);
--dbh-nav-trans-hover: #ee6c4d;
--dbh-border-color: #e1e9eb;
--vp-color-brand: #c62828;
--vp-color-gray-darken: #343434;
}
[data-bs-theme=dark] { }
/* ############################
## Schriftart: Montserrat ##
############################ */
/* montserrat-regular - latin */
@font-face {
font-display: swap;
font-family: 'Montserrat';
font-style: normal;
font-weight: 400;
src: url('fonts/montserrat-v31-latin-regular.woff2') format('woff2'),
url('fonts/montserrat-v31-latin-regular.ttf') format('truetype');
}
/* montserrat-700 - latin */
@font-face {
font-display: swap;
font-family: 'Montserrat';
font-style: normal;
font-weight: 700;
src: url('fonts/montserrat-v31-latin-700.woff2') format('woff2'),
url('fonts/montserrat-v31-latin-700.ttf') format('truetype');
}
/* montserrat-900 - latin */
@font-face {
font-display: swap;
font-family: 'Montserrat';
font-style: normal;
font-weight: 900;
src: url('fonts/montserrat-v31-latin-900.woff2') format('woff2'),
url('fonts/montserrat-v31-latin-900.ttf') format('truetype');
}
/* ########################
## Schriftart: Roboto ##
######################## */
/* roboto-regular - latin */
@font-face {
font-display: swap;
font-family: 'Roboto';
font-style: normal;
font-weight: 400;
src: url('fonts/roboto-v50-latin-regular.woff2') format('woff2'),
url('fonts/roboto-v50-latin-regular.ttf') format('truetype');
}
/* roboto-700 - latin */
@font-face {
font-display: swap;
font-family: 'Roboto';
font-style: normal;
font-weight: 700;
src: url('fonts/roboto-v50-latin-700.woff2') format('woff2'),
url('fonts/roboto-v50-latin-700.ttf') format('truetype');
}
/* ################
## Typography ##
################ */
html, body { height: 100%; margin: 0; padding: 0; }
html { box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: 16px; }
body { background: #fff; }
@media (max-width: 991.98px) {
html { font-size: 15px; }
}
@media (max-width: 767.98px) {
html { font-size: 14px; }
}
body, button, input,
select, textarea { font-family: 'Roboto', Helvetica, Arial, sans-serif; font-weight: 400; font-size: 16px; line-height: 1.4666666667; color: var(--dbh-font-color); }
pre, code,
input, textarea { font: inherit; }
::-moz-selection { background: var(--dbh-secondary-color); color: #fff; }
::selection { background: var(--dbh-secondary-color); color: #fff; }
.site { background-color: var(--dbh-white-bg); position: relative; }
.home-white { background-color: var(--dbh-white-bg); padding-top: 80px; padding-bottom: 80px; }
.home-white img { border-radius: 30px; /* padding: 8px; background: var(--dbh-white-bg); border: 1px solid rgba(61, 90, 128, 0.15); */ }
.home-light-grey img { border-radius: 30px; /* padding: 8px; background: var(--dbh-white-bg); border: 1px solid rgba(61, 90, 128, 0.15); */ }
.home-light-grey { position: relative; background: #eef4fb; padding: 150px 0; overflow: hidden; }
.home-light-grey > * { position: relative; z-index: 2; }
.home-light-grey::before,
.home-light-grey::after {
content: "";
position: absolute;
left: 0;
width: 100%;
height: 105px;
background-size: 100% 100%;
background-repeat: no-repeat;
z-index: 1;
pointer-events: none;
}
/* obere Welle */
.home-light-grey::before {
top: 0;
background-image: url("data:image/svg+xml;utf8,\
");
transform: scaleY(-1);
}
/* untere Welle */
.home-light-grey::after {
bottom: 0;
background-image: url("data:image/svg+xml;utf8,\
");
}
/* ###########
## Links ##
########### */
a { color: var(--dbh-link-color); text-decoration: none; outline: none; font-weight: 400; }
a:hover { text-decoration: none; color: var(--dbh-primary-color); text-decoration: none; }
a:active, a:focus,
a:hover { outline: none; }
.contact-text a { color: var(--dbh-white); }
.contact-text a:active,
.contact-text a:focus,
.contact-text a:hover { color: var(--dbh-white); }
/* ###################
## Überschriften ##
################### */
h1, h2, h3,
h4, h5, h6 { clear: both; font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-weight: 400; margin-bottom: 15px; margin-bottom: 0.9375rem; margin-top: 0; color: var(--dbh-title-color); }
h1 a, h2 a, h3 a,
h4 a, h5 a, h6 a { color: var(--dbh-title-color); text-decoration: none; }
h1 { font-size: 34px; line-height: 1.2; font-weight: 700; text-transform: uppercase; }
h2 { font-size: 26px; line-height: 38px; font-weight: 700; margin-top: 20px; text-transform: uppercase; }
h3 { font-size: 22px; line-height: 28px; font-weight: 700; }
h4 { font-size: 17px; font-size: 1.0625rem; margin-bottom: 12px; }
h5 { text-transform: uppercase; font-size: 15px; font-size: 1.1rem; font-weight: 700; }
h6 { font-weight: 700; text-transform: uppercase; font-size: 12px; font-size: 0.75rem; letter-spacing: 1px; }
/* #############
## Content ##
############# */
ul, ol, dl, p, details, address, .vcard, figure, pre, fieldset, table, dt, dd, hr {
margin-bottom: 15px;
margin-bottom: 0.9375rem;
margin-top: 0;
}
img {
height: auto;
max-width: 100%;
vertical-align: middle;
}
b,
strong {
font-weight: bold;
}
blockquote {
clear: both;
margin: 20px 0;
}
blockquote p {
font-style: italic;
}
blockquote cite {
font-style: normal;
margin-bottom: 20px;
font-size: 13px;
}
dfn,
cite,
em,
i {
font-style: italic;
}
figure {
margin: 0;
}
address {
margin: 20px 0;
}
hr {
border: 0;
border-top: 1px solid #e9e9e9;
height: 1px;
margin-bottom: 20px;
}
tt,
kbd,
pre,
code,
samp,
var {
font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
background-color: #e9e9e9;
padding: 5px 7px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
}
pre {
overflow: auto;
white-space: pre-wrap;
max-width: 100%;
line-height: 1.7;
margin: 20px 0;
padding: 20px;
}
details summary {
font-weight: bold;
margin-bottom: 20px;
}
details :focus {
outline: none;
}
abbr,
acronym,
dfn {
cursor: help;
font-size: 0.95em;
text-transform: uppercase;
border-bottom: 1px dotted #e9e9e9;
letter-spacing: 1px;
}
mark {
background-color: #fff9c0;
text-decoration: none;
}
small {
font-size: 82%;
}
big {
font-size: 125%;
}
ul, ol {
padding-left: 20px;
}
ul {
list-style: square;
}
ol {
list-style: decimal;
}
ul li, ol li {
margin: 8px 0;
}
dt {
font-weight: bold;
}
dd {
margin: 0 20px 20px;
}
/* Individuelle Listen */
.front-page ul { list-style: none; padding-left: 0; }
.front-page ul li { position: relative; padding-left: 28px; margin: 8px 0; }
.front-page ul li::before { content: "\f105"; font-family: "Font Awesome 7 Free"; font-weight: 900; position: absolute; left: 10px; top: 0; color: var(--dbh-primary-color); }
.front-page ol { padding-left: 20px; list-style: decimal; }
.front-page ol li { margin: 8px 0; }
/* ###########
## Table ##
########### */
table {
width: 100%;
margin-bottom: 20px;
border: 1px solid #e9e9e9;
border-collapse: collapse;
border-spacing: 0;
}
table > thead > tr > th,
table > tbody > tr > th,
table > tfoot > tr > th,
table > thead > tr > td,
table > tbody > tr > td,
table > tfoot > tr > td {
border: 1px solid #e9e9e9 !important;
line-height: 1.42857;
padding: 5px;
vertical-align: middle;
}
table > thead > tr > th, table > thead > tr > td {
border-bottom-width: 2px;
}
table th {
font-size: 14px;
letter-spacing: 2px;
text-transform: uppercase;
}
/* ###################
## Accessibility ##
################### */
.screen-reader-text { clip: rect(1px, 1px, 1px, 1px); position: absolute !important; }
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
background-color: #f8f9f9;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
clip: auto !important;
color: var(--dbh-primary-color);
display: block;
height: auto;
left: 5px;
line-height: normal;
padding: 17px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000; /* Above WP toolbar */
}
/* ################
## Alignments ##
################ */
.alignleft { display: inline; float: left; margin-right: 3.5em; }
.alignright { display: inline; float: right; margin-left: 3.5em; }
.aligncenter { clear: both; display: block; margin-left: auto; margin-right: auto; }
/* ###############
## Clearings ##
############### */
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
content: "";
display: table;
clear: both;
}
.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
clear: both;
}
/* ############
## Helper ##
############ */
.hide { display: none; }
.clearleft { clear: left; }
.break, h1,
h2,
h3,
h4,
h5,
h6, p, ul, ol, dl, blockquote, pre {
word-break: break-word;
word-wrap: break-word;
}
/* ################
## Pageloader ##
################ */
.site-wrapper {
-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
-moz-animation: fadein 2s; /* Firefox < 16 */
-ms-animation: fadein 2s; /* Internet Explorer */
-o-animation: fadein 2s; /* Opera < 12.1 */
animation: fadein 2s;
}
@keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
from { opacity: 0; }
to { opacity: 1; }
}
/* ############
## Layout ##
############ */
/* header - Hinweise */
.header-top { position: relative; background-color: var(--dbh-primary-color); color: #fff; padding: 4px 0; line-height: 30px; border-bottom: 4px var(--dbh-link-color) solid; }
.header-top p { margin-bottom: 0; margin: 0 5px 0px 5px; }
.header-top a { font-family: 'Montserrat', Helvetica, Arial, sans-serif border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin: 0; padding: 5px 20px; font-size: 16px; font-weight: 600; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.header-top a:focus { background-color: var(--dbh-primary-color) !important; border-color: var(--dbh-primary-color) !important; color: #fff; box-shadow: none !important; }
.header-top a:active { background-color: var(--dbh-primary-color) !important; border-color: var(--dbh-primary-color) !important; color: #fff; box-shadow: none !important; }
.header-top a:hover { background-color: var(--dbh-secondary-color); border-color: var(--dbh-secondary-color); color: #fff; }
/* Pages */
.site-page { padding: 0 0 60px 0; min-height: 600px; }
.site-page h1 { padding-top: 60px; }
.site-page ul { list-style: none; padding-left: 0; }
.site-page ul li { position: relative; padding-left: 28px; margin: 8px 0; }
.site-page ul li::before { content: "\f105"; font-family: "Font Awesome 7 Free"; font-weight: 900; position: absolute; left: 10px; top: 0; color: var(--dbh-primary-color); }
.site-page ol { padding-left: 20px; list-style: decimal; }
.site-page ol li { margin: 8px 0; }
/* Frontpage */
.front-page { overflow-x: hidden; }
/* Verlinkte WordPress-Bilder mit Hover-Zoom und runden Ecken */
.wp-block-image figure,
.wp-block-image a {
overflow: hidden;
border-radius: 30px;
}
.wp-block-image a {
display: block;
}
.wp-block-image img {
display: block;
width: 100%;
height: auto;
border-radius: 30px;
transition: transform 0.4s ease, filter 0.4s ease;
}
.wp-block-image a:hover img {
transform: scale(1.08);
filter: brightness(0.82);
}
/* ############
## Header ##
############ */
.site-header { line-height: 75px; position: relative; width: 100%; -webkit-transition: all .3s ease-out; transition: all .3s ease-out; background: rgba(255, 255, 255, 1); z-index: 1000; box-shadow: 0 5px 10px 0 rgba(50, 50, 50, 0.06); }
.is-transparent .site-header.no-scroll { line-height: 75px; }
.site-header.header-fixed { top: 0; left: 0; position: fixed; }
.site-header .custom-logo-transparent { display: none; }
.followWrap { display: block; }
.is-transparent .followWrap {
z-index: 99;
width: 100%;
background: transparent;
position: absolute;
top: 0px;
display: block;
}
.is-transparent .site-header {
background: transparent;
position: fixed;
top: 0px;
}
.is-transparent .site-header.no-sticky {
position: absolute;
top: auto;
}
.is-transparent .site-header.no-scroll {
box-shadow: none;
}
.is-transparent .site-header.no-scroll .has-t-logo .custom-logo-transparent {
display: inline-block;
}
.is-transparent .site-header.no-scroll .has-t-logo .custom-logo {
display: none;
}
.is-transparent .site-header.no-scroll #nav-toggle span {
background-color: #fff;
}
.is-transparent .site-header.no-scroll #nav-toggle span::before, .is-transparent .site-header.no-scroll #nav-toggle span::after {
background-color: #fff;
}
.is-transparent .site-header.no-scroll #nav-toggle.nav-is-visible span {
background-color: transparent;
}
.is-transparent .site-header.header-fixed {
background: #fff;
}
.is-transparent .site-header.header-fixed.no-scroll {
background: transparent;
box-shadow: none;
}
/* Logo */
.site-logo-div img.custom-logo-transparent { width: 294px; height: 50px; }
.site-logo-div img.custom-logo { width: 294px; height: 50px; }
@media screen and (min-width: 992px) {
.is-transparent .no-scroll.site-header .nav-menu > li > a {
color: var(--dbh-nav-trans);
}
.is-transparent .no-scroll.site-header .nav-menu > li > a:hover {
color: var(--dbh-nav-trans-hover);
}
.is-transparent .no-scroll.site-header .nav-menu li.current-menu-item > a {
color: var(--dbh-nav-trans-hover);
}
.is-transparent .no-scroll.site-header .nav-menu li.current-menu-item > a:hover {
color: var(--dbh-nav-trans);
}
}
.site-branding { float: left; }
.site-branding .site-title,
.site-branding .site-text-logo { margin: 0; line-height: 1; font-family: 'Montserrat', Helvetica, Arial, sans-serif; font-size: 23px; letter-spacing: 1px; text-transform: uppercase; color: #000; display: initial; vertical-align: middle; font-weight: 600; }
.site-branding .site-title:hover,
.site-branding .site-text-logo:hover { text-decoration: none; }
.site-branding .site-title { display: inline-block; }
.site-branding .site-image-logo { display: block; }
.site-branding .site-logo-div { line-height: 75px; }
.site-branding .no-logo-img.has-desc,
.site-branding .has-logo-img { line-height: 60px; }
.site-branding .no-logo-img.has-desc .site-title,
.site-branding .has-logo-img .site-title { margin-top: -5px; position: relative; }
.site-branding .no-logo-img.has-desc .site-description,
.site-branding .has-logo-img .site-description { font-size: 12px; line-height: 14px; margin-bottom: 0; position: relative; top: -15px; color: #000; }
.home.header-transparent .no-scroll .site-brand-inner,
.home.header-transparent .no-scroll .site-text-logo { color: #fff; }
/* ################
## Navigation ##
################ */
.nav-menu,
.nav-menu * { margin: 0; padding: 0; list-style: none; }
.nav-menu { float: right; }
.nav-menu ul { position: absolute; display: block; height: 0; overflow: hidden; opacity: 0; z-index: -1; top: 100%; left: 0; }
.nav-menu ul.sub-ul-r { left: auto; right: 0px; }
.nav-menu ul ul { top: 0; left: 100%; }
.nav-menu li { position: relative; }
.nav-menu > li { float: left; }
.nav-menu li:hover > ul { display: block; height: initial; overflow: initial; opacity: 1; z-index: 99; }
.nav-menu a { display: block; position: relative; }
.nav-menu ul { min-width: 12em; width: fit-content; max-width: 100vw; border: 1px solid #e1e9eb; border-top: none; }
.nav-menu li { white-space: nowrap; *white-space: normal; -webkit-transition: background 0.2s; transition: background 0.2s; }
.nav-menu li:hover { -webkit-transition: none; transition: none; }
.nav-menu a { color: var(--dbh-font-color); font-family: 'Montserrat', Helvetica, Arial, sans-serif; padding-left: 17px; padding-right: 17px; font-size: 17px; font-weight: 700; text-transform: none; text-decoration: none; letter-spacing: 0; white-space: nowrap; }
.nav-menu a:hover { color: var(--dbh-primary-color); }
.nav-menu ul li { line-height: 26px; width: fit-content; min-width: 100%; background-color: var(--dbh-white); }
.nav-menu ul li a { border-top: 1px solid #e1e9eb; padding: 8px 18px; color: var(--dbh-font-color); font-size: 15px; font-weight: 400; text-transform: none; letter-spacing: 0; background-color: #fff; }
.nav-menu ul li a:hover { color: var(--dbh-white); background-color: var(--dbh-nav); }
.nav-menu li.current-menu-item > a { color: var(--dbh-nav-hover); }
.nav-menu li.current-menu-item > a:hover { color: var(--dbh-nav); }
.nav-menu li.current-menu-parent > a { color: var(--dbh-nav-hover); }
.nav-menu li.current-menu-parent > a:hover { color: var(--dbh-nav); }
.nav-menu ul li.current-menu-item > a { color: var(--dbh-nav-hover); }
.nav-menu ul li.current-menu-item > a:hover { color: var(--dbh-white); }
.nav-menu > li:last-child > a { padding-right: 0px; }
.nav-menu > li a.menu-actived { color: var(--dbh-nav-hover); }
.nav-menu .nav-toggle-subarrow { display: none; }
@media (max-width: 1399.98px) {
.nav-menu a { font-size: 15px; padding-left: 8px; padding-right: 8px; }
}
@media (max-width: 1199.98px) {
.nav-menu a { font-size: 15px; padding-left: 6px; padding-right: 6px; }
}
/* Mobil */
#nav-toggle { display: none; margin-left: 15px; }
@media screen and (max-width: 991.98px) {
.main-navigation { position: static; }
.main-navigation .nav-menu { width: 40%; display: block; height: 0; overflow: hidden; background: transparent; }
.nav-menu.nav-menu-mobile { position: absolute; right: 0; top: 75px; z-index: 800; overflow: auto !important; border-top: 1px solid #e1e9eb; border-bottom: 0; }
.is-transparent .site-header.no-scroll .nav-menu.nav-menu-mobile { top: 105px; }
.nav-menu li.menu-item > a:before { display: none; }
.nav-menu li.menu-item > a:hover:before { display: none; }
.nav-menu ul li.menu-item > a:hover:before { display: none; }
.nav-menu li.current-menu-item > a:before { display: none; }
.nav-menu li.current-menu-item > a:hover:before { display: none; }
.nav-menu ul li.current-menu-item > a:hover:before { display: none; }
.nav-menu.nav-menu-mobile .sub-menu { width: auto; }
.nav-menu.nav-menu-mobile > li > a { padding: 12px 20px; }
.nav-menu.nav-menu-mobile > li > a:hover { color: var(--dbh-white); }
.nav-menu.nav-menu-mobile > li > a:focus { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile > li > a:active { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile li:hover ul { display: none; }
.nav-menu.nav-menu-mobile ul { box-shadow: none; padding-bottom: 0; border: none; position: relative; }
.nav-menu.nav-menu-mobile ul li:last-child { border-bottom: 0; }
.nav-menu.nav-menu-mobile ul li { border-left: 0; }
.nav-menu.nav-menu-mobile ul li a { padding: 12px 35px; border-top: none; white-space: pre-line; }
.nav-menu.nav-menu-mobile ul li a:hover { background: var(--dbh-primary-color); }
.nav-menu.nav-menu-mobile ul li a:focus { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile ul li a:active { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile ul li li a { padding: 12px 70px; border-top: none; }
.nav-menu.nav-menu-mobile ul li li li a { padding: 12px 105px; }
.nav-menu.nav-menu-mobile ul ul { left: 0; }
.nav-menu.nav-menu-mobile li { line-height: 1.4666666667; background: var(--dbh-white); border-left: 1px solid #e1e9eb; border-top: 1px solid #e1e9eb; width: 100% !important; }
.nav-menu.nav-menu-mobile > li:first-child { border-top: 0 none; }
.nav-menu.nav-menu-mobile li.nav-current-item > a { color: var(--dbh-primary-color); }
.nav-menu.nav-menu-mobile a { color: var(--dbh-primary-color); }
.nav-menu.nav-menu-mobile a:focus { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile a:active { color: var(--dbh-nav-hover); background-color: var(--dbh-white); }
.nav-menu.nav-menu-mobile a:hover { color: var(--dbh-white); background-color: var(--dbh-primary-color); }
.nav-menu.nav-menu-mobile .nav-toggle-subarrow { display: block; line-height: 1.4666666667; border-left: 1px solid #e1e9eb; font-weight: normal; position: absolute; top: 0; right: 0; cursor: pointer; text-align: center; padding: 8px 20px 6px 20px; z-index: 10; font-size: 22px; color: var(--dbh-primary-color); }
.nav-menu.nav-menu-mobile .nav-toggle-subarrow:hover { background-color: var(--dbh-primary-color); color: var(--dbh-white); }
/* Pfeil im Mobil-Menü */
.nav-item:hover > .nav-toggle-subarrow,
.nav-item:hover > .nav-toggle-subarrow i {
background-color: var(--dbh-primary-color);
color: var(--dbh-white) !important;
}
.nav-menu.nav-menu-mobile .nav-toggle-dropdown > ul { left: 0; display: block !important; height: initial; overflow: initial; opacity: 1; z-index: inherit; }
#nav-toggle { display: block; }
.nav-menu.nav-menu-mobile .nav-toggle-dropdown > .nav-toggle-subarrow .fa-angle-down:before { content: "\f106" !important; }
.nav-menu.nav-menu-mobile li:last-child { border-bottom: 1px solid #e1e9eb; }
}
#nav-toggle { float: right; position: relative; width: 35px; overflow: hidden; white-space: nowrap; color: transparent; }
#nav-toggle span { position: absolute; top: 50%; right: 5px; margin-top: -2px; -webkit-transition: rotate 0.2s, translate 0.2s; -moz-transition: rotate 0.2s, translate 0.2s; transition: rotate 0.2s, translate 0.2s; display: inline-block; height: 3px; width: 24px; background: var(--dbh-primary-color); }
#nav-toggle span:before { top: -8px; }
#nav-toggle span:after { top: 8px; }
#nav-toggle span:before,
#nav-toggle span:after { position: absolute; display: inline-block; height: 3px; width: 24px; background: var(--dbh-primary-color); content: ""; right: 0; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-origin: 0% 50%; -moz-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; transform-origin: 0% 50%; -webkit-transition: -webkit-transform 0.2s; -moz-transition: -moz-transform 0.2s; transition: transform 0.2s; }
#nav-toggle.nav-is-visible span { background: transparent; }
#nav-toggle.nav-is-visible span:before {
-webkit-transform: translateX(4px) translateY(-1px) rotate(45deg);
-moz-transform: translateX(4px) translateY(-1px) rotate(45deg);
-ms-transform: translateX(4px) translateY(-1px) rotate(45deg);
-o-transform: translateX(4px) translateY(-1px) rotate(45deg);
transform: translateX(4px) translateY(-1px) rotate(45deg);
}
#nav-toggle.nav-is-visible span:after {
-webkit-transform: translateX(4px) translateY(0px) rotate(-45deg);
-moz-transform: translateX(4px) translateY(0px) rotate(-45deg);
-ms-transform: translateX(4px) translateY(0px) rotate(-45deg);
-o-transform: translateX(4px) translateY(0px) rotate(-45deg);
transform: translateX(4px) translateY(0px) rotate(-45deg);
}
#nav-toggle.nav-is-visible span:before, #nav-toggle.nav-is-visible span:after {
background: var(--dbh-primary-color);
}
/* Pfeil nach unten: In der Navigationsleiste ausblenden */
.nav-menu.nav-menu-mobile .dropdown-toggle::after { margin-left: 0; border-top: 0.3em solid transparent; }
/* #################
## Animationen ##
################# */
@-webkit-keyframes fadeInDownSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInDownSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -20px, 0);
-ms-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInDownSmall {
-webkit-animation-name: fadeInDownSmall;
animation-name: fadeInDownSmall;
}
@-webkit-keyframes fadeInLeftSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeftSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(-20px, 0, 0);
-ms-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInLeftSmall {
-webkit-animation-name: fadeInLeftSmall;
animation-name: fadeInLeftSmall;
}
@-webkit-keyframes fadeInRightSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRightSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(20px, 0, 0);
-ms-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInRightSmall {
-webkit-animation-name: fadeInRightSmall;
animation-name: fadeInRightSmall;
}
@-webkit-keyframes fadeInUpSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUpSmall {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 20px, 0);
-ms-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
}
.fadeInUpSmall {
-webkit-animation-name: fadeInUpSmall;
animation-name: fadeInUpSmall;
}
/* ###########
## Suche ##
########### */
/* Lupe rechts anordnen */
.header-dropdown-buttons { float: right; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.header-dropdown-buttons i { font-size: 18px; padding-left: 12px; color: var(--dbh-font-color); }
.header-dropdown-buttons i:hover { color: var(--dbh-nav-hover); }
.is-transparent .header-dropdown-buttons i { color: var(--dbh-font-color); }
.is-transparent .header-dropdown-buttons i:hover { color: var(--dbh-nav-hover); }
.is-transparent .no-scroll .header-dropdown-buttons i { color: #fff; }
.is-transparent .no-scroll .header-dropdown-buttons i:hover { color: var(--dbh-nav-hover); }
/* Pfeil nach Symbol verstecken */
.header-dropdown-buttons .dropdown-toggle::after { display: none; }
/* Animation */
.header-dropdown-buttons .dropdown-toggle + ul.dropdown-menu { -webkit-animation-duration: 0.3s; animation-duration: 0.3s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUpSmall; animation-name: fadeInUpSmall;}
/* Bei klick Position festlegen */
.header-dropdown-buttons ul.dropdown-menu.dropdown-menu-right.show { position: absolute !important; top: 100% !important; right: 0 !important; left: auto !important; margin-top: 18px !important; }
/* Button: Lupe Anpassungen */
.header-dropdown-buttons .btn:focus { box-shadow: none; }
.header-dropdown-buttons button:focus { outline: 0; }
.header-dropdown-buttons .btn.dropdown-toggle { /* padding: 36px 0 2px 0; */ border: 0; }
/* Button: Schliessen */
.header-dropdown-buttons li.btn-close { position: absolute; top: 0; right: 0 !important; font-size: .8em; width: .6em; height: .6em; cursor: pointer; }
.header-dropdown-buttons button.close { position: absolute; top: 0; right: 10px; }
/* Suchfeld */
.header-dropdown-buttons ul li { margin: 0; }
.header-dropdown-buttons ul.dropdown-menu { margin: 5px 0 0 0; padding: 0; min-width: 300px; background-color: #fff; border: 1px solid var(--dbh-border-color); border-radius: 0; }
.header-dropdown-buttons ul.dropdown-menu li { float: right; padding: 20px 30px 0 0; }
.header-dropdown-buttons .search-box { padding: 0; margin: 0; }
.header-dropdown-buttons .btn-group .form-control { float: left; width: 200px; border-radius: 0; }
.header-dropdown-buttons .form-group { margin-top: 10px; margin-bottom: 25px; }
/* Suchfeld - Button */
.header-dropdown-buttons .search-box i { padding-left: 8px; }
.header-dropdown-buttons .btn-group .btn { float: left; }
.header-dropdown-buttons .search-box .btn i { color: #fff !important; }
.header-dropdown-buttons .search-box .btn { color: #fff; background-color: var(--dbh-link-color); border: 1px solid var(--dbh-link-color); border-radius: 0; padding-left: 0; }
.header-dropdown-buttons .search-box .btn:hover { background-color: var(--dbh-primary-color); border: 1px solid var(--dbh-primary-color); }
.header-dropdown-buttons .search-box .btn:focus,
.header-dropdown-buttons .search-box .btn:active { box-shadow: none !important; }
/* Suchfeld - Input */
.header-dropdown-buttons .search-box .form-control { font-family: 'Roboto', Helvetica, Arial, sans-serif; color: var(--dbh-font-color); border-color: var(--dbh-border-color); }
.header-dropdown-buttons .search-box .form-control:focus { outline: 0; border-color: var(--dbh-link-color); -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
/* Suchergebnisse */
.search-page { min-height: 600px; }
.search-results-grid .search-card { border-radius: 1rem; overflow: hidden; background: #fff; box-shadow: 0 8px 40px -5px rgba(0, 0, 0, 0.1); }
.search-card-image { display: block; overflow: hidden; }
.search-card .card-img-top { width: 100%; height: 280px; object-fit: cover; display: block; }
.dbh-searchimg { position: relative; overflow: hidden; border-radius: 30px 30px 0 0; }
.dbh-searchimg img { display: block; width: 100%; height: auto; transition: transform 0.4s ease, filter 0.4s ease; border-radius: 30px 30px 0 0; }
.dbh-searchimg img:hover { transform: scale(1.08); filter: brightness(0.82); border-radius: 30px 30px 0 0; }
.dbh-searchdate { position: absolute; top: 0; right: 0; background-color: var(--dbh-primary-color); color: #fff; padding: 10px 20px 10px 20px; font-size: 12px; border-radius: 0 30px 0 30px; }
.dbh-searchinfo { position: absolute; bottom: 0; left: 0; background-color: var(--dbh-primary-color); color: #fff; padding: 10px 20px 10px 10px; font-size: 12px; border-radius: 0 30px 0 0; }
.dbh-searchinfo i { color: var(--dbh-light-grey); }
.dbh-searchinfo i { margin-right: 6px; }
.search-card .dbh-searchinfo a { color: var(--dbh-white);}
.search-card .dbh-searchinfo a:focus,
.search-card .dbh-searchinfo a:active { color: var(--dbh-white);}
.search-card .dbh-searchinfo a:hover { color: var(--dbh-white); text-decoration: underline; }
.search-card h2 { margin-top: 12px; line-height: 32px !important; color: var(--dbh-primary-color) !important; }
.search-card .card-body h2 { margin-top: 12px; line-height: 32px !important; color: var(--dbh-primary-color) !important; }
.search-card .card-body h2 a { color: var(--dbh-primary-color); font-size: 24px; font-weight: 600; text-transform: none; text-decoration: none; outline: 0px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.search-card .card-body h2 a:focus,
.search-card .card-body h2 a:active { color: var(--dbh-primary-color); text-decoration: none; }
.search-card .card-body h2 a:hover { color: var(--dbh-link-color); text-decoration: none; }
.search-page .widget-area .btn { padding: 10px 40px; }
/* Suchwort */
.search-term { color: var(--dbh-link-color); }
/* Buttons */
.search-results-grid .wp-bootstrap-blocks-button a.btn.btn-primary { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.search-results-grid .wp-bootstrap-blocks-button a.btn.btn-primary:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.search-results-grid .wp-bootstrap-blocks-button a.btn.btn-primary:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.search-results-grid .wp-bootstrap-blocks-button a.btn.btn-primary:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
@media (max-width: 1399.98px) {
.header-dropdown-buttons i { font-size: 15px; padding-left: 0; }
}
@media (max-width: 991.98px) {
.header-dropdown-buttons i { font-size: 18px; padding-left: 12px; }
}
@media (max-width: 575.98px) {
.header-dropdown-buttons .btn.dropdown-toggle { padding: 0; }
}
/* ################################
## Wellen - Slider Revolution ##
################################ */
.slider-waves { position: absolute; left: 0; bottom: 0; width: 100%; height: 150px; }
.slider-waves { position: absolute; left: 0; bottom: 0; width: 100%; height: 150px; }
.slider-waves--slider { transform: none; }
.slider-waves svg { position: absolute; left: 0; width: 100%; height: 100%; display: block; }
.slider-wave-1 { bottom: -10px; }
.slider-waves svg:nth-child(1) path {
fill: #ffffff;
}
.slider-waves svg:nth-child(2) path {
fill: #ffffff;
opacity: 0.4;
}
/* #####################
## Wellen - Seiten ##
##################### */
.header-hero {
position: relative;
width: 100%;
height: clamp(180px, 32vw, 360px);
overflow: hidden;
}
.header-hero picture,
.header-hero .header-img-size {
display: block;
width: 100%;
height: 100%;
}
.header-hero .header-img-size {
object-fit: cover;
object-position: center;
}
.svg-intro-bottom,
.svg-intro-bottom-2 {
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 70px;
display: block;
pointer-events: none;
z-index: 2;
}
.svg-intro-bottom-2 {
height: 90px;
z-index: 1;
}
@media (max-width: 767.98px) {
.header-hero {
height: 220px;
}
.svg-intro-bottom {
height: 30% !important;
}
.svg-intro-bottom-2 {
height: 45% !important;
}
}
svg.svg-intro-bottom {
position: absolute;
bottom: -1px;
width: 100%;
height: 50%;
z-index: 666;
}
svg.svg-intro-bottom-2 {
position: absolute;
bottom: 0;
width: 100%;
height: 65%;
z-index: 555;
}
/* header - Titel */
.header-title { position: relative; }
.header-title h1 { position: absolute; bottom: 0; left: 0; font-weight: 400; font-size: 62px; line-height: 78px; letter-spacing: -2.17px; color: #fff; }
/* Eigene Formate */
.site-headline p { font-size: 24px; font-weight: 700; color: var(--dbh-title-color); }
/* ###############
## Accordion ##
############### */
/* Gesamter Accordion-Block */
.accordion-item { border-radius: 30px !important; overflow: hidden; margin-bottom: 12px; border: 1px solid #e1e9eb; }
/* Button oben */
.accordion-button { font-weight: 400; border-radius: 30px !important; }
/* Wenn geöffnet, obere Ecken rund lassen */
.accordion-button:not(.collapsed) { background-color: var(--dbh-primary-color); color: var(--dbh-white); border-radius: 30px 30px 0 0 !important; box-shadow: none; }
/* Standard-Pfeil deaktivieren */
.accordion-button::after { background-image: none !important; font-family: "Font Awesome 7 Free"; font-weight: 900; content: "\2b"; font-size: 12px; display: flex; align-items: center; justify-content: center; transform: none !important; width: auto; height: auto; }
/* Geöffnet */
.accordion-button:not(.collapsed)::after { content: "\f068"; }
/* #####################################
## Block: Projekte (Projektablauf) ##
##################################### */
.dbh-projects-section { overflow: hidden; padding-top: 120px; padding-bottom: 120px; margin: 40px 0 40px 0; }
.dbh-projects { position: relative; max-width: 1080px; margin: 0 auto; padding: 10px 0; }
.dbh-projects::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; transform: translateX(-50%); border-left: 2px dashed rgba(61, 90, 128, 0.18); }
.dbh-projects-step { position: relative; width: calc(50% - 34px); margin-bottom: 14px; }
.dbh-projects-step.left { margin-right: auto; }
.dbh-projects-step.right { margin-left: auto; }
.dbh-projects-step::after { content: ""; position: absolute; top: 42px; width: 16px; height: 16px; border-radius: 50%; background: var(--dbh-primary-color); border: 3px solid #eef4f8; box-shadow: 0 0 0 4px rgba(61, 90, 128, 0.10); z-index: 5; }
.dbh-projects-step.left::after { right: -42px; }
.dbh-projects-step.right::after { left: -42px; }
/* Verbindung zur Achse */
.dbh-projects-step::before { content: ""; position: absolute; top: 49px; width: 30px; height: 2px; background: rgba(61, 90, 128, 0.16); z-index: 1; }
.dbh-projects-step.left::before { right: -26px; }
.dbh-projects-step.right::before { left: -26px; }
/* Karte */
.dbh-projects-card { position: relative; z-index: 2; background: #fff; border-radius: 30px; padding: 26px 22px 22px; box-shadow: 0 14px 30px rgba(19, 34, 56, 0.07); min-height: 230px; display: flex; flex-direction: column; align-items: center; text-align: center; }
/* Icon mittig */
.dbh-projects-icon {
width: 100px;
height: 100px;
border-radius: 50%;
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 2rem;
margin: 0 auto 14px;
background: rgba(61, 90, 128, 0.10);
color: var(--dbh-primary-color);
border: 6px solid #fff;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
transition: background-color 0.35s ease, color 0.35s ease, transform 0.35s ease;
}
.dbh-projects-card:hover .dbh-projects-icon { transform: scale(1.08); }
.dbh-projects-icon i { line-height: 1; }
/* Typography */
.dbh-projects-card h3 { margin-bottom: 10px; }
.dbh-projects-card p { margin-bottom: 0; }
/* Mobil */
@media (max-width: 991.98px) {
.dbh-projects::before { left: 22px; transform: none; }
.dbh-projects-step,
.dbh-projects-step.left,
.dbh-projects-step.right {
width: 100%;
margin-left: 0;
margin-right: 0;
padding-left: 58px;
transform: none !important;
margin-bottom: 14px;
}
.dbh-projects-step::after,
.dbh-projects-step.left::after,
.dbh-projects-step.right::after {
left: 14px;
right: auto;
top: 38px;
}
.dbh-projects-step::before,
.dbh-projects-step.left::before,
.dbh-projects-step.right::before {
left: 30px;
right: auto;
width: 22px;
top: 45px;
}
.dbh-projects-card {
min-height: auto;
}
}
@media (max-width: 575.98px) {
.section-head h2 {
font-size: 1.55rem;
}
.dbh-projects-step,
.dbh-projects-step.left,
.dbh-projects-step.right {
padding-left: 50px;
margin-bottom: 12px;
}
.dbh-projects-step::after,
.dbh-projects-step.left::after,
.dbh-projects-step.right::after {
left: 16px;
width: 14px;
height: 14px;
}
.dbh-projects-step::before,
.dbh-projects-step.left::before,
.dbh-projects-step.right::before {
left: 30px;
width: 20px;
}
.dbh-projects-card {
padding: 20px 16px 18px;
}
.dbh-projects-icon {
width: 70px;
height: 70px;
font-size: 1.6rem;
margin-bottom: 12px;
}
.step-badge {
min-width: 82px;
height: 28px;
margin-bottom: 12px;
}
.dbh-projects-card p {
max-width: none;
}
}
/* #######################
## Block: Leistungen ##
####################### */
.services-cards { margin: 40px 0 40px 0; }
.service-card { position: relative; text-align: center; display: flex; flex-direction: column; height: 100%; }
.service-card__image-wrap { border-radius: 30px; overflow: hidden; flex-shrink: 0; }
.service-card__image { width: 100%; height: 100%; object-fit: cover; display: block; filter: brightness(0.92); transform: scale(1); transition: transform 0.45s ease, filter 0.45s ease; }
.service-card__content { position: relative; background: rgba(255, 255, 255, 0.96); margin: -100px auto 40px; width: calc(100% - 60px); padding: 68px 28px 34px; border-radius: 30px; box-shadow: 0 6px 22px rgba(0, 0, 0, 0.08); z-index: 2; flex: 1; display: flex; flex-direction: column; justify-content: flex-start; min-height: 360px; transition: box-shadow 0.35s ease, transform 0.35s ease; }
.service-card__icon { position: absolute; top: -30px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px; border-radius: 50%; background: var(--dbh-primary-color); border: 6px solid #fff; display: flex; align-items: center; justify-content: center; color: #fff; box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08); transition: background-color 0.35s ease, color 0.35s ease, transform 0.35s ease; }
.service-card__icon i { font-size: 26px; }
.service-card__title { margin-bottom: 18px; font-size: 2rem; font-weight: 700; line-height: 1.2; color: #314b67; }
.service-card__text { margin-bottom: 0; }
/* Hover */
.service-card:hover .service-card__image { transform: scale(1.08); filter: brightness(0.82); }
.service-card:hover .service-card__icon { background: var(--dbh-link-color); transform: translateX(-50%) scale(1.08); }
.service-card:hover .service-card__content { box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12); }
@media (max-width: 575.98px) {
.service-card__content {
width: calc(100% - 30px);
padding: 62px 20px 28px;
margin: -60px auto 40px;
}
.service-card__text {
font-size: 1rem;
line-height: 1.7;
}
}
/* ##########
## News ##
########## */
/* News Block */
.dbh-postimg { position: relative; overflow: hidden; border-radius: 30px; }
.dbh-postimg img { display: block; width: 100%; height: auto; transition: transform 0.4s ease, filter 0.4s ease; border-radius: 30px; }
.dbh-postimg img:hover { transform: scale(1.08); filter: brightness(0.82); border-radius: 30px; }
.dbh-news { /* margin-bottom: 40px; */ }
.dbh-news .card { border: 0; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
.dbh-news .card-body { /* padding: 0; */ }
.dbh-news .dbh-news-bg { -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: 0 8px 40px -5px rgba(0, 0, 0, 0.1); }
.dbh-news .dbh-news-content { padding: 0 15px 15px 15px; }
.dbh-news a { color: var(--dbh-font-color); font-weight: 700; text-decoration: none; }
.dbh-news h3 { margin-top: 1em; margin-bottom: 1em; }
.dbh-news h3 a { color: var(--dbh-title-color); text-decoration: none; }
.dbh-news a:hover { color: var(--dbh-nav-hover); text-decoration: none; }
.dbh-news a:focus,
.dbh-news a:active { color: var(--dbh-font-color); text-decoration: none; }
.dbh-dateinfo { padding-top: 15px; text-align: center; color: #bbc2ce; font-size: 14px; }
.dbh-dateinfo { position: absolute; top: 16px; right: 16px; background-color: var(--dbh-primary-color); color: #fff; padding: 8px; font-size: 12px; border-radius: 0 10px 0 10px; }
.dbh-news-btn { /* padding-left: 15px; */ }
.dbh-news-btn .btn { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin: 10px 0 30px 0 !important; padding: 10px 50px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.dbh-news-btn .btn-primary:focus { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.dbh-news-btn .btn-primary:active { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.dbh-news-btn .btn-primary:hover { background-color: var(--dbh-primary-color); color: #fff; text-decoration: none; }
/* #######################
## Slider Revolution ##
####################### */
.dbh-slider-box { border-radius: 30px !important; overflow: hidden !important; }
/* #############
## Buttons ##
############# */
.front-page .wp-bootstrap-blocks-button a.btn.btn-primary { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.front-page .wp-bootstrap-blocks-button a.btn.btn-primary:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.front-page .wp-bootstrap-blocks-button a.btn.btn-primary:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.front-page .wp-bootstrap-blocks-button a.btn.btn-primary:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
.site-page .wp-bootstrap-blocks-button a.btn.btn-primary { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.site-page .wp-bootstrap-blocks-button a.btn.btn-primary:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.site-page .wp-bootstrap-blocks-button a.btn.btn-primary:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.site-page .wp-bootstrap-blocks-button a.btn.btn-primary:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
.site-footer .wp-bootstrap-blocks-button a.btn.btn-primary { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.site-footer .wp-bootstrap-blocks-button a.btn.btn-primary:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.site-footer .wp-bootstrap-blocks-button a.btn.btn-primary:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.site-footer .wp-bootstrap-blocks-button a.btn.btn-primary:hover { background-color: var(--dbh-secondary-color); border-color: var(--dbh-secondary-color); color: #fff; }
/* Visual Portfolio */
.vp-filter__style-default .vp-filter__item>* { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); padding: 8px 30px; font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.vp-filter__style-default .vp-filter__item > a:focus,
.vp-filter__style-default .vp-filter__item > a:hover { background-color: var(--dbh-primary-color); color: var(--dbh-white); }
.vp-filter__style-default .vp-filter__item.vp-filter__item-active>* { background-color: var(--dbh-primary-color); }
.vp-pagination__style-default .vp-pagination__item>* { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; padding: 8px 30px; font-size: 16px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
/* Borlab Cookie */
.site-page button.brlbs-cmpnt-btn-preferences { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin: 0; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.site-page button.brlbs-cmpnt-btn-preferences:focus { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin: 0; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.site-page button.brlbs-cmpnt-btn-preferences:active { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: var(--dbh-white); margin: 0; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.site-page button.brlbs-cmpnt-btn-preferences:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
/* Visual Portfolio - Popup: Untertitel anspassen */
h3.vp-portfolio__item-popup-title { font-weight: 400; font-size: 16px; line-height: 1.4666666667; }
/* #####################
## Blog - Beiträge ##
##################### */
.main-container { padding: 40px 0 0 0; }
.main-container ul li::marker { color: var(--dbh-primary-color); }
.blog-separator { width: 100%; margin-bottom: 15px; position: relative; height: 1px; }
.blog-separator:after { height: 1px; background: #d1d1d1; background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 0, 0, 0.18)), color-stop(35%, rgba(0, 0, 0, 0.12)), color-stop(70%, rgba(0, 0, 0, 0.05)), color-stop(100%, transparent)); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); position: absolute; bottom: -1px; left: 0px; content: ""; width: 100%; }
.blog-separator-single { width: 100%; margin-bottom: 5px; position: relative; height: 1px; }
.blog-separator-single:after { height: 1px; background: #d1d1d1; background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(0, 0, 0, 0.18)), color-stop(35%, rgba(0, 0, 0, 0.12)), color-stop(70%, rgba(0, 0, 0, 0.05)), color-stop(100%, transparent)); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); background: linear-gradient(to right, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.12) 35%, rgba(0, 0, 0, 0.05) 70%, transparent 100%); position: absolute; bottom: -1px; left: 0px; content: ""; width: 100%; }
.post-date a, .post-date span { color: #798992; font-size: 11px; margin-right: 5px; }
.post-date a > i,.post-date span > i { margin-right: 5px; }
/* Blog */
.blogpost { margin: 0 0 70px; padding: 15px; border-radius: 30px; box-shadow: 0 8px 40px -5px rgba(0, 0, 0, 0.1); }
.blogpost h3 { font-weight: 700; color: var(--dbh-font-color); }
.blogpost header { padding: 20px 0 20px 0; }
.blogpost header h2 { font-size: 22px; text-transform: none; margin: 0; }
.blogpost .post-info { font-size: 11px; color: #aeafb1; font-weight: 400; padding-bottom: 5px; }
.blogpost .post-info > span { margin-right: 5px; display: inline-block; }
.blogpost .post-info a { color: #aeafb1; }
.blogpost .row .blogpost-content { padding-bottom: 0; }
.blogpost footer { font-size: 38px; padding: 10px; color: var(--dbh-primary-color); }
.blogpost .row + footer { padding: 10px 0; }
.blogpost.full { margin-bottom: 30px; }
.blogpost.full header { padding: 0 0 15px 0; }
.blogpost.full .blogpost-content { padding: 0 0 5px; }
.blogpost.full footer { padding: 10px 0; }
/* Frontpage */
.news-content h1.wp-block-heading { position: relative; display: table; }
.news-content h1 { padding-top: 40px; }
.news-content h1 { text-align: center !important; font-size: 34px; font-weight: 700; position: relative; display: inline-block; margin: 20px auto 40px auto; }
.news-content h1 strong { font-weight: 700; }
.dbh-postcontent { padding: 15px; /* border-left: 1px solid #e9ecef; border-right: 1px solid #e9ecef; border-bottom: 1px solid #e9ecef; */ }
.dbh-postcontent h2 { margin-top: 12px; line-height: 32px !important; color: var(--dbh-primary-color) !important; }
.dbh-postcontent h2 a { color: var(--dbh-primary-color); font-size: 28px; font-weight: 600; text-transform: none; text-decoration: none; outline: 0px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.dbh-postcontent h2 a:focus,
.dbh-postcontent h2 a:active { color: var(--dbh-primary-color); text-decoration: none; }
.dbh-postcontent h2 a:hover { color: var(--dbh-link-color); text-decoration: none; }
.site-wrapper .dbh-light-blue { background-color: var(--dbh-light-blue); }
.dbh-dateinfo { position: absolute; top: 0; right: 0; background-color: var(--dbh-primary-color); color: #fff; padding: 10px 20px 10px 20px; font-size: 12px; border-radius: 0 30px 0 30px; }
.dbh-posted-author { display: inline-flex; align-items: center; white-space: nowrap; }
.dbh-posted-author i { font-size: 10px; }
.dbh-postinfo { position: absolute; bottom: 0; left: 0; white-space: nowrap; background-color: var(--dbh-primary-color); color: #fff; padding: 10px 20px 10px 20px; font-size: 12px; border-radius: 0 30px 0 30px; }
.dbh-postinfo i { color: var(--dbh-light-grey); margin-right: 4px; }
.dbh-postinfo a { color: var(--dbh-white);}
.dbh-postinfo a:focus,
.dbh-postinfo a:active { color: var(--dbh-white);}
.dbh-postinfo a:hover { color: var(--dbh-white); text-decoration: underline; }
.dbh-postfooter { padding: 0; text-transform: none; font-size: 14px; }
/* Kategorien & Schlagwörter */
.dbh-post-meta { margin: 20px 0; }
.dbh-post-categories,
.dbh-post-tags {
display: flex;
flex-wrap: wrap;
gap: 10px;
}
.dbh-cat-link,
.dbh-tag-link {
display: inline-block;
padding: 6px 14px;
border-radius: 30px;
text-decoration: none;
transition: all 0.2s ease;
}
.dbh-cat-link { background: #2f537f; color: #fff; }
.dbh-cat-link:hover { background: #1f3b64; color: #fff; }
.dbh-tag-link { background: #f2f4f7; color: #2f537f; }
.dbh-tag-link:hover { background: #dfe7f1; color: #1f3b64; }
/* Beitragsnavigation */
ul.pagination, ul.pager { display: table; margin: 30px auto 30px auto; }
ul.pagination .page-item { padding: 0; margin: 0 10px 0 0; border-bottom: none; display: inline-block; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; }
ul.pagination .page-item:last-child { margin: 0; }
ul.pagination .page-item .page-link,
.pagination .page-item:first-child .page-link,
.pagination .page-item:last-child .page-link,
ul.pager .page-item .page-link { text-align: center; padding: 0; height: 40px; width: 40px; border: 2px solid var(--dbh-link-color); line-height: 36px; background-color: var(--dbh-link-color); color: #fff; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; }
ul.pagination .page-item .page-link:hover,
ul.pagination .page-item .page-link:focus { background-color: var(--dbh-primary-color); border: 2px solid var(--dbh-primary-color); color: #fff; }
ul.pagination .page-item.active .page-link,
.page-item.active .page-link:hover,
.page-item.active .page-link:focus { background-color: var(--dbh-primary-color); border: 2px solid var(--dbh-primary-color); color: #fff; }
ul.pagination .page-link i { font-size: 14px; }
ul.pagination .page-link:focus { box-shadow: none; }
ul.pagination a:hover { text-decoration: none; }
/* Back to Blog - Button */
.news-back-button .btn { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin: 40px 0 40px 0; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.news-back-button .btn-primary:focus { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.news-back-button .btn-primary:active { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.news-back-button .btn-primary:hover { background-color: var(--dbh-primary-color); color: #fff; text-decoration: none; }
.main-container .btn { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.main-container .btn-primary:focus { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.main-container .btn-primary:active { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.main-container .btn-primary:hover { background-color: var(--dbh-primary-color); color: #fff; text-decoration: none; }
.dbh-postfooter .wp-bootstrap-blocks-button .btn { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.dbh-postfooter .wp-bootstrap-blocks-button .btn-primary:focus { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.dbh-postfooter .wp-bootstrap-blocks-button .btn-primary:active { background-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; text-decoration: none; }
.dbh-postfooter .wp-bootstrap-blocks-button .btn-primary:hover { background-color: var(--dbh-primary-color); color: #fff; text-decoration: none; }
/* Beitrag - Single */
.page-format-title h1 { margin: 40px 0 40px 0; font-size: 32px; }
@media (max-width: 575.98px) {
.page-format-title h1 { font-size: 28px; margin: 30px 0 30px 0; }
}
/* Beitragsnavigation - Single */
.site-news-content footer { font-size: 38px; margin-top: 60px; padding: 10px; color: var(--dbh-primary-color); }
/* Sidebar - Widgets */
.widget-area { /* padding: 0 0 0 30px; */ }
.widget-area h3 { font-weight: 700; text-transform: none; }
.widget-area img { margin: 0 auto; }
.widget-area .widget { margin-bottom: 1.5em; }
.widget-area .post-date { display: block; margin-top: 0; margin-left: 20px; font-size: 11px; }
.widget-area ul { list-style: none; padding-left: 0; }
.widget-area ul li { position: relative; padding: 0 12px 0 32px; margin: 12px 0; }
.widget-area ul li a { display: inline-block; width: 100%; }
.widget-area ul li::before { content: "\f0da"; font-family: "Font Awesome 7 Free"; font-weight: 900; position: absolute; left: 16px; top: 0; color: var(--dbh-primary-color); }
.widget-area ol { padding-left: 20px; list-style: decimal; }
.widget-area ol li { margin: 8px 0; }
/* #########################
## Suche - Blog-Widget ##
######################### */
.widget-area .search-box .col { display: flex; align-items: stretch; }
.widget-area .search-box .form-control { width: auto; flex: 1 1 auto; margin: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.widget-area .search-box .btn { margin: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; }
/* Suchfeld - Input */
.widget-area .search-box .form-control { font-family: 'Roboto', Helvetica, Arial, sans-serif; color: var(--dbh-font-color); border-color: var(--dbh-border-color); border-radius: 0; }
.widget-area .search-box .form-control:focus { outline: 0; border-color: var(--dbh-link-color); -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; }
/* Suchfeld - Button */
.widget-area .search-box i { padding-left: 20px; }
.widget-area .search-box .btn i { color: #fff !important; }
.widget-area .search-box .btn { color: #fff; background-color: var(--dbh-link-color); border: 1px solid var(--dbh-link-color); border-radius: 0; padding-left: 0; }
.widget-area .search-box .btn:hover { background-color: var(--dbh-primary-color); border: 1px solid var(--dbh-primary-color); }
.widget-area .search-box .btn:focus,
.widget-area .search-box .btn:active { border-color: var(--dbh-link-color); box-shadow: none !important; }
/* #########################
## Blog - Autor Profil ##
######################### */
.author-box { max-width: 100%; border-radius: 30px; font-size: 16px; }
.author-box a { font-size: 16px; }
.author-box h2 { font-size: 16px; line-height: 1.4666666667; margin-top: 0; }
.author-box__image { width: 96px; height: 96px; object-fit: cover; border: 1px solid var(--bs-border-color); }
@media (max-width: 575.98px) {
.author-box .row {
text-align: center;
justify-content: center;
}
.author-box .col {
flex-basis: 100%;
}
}
/* #########################
## Social Media - Menü ##
######################### */
.social-media { }
.social-links-center { display: table; margin: 0 auto; }
.social-links { list-style: none; font-size: 0; margin: 40px 0 40px 0; padding-left: 0; }
.social-links li { display: inline-block; margin: 0 22px 2px 0; }
.social-links li:last-child { display: inline-block; margin-right: 0; }
.social-links li a { width: 40px; height: 40px; display: block; text-align: center; font-size: 20px; background-color: #fff; border: 2px solid #3d3d3c; color: #3d3d3c; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.social-links li a i { line-height: 36px; }
.social-links li a:hover { background-color: rgba(0, 0, 0, 0.8); color: #fff; border-color: rgba(0, 0, 0, 0.8); }
.social-links.small li a { width: 40px; height: 40px; font-size: 24px; }
.social-links.small li a i { line-height: 36px; }
/* Quadratisch Darstellung */
.social-links.square li a, .square { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; }
/* Runde Darstellung */
.social-links.circle li a { -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; }
/* LinkedIn*/
.social-links li.social-linkedin a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-linkedin a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* XING */
.social-links li.social-xing a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-xing a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* Facebook */
.social-links li.social-facebook a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-facebook a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* Instagram */
.social-links li.social-instagram a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-instagram a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* Twitter */
.social-links li.social-twitter a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-twitter a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* TikTok */
.social-links li.social-tiktok a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-tiktok a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* YouTube */
.social-links li.social-youtube a { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link);; }
.social-links li.social-youtube a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* E-Mail */
.social-links li.contact a:hover { background-color: var(--dbh-social-link); color: var(--dbh-social-color); border: 2px solid var(--dbh-social-link); }
.social-links li.social-contact a:hover { background-color: var(--dbh-social-hover); color: var(--dbh-social-color); border-color: var(--dbh-social-hover); }
/* #######################
## WordPress caption ##
####################### */
.wp-caption { max-width: 100%; font-style: italic; line-height: 1.35; margin-bottom: 15px; margin-top: 5px; }
.wp-caption img[class*=wp-image-] { display: block; max-width: 100%; }
.wp-caption .wp-caption-text { margin: 10px 0px; }
.wp-caption-text,
.entry-thumbnail-caption,
.cycle-caption { font-style: italic; line-height: 1.35; font-size: 13px; }
/* YouTube - Wrapper */
.wp-block-embed__wrapper { overflow: hidden; border-radius: 30px; }
.dbh-video-wrapper { overflow: hidden; border-radius: 30px; }
/* #####################
## Kontaktformular ##
##################### */
/* Inputfelder fomatieren */
.wpcf7-form .form-control { line-height: 1.4666666667; border-radius: 30px; padding: 8px 18px; -webkit-box-shadow: none; box-shadow: none; background: #f8f8f9; border-color: var(--dbh-border-color); }
.wpcf7-form .form-control:focus { border-color: var(--dbh-primary-color); }
.wpcf7-form label { cursor: pointer; font-weight: 700; margin-bottom: 10px; }
/* Formular Checkbox */
.wpcf7-list-item { display: block; margin-top: 4px; }
.wpcf7-form .ship-choice .wpcf7-list-item { display: inline-block; }
/* Platzhalter */
.form-control::-moz-placeholder { color: #212529; opacity: 0.5; }
.form-control::placeholder { color: #212529; opacity: 0.5; }
/* Textfeld formatieren (Mindesthöhe) */
.wpcf7-form textarea.form-control { min-height: 200px; resize: none; background: #f8f8f9; border-color: #e1e9eb; }
.wpcf7-form .form-select { line-height: 1.4666666667; padding: 8px 18px; border-radius: 30px; border-color: #e1e9eb; -webkit-box-shadow: none; box-shadow: none; background-color: #f8f8f9; }
.wpcf7-form .form-select:focus { border-color: var(--dbh-primary-color); }
/* Checkbox - Datenschutz */
.wpcf7-form .wpcf7-acceptance label { position: relative; cursor: pointer; line-height: 1.4666666667; font-weight: 400; }
.wpcf7-form .wpcf7-acceptance input[type=checkbox] { position: relative; visibility: hidden; }
.wpcf7-form .wpcf7-acceptance span.wpcf7-list-item { margin: 0; }
.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span { padding-left: 8px; font-size: 14px; }
.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span p { }
.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span:before { display: block; position: absolute; content: ''; border-radius: 100%; height: 16px; width: 16px; top: 4px; border: 2px solid var(--dbh-primary-color); }
.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span:after { display: block; position: absolute; top: 4px; left: 2; visibility: hidden; border-radius: 100%; border: 8px solid var(--dbh-primary-color); }
.wpcf7-form .wpcf7-acceptance input[type=checkbox]:checked + span:before { background: transparent; border-color: var(--dbh-primary-color); }
.wpcf7-form .wpcf7-acceptance input[type=checkbox]:checked + span:after { visibility: visible; }
.wpcf7-form div.wpcf7-validation-errors, div.wpcf7-acceptance-missing { border: 2px solid var(--dbh-font-color); }
.wpcf7-form .contact-note p { padding-left: 6px; font-size: 14px; margin-bottom: 0; line-height: 19px; }
/* Button */
.wpcf7-form .btn-lg { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.wpcf7-form .btn-lg:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.wpcf7-form .btn-lg:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.wpcf7-form .btn-lg:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
.form-wrapper { height: 65vh; display: flex; align-items: center; }
.form-innerWrapper { margin: 0 auto; max-width: 500px; }
.form-innerWrapper form { padding: 2em 0; }
.form-innerWrapper input { margin: 0.8em 0; }
/* Warnhinweis */
.wpcf7 form.invalid .wpcf7-response-output { border-radius: 30px; border: 1px solid #dc3232; margin: 0em 0.5em 1em; line-height: 1.4666666667; padding: 8px 18px; text-align: center; }
/* Einleitungssatz */
.contact-sentence { margin-bottom: 60px; }
/* Kontakt - Infobox */
.contact-wrapper { max-width: 430px; margin: 0; background: #3d5a80; padding: 22px; border-radius: 30px; box-shadow: 0 10px 30px rgba(61, 90, 128, 0.18); }
.contact-card { background: rgba(238, 244, 251, 0.14); border: 1px solid rgba(238, 244, 251, 0.18); padding: 20px 18px; margin-bottom: 16px; border-radius: 30px; transition: transform 0.28s ease, box-shadow 0.28s ease, background-color 0.28s ease; }
.contact-card:last-child { margin-bottom: 0; }
.contact-card:hover { transform: translateY(-4px) scale(1.01); background: rgba(238, 244, 251, 0.22); box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12); }
.icon-circle { width: 50px; height: 50px; min-width: 50px; border-radius: 50%; background: rgba(238, 244, 251, 0.18); display: flex; align-items: center; justify-content: center; color: #eef4fb; font-size: 20px; transition: transform 0.28s ease, background-color 0.28s ease; }
.contact-card:hover .icon-circle { transform: rotate(8deg) scale(1.08); background: rgba(238, 244, 251, 0.28); }
.contact-title { color: #eef4fb; font-weight: 700; }
.contact-text { color: #eef4fb; margin: 0; opacity: 0.95; }
@media (max-width: 575.98px) {
.contact-title {
font-size: 1.45rem;
}
.contact-text {
font-size: 0.98rem;
}
.contact-wrapper {
margin: 20px 12px;
}
}
/* ####################
## Passwortschutz ##
#################### */
.form-wrapper .form-control { line-height: 1.4666666667; border-radius: 30px; padding: 8px 18px; -webkit-box-shadow: none; box-shadow: none; background: #f8f8f9; border-color: #e1e9eb; }
.form-wrapper .button-primary { font-family: 'Montserrat', Helvetica, Arial, sans-serif; border: 0; background-color: var(--dbh-link-color); border-color: var(--dbh-link-color); color: #fff; margin-top: 10px; padding: 10px 40px; font-size: 18px; font-weight: 700; letter-spacing: 0; text-transform: none; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-shadow: none; }
.form-wrapper .button-primary:focus { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.form-wrapper .button-primary:active { background-color: var(--dbh-link-color) !important; border-color: var(--dbh-link-color) !important; color: #fff; box-shadow: none !important; }
.form-wrapper .button-primary:hover { background-color: var(--dbh-primary-color); border-color: var(--dbh-primary-color); color: #fff; }
.form-wrapper .password-error { color: #c62828; font-weight: 700; margin-bottom: 12px; }
/* Visual Portfolio: Search & Protection */
.vp-search__style-default input[type="text"] { font-size: .9em; line-height: 1.4666666667; text-transform: none; border-radius: 30px; padding: 8px 18px; -webkit-box-shadow: none; box-shadow: none; background-color: #f8f8f9 !important; border: 1px solid #e1e9eb; }
.vp-block-protection-form input { line-height: 1.4666666667; border-radius: 30px; padding: 8px 18px; -webkit-box-shadow: none; box-shadow: none; background: #f8f8f9; border: 1px solid #e1e9eb; }
.vp-block-protection-form input[type="submit"] {
font-family: 'Montserrat', Helvetica, Arial, sans-serif;
border: 0;
background-color: var(--dbh-link-color);
border-color: var(--dbh-link-color);
color: #fff;
margin-top: 10px;
padding: 10px 40px;
font-size: 18px;
font-weight: 700;
letter-spacing: 0;
text-transform: none;
transition: all 0.3s;
border-radius: 30px;
box-shadow: none;
-webkit-appearance: none;
appearance: none;
cursor: pointer;
}
.vp-block-protection-form input[type="submit"]:focus {
background-color: var(--dbh-link-color) !important;
border-color: var(--dbh-link-color) !important;
color: #fff;
box-shadow: none !important;
outline: none;
}
.vp-block-protection-form input[type="submit"]:active {
background-color: var(--dbh-link-color) !important;
border-color: var(--dbh-link-color) !important;
color: #fff;
box-shadow: none !important;
}
.vp-block-protection-form input[type="submit"]:hover {
background-color: var(--dbh-primary-color);
border-color: var(--dbh-primary-color);
color: #fff;
}
/* ##################
## 404 - Fehler ##
################## */
#error .heading h1 { margin-top: 40px; text-align: center; }
.error-content { text-align: center; }
.error-content h1 { margin-bottom: 1.9em; }
.fa-minus-circle { padding-top: 10px; padding-bottom: 10px; color: #912722; }
/* ##################
## Beta-Hinweis ##
################## */
ul.beta-notice { list-style-type: none !important; }
.beta-notice { text-align: right !important; }
/* #####################
## Pfeil nach oben ##
##################### */
.scrollToTop { color: #fff; position: fixed; bottom: 10px; right: 10px; width: 34px; height: 34px; text-align: center; cursor: pointer; background-color: rgba(33, 37, 41, .4); z-index: 1005; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); opacity: 0; filter: alpha(opacity=0); border-radius: 100%; }
.scrollToTop.fadeToTop { -webkit-animation-name: fadeToTop; animation-name: fadeToTop; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes fadeToTop { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } }
@keyframes fadeToTop { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } }
.scrollToTop.fadeToBottom { -webkit-animation-name: fadeToBottom; animation-name: fadeToBottom; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
@-webkit-keyframes fadeToBottom { 0% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
@keyframes fadeToBottom { 0% { opacity: 1; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
.scrollToTop i { line-height: 32px; font-size: 16px; }
.scrollToTop:hover { background-color: rgba(33, 37, 41, .6); }
/* ############
## Footer ##
############ */
.footer-waves {
position: relative;
width: 100%;
height: 150px;
transform: scaleY(-1); /* SPIEGELN */
}
.footer-waves svg {
position: absolute;
left: 0;
width: 100%;
height: 100%;
display: block;
}
.footer-waves svg:nth-child(1) path {
fill: #ffffff;
}
.footer-waves svg:nth-child(2) path {
fill: #ffffff;
opacity: 0.4;
}
.wave-1 { bottom: -10px; }
.footer-waves svg:nth-child(3) path {
fill: #ffffff;
opacity: 0.1;
}
.site-footer { background: var(--dbh-footer-bg); color: #fff; font-size: 16px; padding: 0; }
.site-footer h5 { color: #fff; }
.site-footer a { color: #fff; }
.site-footer a:hover { color: var(--dbh-link-color); }
.footer-content { padding-bottom: 20px; }
/* Footer - Menü */
ul.site-footer-menu { margin: 0; padding: 0; list-style: none; }
.site-footer-menu li { display: inline-block; margin: 0 20px 0 0; }
/* ####################
## footer - unten ##
#################### */
/* Subfooter */
.sub-footer { margin-top: 10px; font-size: 14px; color: #f2f2f2; line-height: 44px; }
.sub-footer p { font-size: 14px; margin: 8px 0; }
.sub-footer a { color: #f2f2f2; text-decoration: none; }
.sub-footer a:hover { color: var(--dbh-link-color); text-decoration: none; }
.sub-footer .sub-line { border-top: 2px dotted rgba(224, 251, 252, .2); }
/* Menü */
.sub-footer-menu { float: right; display: inline-block; padding: 0; }
.sub-footer-menu a { color: #f2f2f2; text-decoration: none; }
.sub-footer-menu a:hover { color: var(--dbh-link-color); text-decoration: none; }
ul.sub-footer-menu { margin: 0; list-style: none; }
.sub-footer-menu li { float: left; }
.sub-footer-menu li:not(:last-child)::after { content: " - "; white-space: pre; }
.sub-footer-menu li:last-child::before { content: "" }
.sub-footer-menu li:last-child::after { content: "" }
@media (min-width: 576px) { }
@media (min-width: 768px) { }
@media (min-width: 992px) { }
@media (min-width: 1200px) { }
@media (min-width: 1400px) { }
/* ========================================================================================================= */
/* Adminbar - Sonderfall header-Hinweise */
@media screen and (max-width: 600px) {
#wpadminbar {
position: fixed !important;
}
}
/* sm */
@media (max-width: 575.98px) {
body, button, input, select, textarea { font-size: 17px; }
h1 { font-size: 30px; }
h2 { font-size: 24px; line-height: 34px; }
.news-content h1 { font-size: 30px; }
ul.site-footer-menu { display: table; margin: 0 auto 40px auto; }
.site-footer .social-media { float: none; display: table; margin: 40px auto 0 auto; }
.site-footer .social-links li:first-child { margin-left: 0; }
/* subfooter */
.sub-footer { line-height: 30px; }
.sub-footer p { line-height: 1.4666666667; padding: 14px 0 0 0; margin: 0; text-align: center; }
.sub-footer-menu { display: table; float: none; padding: 0; margin: 0 auto !important; }
}
/* md */
@media (max-width: 767.98px) {
.main-navigation .nav-menu { width: 70%; }
}
/* lg */
@media (max-width: 991.98px) { }
/* xl */
@media (max-width: 1199.98px) {
.contact-wrapper { margin: 100px auto 20px auto; }
}
/* xxl */
@media (max-width: 1399.98px) { }