@font-face {
font-family: "Nunito";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//www.kirchdocs.at/wp-content/themes/kirchdocs/assets/fonts/nunito-regular.woff2) format("woff2");
}
@font-face {
font-family: "Nunito";
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(//www.kirchdocs.at/wp-content/themes/kirchdocs/assets/fonts/nunito-semibold.woff2) format("woff2");
} :root { --kd-navy: #1A3B5C;
--kd-petrol: #2F8FA0;
--kd-petrol-hell: #68BECD; --kd-petrol-text: #277886;
--kd-creme: #F5F2ED;
--kd-slate: #2C3E50;
--kd-weiss: #ffffff; --kd-text: var(--kd-slate);
--kd-text-leise: #4a5568;
--kd-linie: rgba(26, 59, 92, 0.16);
--kd-flaeche: var(--kd-weiss); --kd-schrift: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --e-global-color-primary: var(--kd-navy);
--e-global-color-secondary: var(--kd-petrol);
--Uberschrift: var(--kd-schrift); --kd-inhalt-breite: 1140px;
--kd-text-breite: 820px;
--kd-gutter: 20px;
--kd-logo: 72px;
--kd-kopf-hoehe: 88px;
--kd-radius: 10px; --kd-seg: 80px;
--kd-seg-titel: 20px;
}
@media (max-width: 767px) {
:root {
--kd-seg: 44px;
--kd-logo: 60px;
--kd-kopf-hoehe: 76px;
}
} *,
*::before,
*::after {
box-sizing: border-box;
}
html {
line-height: 1.15;
-webkit-text-size-adjust: 100%;
scroll-behavior: smooth; background-color: var(--kd-navy); scroll-padding-top: calc(var(--kd-kopf-hoehe) + 12px);
}
body {
margin: 0; background-color: var(--kd-navy);
color: var(--kd-text);
font-family: var(--kd-schrift);
font-size: 1rem;
font-weight: 400;
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} main.site-main {
background-color: var(--kd-flaeche);
}
img,
video {
max-width: 100%;
height: auto;
border-style: none;
}
svg {
max-width: 100%;
}
hr {
height: 0;
border: 0;
border-top: 1px solid var(--kd-linie);
margin: 2rem 0;
} @media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
scroll-behavior: auto !important;
}
} h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0 0 0.6em;
font-family: var(--Uberschrift, var(--kd-schrift));
font-weight: 700;
line-height: 1.2;
color: var(--kd-navy);
}
h1 { font-size: clamp(28px, 4.4vw, 40px); }
h2 { font-size: clamp(24px, 3.4vw, 32px); }
h3 { font-size: clamp(20px, 2.6vw, 24px); }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.125rem; }
h6 { font-size: 1rem; }
p {
margin: 0 0 1rem;
} a {
color: var(--kd-petrol-text);
background-color: transparent;
text-decoration: none;
}
a:hover,
a:focus {
color: var(--kd-navy);
text-decoration: underline;
}
b,
strong {
font-weight: 700;
}
small {
font-size: 87.5%;
}
code,
kbd,
pre,
samp {
font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
font-size: 0.9375em;
}
pre {
overflow-x: auto;
padding: 1rem;
background: var(--kd-creme);
border-radius: var(--kd-radius);
white-space: pre-wrap;
}
blockquote {
margin: 1.5rem 0;
padding: 0.25rem 0 0.25rem 1.25rem;
border-left: 4px solid var(--kd-petrol);
color: var(--kd-text-leise);
}
figure {
margin: 1.5rem 0;
}
figcaption {
margin-top: 0.5rem;
font-size: 0.875rem;
color: var(--kd-text-leise);
} .screen-reader-text {
position: absolute;
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
border: 0;
overflow: hidden;
clip-path: inset(50%);
white-space: nowrap;
} .skip-link:focus {
position: fixed;
top: 8px;
left: 8px;
z-index: 100000;
width: auto;
height: auto;
margin: 0;
padding: 12px 20px;
overflow: visible;
clip-path: none;
background: var(--kd-weiss);
color: var(--kd-navy);
font-weight: 700;
border-radius: var(--kd-radius);
box-shadow: 0 2px 14px rgba(0, 0, 0, 0.28);
}
:focus-visible {
outline: 3px solid var(--kd-petrol);
outline-offset: 2px;
} .site-header {
position: sticky;
top: 0;
z-index: 990;
background: var(--kd-navy);
box-shadow: 0 1px 10px rgba(0, 0, 0, 0.18);
} body.admin-bar .site-header {
top: 32px;
}
@media screen and (min-width: 601px) and (max-width: 782px) {
body.admin-bar .site-header {
top: 46px;
}
}
@media screen and (max-width: 600px) {
body.admin-bar .site-header {
top: 0;
}
}
.site-header .header-inner {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 8px 16px;
max-width: var(--kd-inhalt-breite);
margin-inline: auto;
padding: 8px var(--kd-gutter);
background: var(--kd-navy);
}
.site-header .site-branding {
display: flex;
align-items: center;
min-width: 0;
}
.site-header .site-logo,
.site-header .custom-logo-link {
display: block;
line-height: 0;
}
.site-header .site-logo img {
display: block;
width: var(--kd-logo);
max-width: var(--kd-logo);
height: auto;
}
.site-header .site-title {
margin: 0;
font-family: var(--Uberschrift, var(--kd-schrift));
font-size: 1.25rem;
font-weight: 700;
line-height: 1.2;
}
.site-header .site-title a {
color: var(--kd-weiss);
text-decoration: none;
}  .site-navigation ul.menu {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 2px;
margin: 0;
padding: 0;
list-style: none;
}
.site-navigation ul.menu li {
position: relative;
}
.site-navigation ul.menu a {
display: block;
padding: 10px 14px;
color: var(--kd-weiss);
font-size: 0.9375rem;
font-weight: 700;
text-decoration: none;
border-radius: 8px;
}
.site-navigation ul.menu a:hover,
.site-navigation ul.menu a:focus {
color: var(--kd-petrol-hell);
background: rgba(255, 255, 255, 0.10);
text-decoration: none;
}
.site-navigation ul.menu .current-menu-item > a,
.site-navigation ul.menu .current_page_item > a {
color: var(--kd-petrol-hell);
} .site-navigation ul.menu ul {
position: absolute;
top: 100%;
left: 0;
z-index: 20;
display: none;
min-width: 220px;
margin: 0;
padding: 6px;
list-style: none;
background: var(--kd-navy);
border-radius: var(--kd-radius);
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.25);
}
.site-navigation ul.menu li:hover > ul,
.site-navigation ul.menu li:focus-within > ul {
display: block;
} .site-navigation-toggle-holder {
display: none;
align-items: center;
}
.site-navigation-toggle {
display: flex;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
padding: 0;
border: 0;
border-radius: 8px;
background: rgba(255, 255, 255, 0.12);
color: var(--kd-weiss);
cursor: pointer;
}
.site-navigation-toggle:hover {
background: rgba(255, 255, 255, 0.22);
}
.site-navigation-toggle-icon {
position: relative;
display: block;
width: 22px;
height: 2px;
border-radius: 2px;
background: currentColor;
transition: background-color 0.15s ease;
}
.site-navigation-toggle-icon::before,
.site-navigation-toggle-icon::after {
content: "";
position: absolute;
left: 0;
display: block;
width: 22px;
height: 2px;
border-radius: 2px;
background: currentColor;
transition: transform 0.15s ease;
}
.site-navigation-toggle-icon::before { top: -7px; }
.site-navigation-toggle-icon::after  { top: 7px; }
.site-navigation-toggle[aria-expanded="true"] .site-navigation-toggle-icon {
background: transparent;
}
.site-navigation-toggle[aria-expanded="true"] .site-navigation-toggle-icon::before {
transform: translateY(7px) rotate(45deg);
}
.site-navigation-toggle[aria-expanded="true"] .site-navigation-toggle-icon::after {
transform: translateY(-7px) rotate(-45deg);
}
.site-navigation-dropdown {
position: absolute;
top: 100%;
left: 0;
z-index: 1000;
width: 100%;
max-height: 0;
overflow: hidden; visibility: hidden;
background: var(--kd-navy);
border-top: 1px solid rgba(255, 255, 255, 0.15);
box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
transition: max-height 0.25s ease, visibility 0s linear 0.25s;
}
.site-header.kd-menue-offen .site-navigation-dropdown {
max-height: calc(100vh - var(--kd-kopf-hoehe));
overflow-y: auto;
visibility: visible;
transition: max-height 0.25s ease, visibility 0s;
}
.site-navigation-dropdown ul.menu,
.site-navigation-dropdown ul.menu ul {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.site-navigation-dropdown ul.menu a {
display: block;
padding: 16px var(--kd-gutter);
border-radius: 0;
box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12);
font-size: 1rem; color: var(--kd-weiss);
font-weight: 700;
}
.site-navigation-dropdown ul.menu a:hover,
.site-navigation-dropdown ul.menu a:focus {
background: rgba(255, 255, 255, 0.10);
color: var(--kd-petrol-hell);
} .site-navigation-dropdown ul.menu ul a {
padding-left: calc(var(--kd-gutter) + 20px);
font-weight: 400;
}  .site-navigation ul.menu .kd-sprungpunkt--knopf > a,
.site-navigation ul.menu .kd-rueckweg-punkt > a {
background: var(--kd-petrol);
color: var(--kd-weiss);
}
.site-navigation ul.menu .kd-sprungpunkt--knopf > a:hover,
.site-navigation ul.menu .kd-sprungpunkt--knopf > a:focus,
.site-navigation ul.menu .kd-rueckweg-punkt > a:hover,
.site-navigation ul.menu .kd-rueckweg-punkt > a:focus {
background: var(--kd-petrol-hell);
color: var(--kd-navy);
} .site-navigation ul.menu a.kd-aktiv {
color: var(--kd-petrol-hell);
background: rgba(255, 255, 255, 0.10);
}
.site-navigation ul.menu .kd-sprungpunkt--knopf > a.kd-aktiv {
background: var(--kd-petrol-hell);
color: var(--kd-navy);
} .site-navigation-dropdown ul.menu .kd-sprungpunkt--knopf > a {
background: var(--kd-petrol);
color: var(--kd-weiss);
}
.site-navigation-dropdown ul.menu a.kd-aktiv {
color: var(--kd-petrol-hell);
}
.site-navigation-dropdown ul.menu .kd-sprungpunkt--knopf > a.kd-aktiv {
color: var(--kd-weiss);
box-shadow: inset 4px 0 0 var(--kd-petrol-hell);
}  .site-navigation ul.menu .kd-rueckweg-link::before {
content: "\2190";
content: "\2190" / "";
margin-right: 8px;
} @media (max-width: 1024px) { .site-header .header-inner {
row-gap: 0;
}
.site-header.kd-nav-bereit .header-inner { position: relative; min-height: calc(var(--kd-logo) + 16px); contain: layout;
} .site-header .site-branding {
order: 1;
}
.site-header .site-navigation-toggle-holder {
order: 2;
}
.site-header .site-navigation {
order: 3;
}
.site-navigation {
flex: 1 0 100%;
margin-top: 6px;
overflow: hidden;
}
.site-navigation ul.menu {
justify-content: center;
gap: 2px 4px;
}
.site-navigation ul.menu a {
padding: 8px 10px;
font-size: 0.875rem;
} .site-header.kd-nav-bereit .site-navigation { margin-top: 0;
opacity: 1;
visibility: visible;
transition: opacity 0.16s ease-out, visibility 0s;
}
.site-header.kd-nav-bereit.kd-kompakt .site-navigation {
opacity: 0; visibility: hidden;
transition: opacity 0.16s ease-out, visibility 0s linear 0.16s;
} .site-header.kd-nav-bereit .site-branding {
position: absolute;
left: var(--kd-gutter);
top: 50%;
transform: translateY(-50%); z-index: 2;
opacity: 0;
visibility: hidden; will-change: opacity;
transition: opacity 0.16s ease-out, visibility 0s linear 0.16s;
} .site-header.kd-nav-bereit.kd-kompakt .site-branding,
.site-header.kd-nav-bereit.kd-menue-offen .site-branding {
opacity: 1;
visibility: visible;
transition: opacity 0.16s ease-out, visibility 0s;
} .site-header.kd-nav-bereit .site-navigation-toggle-holder {
display: flex;
position: absolute;
right: var(--kd-gutter);
top: 50%;
transform: translateY(-50%);
z-index: 2;
opacity: 0;
visibility: hidden;
transition: opacity 0.16s ease-out, visibility 0s linear 0.16s;
}
.site-header.kd-nav-bereit.kd-kompakt .site-navigation-toggle-holder,
.site-header.kd-nav-bereit.kd-menue-offen .site-navigation-toggle-holder {
opacity: 1;
visibility: visible;
transition: opacity 0.16s ease-out, visibility 0s;
}
.site-header:not(.kd-nav-bereit) .site-navigation ul.menu {
justify-content: flex-start;
}
.site-navigation ul.menu ul {
position: static;
display: block;
min-width: 0;
box-shadow: none;
}  .site-header.kd-kopf--rueckweg .header-inner .site-navigation {
flex: 0 0 auto;
margin-top: 0;
overflow: visible;
}
.site-header.kd-kopf--rueckweg .header-inner .site-branding,
.site-header.kd-kopf--rueckweg .header-inner .site-navigation {
position: static;
transform: none;
opacity: 1;
visibility: visible;
transition: none;
}
} @media (max-width: 1024px) and (prefers-reduced-motion: reduce) {
.site-header.kd-nav-bereit .site-navigation,
.site-header.kd-nav-bereit .site-branding,
.site-header.kd-nav-bereit .site-navigation-toggle-holder {
transition: none;
}
}  .kd-startseite h2[id],
#start,
#patienteninfo,
#kontakt,
#kontaktdaten {
scroll-margin-top: calc(var(--kd-kopf-hoehe, 88px) + 16px);
}
html {
scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
} .site-footer {
background: var(--kd-navy);
color: rgba(255, 255, 255, 0.85);
padding: 24px var(--kd-gutter);
}
.site-footer .footer-inner {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 10px 24px;
max-width: var(--kd-inhalt-breite);
margin-inline: auto;
}
.site-footer .kd-copyright {
margin: 0;
font-size: 0.875rem;
}
.site-footer .site-navigation ul.menu {
gap: 2px 6px;
}
.site-footer .site-navigation ul.menu a {
padding: 6px 10px;
font-size: 0.875rem;
font-weight: 600;
}
@media (max-width: 575px) {
.site-footer .footer-inner {
flex-direction: column;
text-align: center;
}
} .kd-startseite {
display: flex;
flex-direction: column;
gap: var(--kd-seg);
width: 100%;
} .kd-startseite > h2 {
max-width: var(--kd-inhalt-breite);
margin: 0 auto calc(var(--kd-seg-titel) - var(--kd-seg));
padding-inline: var(--kd-gutter);
color: var(--kd-navy);
text-align: center;
} .kd-startseite > .kd-hero--voll,
.kd-startseite > .kd-kdt--voll {
width: auto;
max-width: none;
left: auto;
transform: none;
} .kd-startseite > .kd-kontakt {
margin-block: 0;
} .kd-startseite > .kd-kdt {
--kd-seg: 0px;
} .kd-startseite > .kd-leistungen {
max-width: var(--kd-inhalt-breite);
margin-inline: auto;
padding-inline: var(--kd-gutter);
} .kd-startseite > .kd-zweispaltig {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 40px;
max-width: var(--kd-inhalt-breite);
margin-inline: auto;
padding-inline: var(--kd-gutter);
}
.kd-zweispaltig .kd-zs-spalte {
display: flex;
flex-direction: column;
gap: var(--kd-seg-titel);
min-width: 0;
} .kd-zweispaltig .kd-zs-spalte > * {
min-width: 0;
width: 100%;
} .kd-zweispaltig .kd-zs-spalte > h2 {
margin: 0;
color: var(--kd-navy);
text-align: center;
}
@media (max-width: 767px) {
.kd-startseite > .kd-zweispaltig {
grid-template-columns: 1fr;
gap: var(--kd-seg);
}
} .kd-kontakt--ersatz .kd-kontakt-ersatz-liste {
max-width: 520px;
margin: 0 auto;
padding: 0;
list-style: none;
text-align: center;
}
.kd-kontakt--ersatz .kd-kontakt-ersatz-liste li {
margin-bottom: 0.75rem;
font-size: 1.0625rem;
}
.kd-kontakt--ersatz .kd-kontakt-ersatz-hinweis {
display: block;
color: var(--kd-text-leise);
font-size: 0.875rem;
}
.kd-kontakt--ersatz .kd-oz {
margin-top: var(--kd-seg-titel);
} .kd-startseite > p:last-child,
.kd-startseite > p:has( a[href*="impressum"] ) {
margin-top: calc(-1 * var(--kd-seg));
margin-bottom: 0; padding: 24px var(--kd-gutter);
background: var(--kd-navy);
text-align: center;
} .kd-inhalt {
max-width: var(--kd-text-breite);
margin-inline: auto;
padding: 48px var(--kd-gutter) 64px;
}
.kd-inhalt .page-header {
margin-bottom: 1.5rem;
}
.kd-inhalt .entry-title {
margin-bottom: 0.35em;
}
.kd-inhalt .entry-meta {
margin: 0;
color: var(--kd-text-leise);
font-size: 0.875rem;
}
.kd-beitragsbild {
margin: 0 0 1.5rem;
}
.kd-beitragsbild img {
width: 100%;
border-radius: var(--kd-radius);
} .entry-content a,
.page-content a,
.entry-summary a {
text-decoration: underline;
text-underline-offset: 0.15em;
}
.entry-content ul,
.entry-content ol,
.page-content ul,
.page-content ol {
margin: 0 0 1rem;
padding-left: 1.5rem;
}
.entry-content li,
.page-content li {
margin-bottom: 0.35rem;
}
.entry-content table,
.page-content table {
width: 100%;
margin-bottom: 1.5rem;
border-collapse: collapse;
}
.entry-content th,
.entry-content td,
.page-content th,
.page-content td {
padding: 10px 12px;
border: 1px solid var(--kd-linie);
text-align: left;
vertical-align: top;
}
.entry-content th,
.page-content th {
font-weight: 700;
} .kd-beitragsliste {
display: grid;
gap: 40px;
}
.kd-vorschau .entry-title {
margin-bottom: 0.25em;
}
.kd-vorschau .entry-title a {
color: var(--kd-navy);
text-decoration: none;
}
.kd-vorschau .entry-title a:hover {
color: var(--kd-petrol-text);
text-decoration: underline;
}
.kd-vorschau__bild {
display: block;
margin: 0.75rem 0;
}
.kd-vorschau__bild img {
width: 100%;
max-height: 360px;
object-fit: cover;
border-radius: var(--kd-radius);
} .pagination,
.post-navigation {
margin-top: 48px;
padding-top: 24px;
border-top: 1px solid var(--kd-linie);
}
.pagination .nav-links,
.post-navigation .nav-links {
display: flex;
flex-wrap: wrap;
gap: 8px 20px;
justify-content: space-between;
}
.pagination .page-numbers {
display: inline-block;
padding: 6px 12px;
border-radius: 8px;
}
.pagination .page-numbers.current {
background: var(--kd-navy);
color: var(--kd-weiss);
}
.kd-blaettern__label {
display: block;
font-size: 0.8125rem;
color: var(--kd-text-leise);
} .kd-inhalt input[type="text"],
.kd-inhalt input[type="email"],
.kd-inhalt input[type="search"],
.kd-inhalt input[type="url"],
.kd-inhalt input[type="tel"],
.kd-inhalt input[type="number"],
.kd-inhalt input[type="password"],
.kd-inhalt select,
.kd-inhalt textarea {
width: 100%;
padding: 10px 12px;
border: 1px solid var(--kd-linie);
border-radius: 8px;
background: var(--kd-weiss);
color: var(--kd-text);
font-family: inherit;
font-size: 1rem;
line-height: 1.5;
}
.kd-inhalt input:focus,
.kd-inhalt select:focus,
.kd-inhalt textarea:focus {
border-color: var(--kd-petrol);
}
.kd-inhalt button,
.kd-inhalt input[type="submit"],
.kd-knopf {
display: inline-block;
width: auto;
padding: 12px 24px;
border: 0;
border-radius: var(--kd-radius);
background: var(--kd-navy);
color: var(--kd-weiss);
font-family: inherit;
font-size: 1rem;
font-weight: 700;
text-decoration: none;
cursor: pointer;
}
.kd-inhalt button:hover,
.kd-inhalt input[type="submit"]:hover,
.kd-knopf:hover {
background: var(--kd-petrol-text);
color: var(--kd-weiss);
text-decoration: none;
}
.kd-suchformular {
margin: 0 0 32px;
}
.kd-suchformular form {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
}
.kd-suchformular label {
flex: 1 1 220px;
}
.kd-suchbegriff {
color: var(--kd-petrol-text);
} .alignleft {
float: left;
margin: 0.3rem 1.5rem 1rem 0;
}
.alignright {
float: right;
margin: 0.3rem 0 1rem 1.5rem;
}
.aligncenter {
clear: both;
display: block;
margin-inline: auto;
}
.alignwide,
.alignfull {
max-width: 100%;
}
.wp-caption {
max-width: 100%;
}
.wp-caption-text,
.gallery-caption {
margin: 0.5rem 0 0;
font-size: 0.875rem;
color: var(--kd-text-leise);
}