/* Theme Name: Hausarztpraxis am Markt Kirchhatten v2 Theme URI: https://www.hausarztpraxis-kirchhatten.de/ Description: Theme for Hausarztpraxis am Markt Kirchhatten based on wordpress standard theme Twenty Twenty-One. Author: Bastian Felsmann Author URI: https://www.felsmalerei.net Template: twentytwentyone Version: 1.0 License: GNU General Public License v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html s */ /* * MEDIA QUERY BREAKPOINTS @media only screen and (min-width: 482px) { } @media only screen and (min-width: 769px) { } @media only screen and (min-width: 822px) { } @media only screen and (min-width: 1024px) { } @media only screen and (min-width: 1140px) { } */ /* * VARIABLES */ :root { /* Font Family */ --font-headings: 'Nunito Sans'; --font-base: 'Nunito Sans'; --global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Cantarell, "Times New Roman", serif); --global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif); /* Font Size */ --global--font-size-base: 1rem; /* 16px */ --global--font-size-xs: 0.875rem; /* 14px */ --global--font-size-sm: 1rem; /* 16px */ --global--font-size-md: 1.25rem; /* 20px */ --global--font-size-lg: 1.5rem; /* 24px */ --global--font-size-xl: 2rem; /* 32px */ --global--font-size-xxl: 2.5rem; /* 40px */ --global--font-size-xxxl: 3rem; /* 48px */ --global--font-size-page-title: var(--global--font-size-xxxl); --global--letter-spacing: 0.05rem; /* Line Height */ --global--line-height-body: 1.75; --global--line-height-heading: 1.25; --global--line-height-page-title: 1.25; /* Headings */ --heading--font-family: var(--global--font-primary); --heading--font-size-h1: var(--global--font-size-xxxl); --heading--font-size-h2: var(--global--font-size-xl); --heading--font-size-h3: var(--global--font-size-xl); --heading--font-size-h4: var(--global--font-size-lg); --heading--font-size-h5: var(--global--font-size-md); --heading--font-size-h6: var(--global--font-size-sm); --heading--letter-spacing-h1: var(--global--letter-spacing); --heading--letter-spacing-h2: var(--global--letter-spacing); --heading--letter-spacing-h3: var(--global--letter-spacing); --heading--letter-spacing-h4: var(--global--letter-spacing); --heading--letter-spacing-h5: var(--global--letter-spacing); --heading--letter-spacing-h6: 0.1rem; --heading--line-height-h1: var(--global--line-height-heading); --heading--line-height-h2: var(--global--line-height-heading); --heading--line-height-h3: var(--global--line-height-heading); --heading--line-height-h4: var(--global--line-height-heading); --heading--line-height-h5: var(--global--line-height-heading); --heading--line-height-h6: var(--global--line-height-heading); --heading--font-style: normal; --heading--font-weight: 600; --heading--font-weight-page-title: 600; --heading--font-weight-strong: 600; /* Colors */ --global--color-gray-50: #F8F7F7; --global--color-gray-100: #F0EEEE; --global--color-gray-200: #DDDADA; --global--color-gray-300: #BFBABA; --global--color-gray-400: #9C9494; --global--color-gray-500: #807778; --global--color-gray-600: #686162; --global--color-gray-700: #554F4F; --global--color-gray-800: #484445; --global--color-gray-900: #3F3B3C; --global--color-gray-950: #312E2E; --global--color-red-50: #FFF0EF; --global--color-red-100: #FFDCDA; --global--color-red-200: #FFBEBB; --global--color-red-300: #FF918C; --global--color-red-400: #FF524A; --global--color-red-500: #FF1D13; --global--color-red-600: #FF0B00; --global--color-red-700: #E60A00; --global--color-red-800: #BD0800; --global--color-red-900: #9F0801; --global--color-red-950: #560400; --global--color-black: #000000; --global--color-white: #FFFFFF; --global--color-primary: var(--global--color-red-950); /* Headlines */ --global--color-secondary: var(--global--color-gray-950); /* Body Text */ /* Used for borders (separators) */ /* Spacing */ --global--spacing-unit: 8px; --global--spacing-measure: unset; --global--spacing-horizontal: 20px; --global--spacing-vertical: 20px; /* Forms */ --form--font-family: var(--global--font-secondary); --form--font-size: var(--global--font-size-md); --form--line-height: var(--global--line-height-body); --form--color-text: var(--global--color-gray-950); /* --form--color-ranged: var(--global--color-secondary); --form--label-weight: 400; --form--border-color: var(--global--color-gray-200); --form--border-width: 2px; --form--border-radius: 12px; --form--spacing-unit: calc(0.5 * var(--global--spacing-unit)); */ /* Radius */ --global--border-radius: 10px; /* Buttons */ --button--color-text: var(--global--color-white); --button--color-text-hover: var(--global--color-white); --button--color-text-active: var(--global--color-white); --button--color-background: var(--global--color-red-900); --button--color-background-active: var(--global--color-red-900); --button--font-family: var(--global--font-secondary); --button--font-size: var(--global--font-size-md); --button--font-weight: 600; --button--line-height: 1; --button--border-width: 0px; --button--border-radius: var(--global--border-radius); --button--padding-vertical: var(--global--spacing-unit); --button--padding-horizontal: calc(2 * var(--button--padding-vertical)); /* entry */ --entry-header--color: var(--global--color-secondary); --entry-header--color-link: currentColor; --entry-header--color-hover: var(--global--color-primary-hover); --entry-header--color-focus: var(--global--color-secondary); --entry-header--font-size: var(--heading--font-size-h2); --entry-content--font-family: var(--global--font-secondary); --entry-author-bio--font-family: var(--heading--font-family); --entry-author-bio--font-size: var(--heading--font-size-h4); /* Header */ --branding--color-text: var(--global--color-primary); --branding--color-link: var(--global--color-primary); --branding--color-link-hover: var(--global--color-secondary); --branding--title--font-family: var(--global--font-primary); --branding--title--font-size: var(--global--font-size-lg); --branding--title--font-size-mobile: var(--heading--font-size-h3); --branding--title--font-weight: 600; --branding--title--text-transform: none; --branding--description--font-family: var(--global--font-secondary); --branding--description--font-size: var(--global--font-size-sm); --branding--logo--max-width: 280px; --branding--logo--max-height: 120px; --branding--logo--max-width-mobile: 240px; --branding--logo--max-height-mobile: 100px; /* Main navigation */ --primary-nav--font-family: var(--global--font-secondary); --primary-nav--font-family-mobile: var(--global--font-primary); --primary-nav--font-size: var(--global--font-size-md); --primary-nav--font-size-sub-menu: var(--global--font-size-md); --primary-nav--font-size-mobile: var(--global--font-size-md); --primary-nav--font-size-sub-menu-mobile: var(--global--font-size-md); --primary-nav--font-size-button: var(--global--font-size-md); --primary-nav--font-style: normal; --primary-nav--font-style-sub-menu-mobile: normal; --primary-nav--font-weight: 600; --primary-nav--font-weight-button: 600; /* Footer */ --footer--color-text: var(--global--color-gray-950); --footer--color-link: var(--global--color-gray-950); --footer--color-link-hover: var(--global--color-gray-950); --footer--font-family: var(--global--font-secondary); --footer--font-size: var(--global--font-size-sm); --widget--line-height-list: 1.5; } /** * Root Media Query Variables */ :root { --responsive--spacing-horizontal: calc(2 * var(--global--spacing-horizontal) * 0.6); --responsive--aligndefault-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignwide-width: calc(100vw - var(--responsive--spacing-horizontal)); --responsive--alignfull-width: 100%; --responsive--alignright-margin: var(--global--spacing-horizontal); --responsive--alignleft-margin: var(--global--spacing-horizontal); } @media only screen and (min-width: 482px) { :root { --responsive--aligndefault-width: min(calc(100vw - 4 * var(--global--spacing-horizontal)), 840px); --responsive--alignwide-width: calc(100vw - 4 * var(--global--spacing-horizontal)); --responsive--alignright-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); --responsive--alignleft-margin: calc(0.5 * (100vw - var(--responsive--aligndefault-width))); } } @media only screen and (min-width: 822px) { :root { --responsive--aligndefault-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 960px); --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1140px); --responsive--alignfull-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1440px); } } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-scroll-behavior: smooth; scroll-behavior: smooth; } html { overflow-x: hidden; /* Necessary to block horizontal scroll due to background images */ } /** * Headlines */ h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { padding-bottom: calc(1 * var(--global--spacing-vertical)); word-break: keep-all; overflow-wrap: initial; hyphens: auto; } h1, .h1 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h2, .h2 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h3, .h3 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-family: var(--global--font-secondary); font-weight: 600; } h4, .h4 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-family: var(--global--font-secondary); font-weight: 600; } h5, .h5 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-family: var(--global--font-secondary); font-weight: 600; } h6, .h6 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); font-family: var(--global--font-secondary); font-weight: 600; } @media only screen and (min-width: 592px) { h1, .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } h2, .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h3, .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h4, .h4 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h5, .h5 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); } h6, .h6 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); } } /*p*/.lead { padding: 0; margin: 0; font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); font-weight: 600; } @media only screen and (min-width: 822px) { /*p*/.lead { padding-bottom: calc(2 * var(--global--spacing-vertical)); margin: 0; } } /** * Link Focus */ .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button), .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { text-decoration: none!important; background-color: var(--global--color-black); color: var(--global--color-white) !important; border-radius: 16px; outline-offset: 2px; outline: 2px dotted currentColor; } /** * Button */ .wp-block-buttons, .is-layout-flex .wp-block-buttons { gap: 8px; } .site .button, button, input[type=submit], input[type=reset], .wp-block-search .wp-block-search__button, .wp-block-button .wp-block-button__link, .wp-block-file a.wp-block-file__button, .wpcf7-submit { position: relative; z-index: 10; border-width: var(--button--border-width)!important; border-style: solid; border-color: transparent; border-radius: var(--button--border-radius); cursor: pointer; font-weight: var(--button--font-weight); font-family: var(--button--font-family); font-size: var(--button--font-size); line-height: 1.125; padding-top: calc(2 * var(--button--padding-vertical)); padding-right: var(--button--padding-horizontal); padding-bottom: calc(2 * var(--button--padding-vertical)); padding-left: var(--button--padding-horizontal); text-decoration: none; overflow: hidden; transition: all ease-out 0.25s; } .wp-block-button.is-style-outline>.wp-block-button__link, .wp-block-button .wp-block-button__link.is-style-outline { padding-top: var(--button--padding-vertical); padding-right: var(--button--padding-horizontal); padding-bottom: var(--button--padding-vertical); padding-left: 0; transition: all ease-out 0.25s; } .site .button:not(:hover):not(:active):not(.has-text-color), button:not(:hover):not(:active):not(.has-text-color), input[type=submit]:not(:hover):not(:active):not(.has-text-color), input[type=reset]:not(:hover):not(:active):not(.has-text-color), .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color), .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-gray-950); } .has-background .site .button:not(:hover):not(:active):not(.has-text-color), .has-background button:not(:hover):not(:active):not(.has-text-color), .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color), .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-gray-950); } .has-background .site .button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background input[type=submit]:not(:hover):not(:active):not(.has-text-color).has-background, .has-background input[type=reset]:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background, .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-gray-950); } .site .button:not(:hover):not(:active):not(.has-background), button:not(:hover):not(:active):not(.has-background), input[type=submit]:not(:hover):not(:active):not(.has-background), input[type=reset]:not(:hover):not(:active):not(.has-background), .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background), .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .site .button:hover, .site .button:active, button:hover, button:active, input[type=submit]:hover, input[type=submit]:active, input[type=reset]:hover, input[type=reset]:active, .wp-block-search .wp-block-search__button:hover, .wp-block-search .wp-block-search__button:active, .wp-block-button .wp-block-button__link:hover, .wp-block-button .wp-block-button__link:active, .wp-block-file a.wp-block-file__button:hover, .wp-block-file a.wp-block-file__button:active { background-color: transparent; border-color: transparent; color: var(--global--color-gray-950); } .site .button:focus, button:focus, input[type=submit]:focus, input[type=reset]:focus, .wp-block-search .wp-block-search__button:focus, .wp-block-button .wp-block-button__link:focus, .wp-block-file a.wp-block-file__button:focus, .wp-block-button.is-style-outline .wp-block-button__link:focus { /* padding-left: calc(0.5 * var(--global--spacing-vertical)); */ background-color: var(--global--color-black)!important; border-radius: var(--button--border-radius); color: var(--global--color-white)!important; outline-offset: 2px; outline: 2px dotted var(--global--color-black); } .wp-block-button .wp-block-button__link:focus:before, .wp-block-button.is-style-outline .wp-block-button__link:focus:before { background-color: var(--global--color-black) !important; color: var(--global--color-white); } .wp-block-button.is-style-outline .wp-block-button__link:focus:before { padding-left: calc(0.5 * var(--global--spacing-vertical)); } .site .button:disabled, button:disabled, input[type=submit]:disabled, input[type=reset]:disabled, .wp-block-search .wp-block-search__button:disabled, .wp-block-search .wp-block-search__button:disabled, .wp-block-button .wp-block-button__link:disabled, .wp-block-file a.wp-block-file__button:disabled { background-color: var(--global--color-gray-950); border-color: var(--global--color-gray-950); color: var(--button--color-text-active); } /* * Micro Classes */ /* Small */ small { display: block; margin-top: var(--global--spacing-vertical); color: var(--global--color-gray-700); } /* Add Border Radius */ .border-radius-10 { border-radius: var(--global--border-radius); overflow: hidden; } .border-radius-20 { border-radius: calc(2 * var(--global--border-radius)); overflow: hidden; } /* Add Box Height 100% (surrounding Column needs to be set to stretched height) */ .box-height-100 { height: 100%; } /* Show / Hide Mobile, Desktop, Backend */ .show-backend-only { display: none !important; } /* Hide element temporarily before element is either deleted or reactivated */ .screen-reader-text { } /* Base class, defined in twenty twenty-one theme */ /* Show-Hide Classes */ .show-desktop-only { display: block;} .show-mobile-only { display: none; } @media only screen and (max-width: 821px) { .show-desktop-only { display: none;} .show-mobile-only { display: block; } } /* Responsive Order */ @media only screen and (max-width: 821px) { .reverse-mobile-only.is-layout-flex { flex-direction: column-reverse !important; row-gap: 2rem; } } /* * BLOCK List (Check) */ ul.list-style-check { list-style-type: none; } ul.list-style-check > li { position: relative; } ul.list-style-check > li:before { content: '\f00c'; position: absolute; top: 0; margin-left: -32px; width: 32px; height: 32px; font-family: 'Font Awesome 7 Free'; font-weight: 900; line-height: var(--global--line-height-body); color: var(--global--color-gray-700); } a:focus ul.list-style-check > li:before { color: var(--global--color-white); } /* * BLOCK List (KPI) */ ul.list-style-kpi { display: inline-flex; justify-content: flex-start; flex-wrap: wrap; column-gap: 60px; row-gap: 12px; padding: 0; max-width: 100% !important; width: 100%; list-style-type: none; } @media only screen and (min-width: 482px) { ul.list-style-kpi { justify-content: space-around; } } ul.list-style-kpi > li { position: relative; padding-bottom: 0; } ul.list-style-kpi > li:before { content: '\f00c'; position: relative; margin-right: 8px; font-family: 'Font Awesome 7 Free'; font-weight: 900; line-height: var(--global--line-height-body); color: var(--global--color-red-300); } ul.list-style-kpi > li:nth-of-type(1):before { content: '\f015'; } ul.list-style-kpi > li:nth-of-type(2):before { content: '\f0f0'; } ul.list-style-kpi > li:nth-of-type(3):before { content: '\e533'; } /** * Block Options */ /* Full background-color */ .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: currentColor; line-height: 1.125; } /* Button without background color */ .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; color: var(--global--color-gray-950); } /* Hover & Active State */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { position: relative; background-color: var(--global--color-red-900) !important; color: var(--global--color-white) !important; text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; } /* Hover & Active State */ .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus { background-color: var(--global--color-black); color: var(--global--color-white); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:focus:before { background-color: var(--global--color-black)!important; color: var(--global--color-white); } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background), .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background { border-color: currentColor; } /* Outline style button */ .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-primary); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-gray-950); } .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-background:not(.has-text-color) { color: inherit; background-color: transparent !important; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: transparent; } .wp-block-button.is-style-outline .wp-block-button__link:hover, .wp-block-button.is-style-outline .wp-block-button__link:active, .has-background .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-background .wp-block-button.is-style-outline .wp-block-button__link:active { padding-left: calc(0.5 * var(--global--spacing-horizontal)); border-color: transparent !important; background-color: var(--global--color-red-900) !important; color: var(--global--color-white) !important; text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; } /* Button Outline Arrow Icon */ .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):before, .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):before, .has-background .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background:before, .wp-block-button.is-style-outline .wp-block-button__link:hover:before, .wp-block-button.is-style-outline .wp-block-button__link:active:before { content: '\f061'; position: relative; z-index: -10; display: inline-flex; justify-content: center; align-items: center; margin-right: calc(1.25 * var(--global--spacing-unit)); width: 40px; height: 40px; background-color: var(--global--color-red-900); border-radius: var(--global--border-radius); color: var(--global--color-white); font-family: 'Font Awesome 7 Free'; font-weight: 900; font-size: var(--global--font-size-md); line-height: 1.125; text-align:center; transition: all ease-out 0.25s; } .has-background .wp-block-button.is-style-outline.is-style-down .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):before, .wp-block-button.is-style-outline.is-style-down .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):before, .has-background .wp-block-button.is-style-outline.is-style-down .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background:before, .wp-block-button.is-style-outline.is-style-down .wp-block-button__link:hover:before, .wp-block-button.is-style-outline.is-style-down .wp-block-button__link:active:before { content: '\f063' !important; } .wp-block-button.is-style-outline .wp-block-button__link:hover:before, .wp-block-button.is-style-outline .wp-block-button__link:focus:before { } /* * COLUMNS, GROUPS, MEDIA-TEXT */ .site { margin-right: calc(0 * var(--global--spacing-horizontal)); margin-left: calc(0 * var(--global--spacing-horizontal)); } @media only screen and (min-width: 769px) { .site { margin-right: var(--global--spacing-horizontal); margin-left: var(--global--spacing-horizontal); } } .site-content { padding-top: calc(2 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical)); width: auto; background-color: var(--global--color-gray-50); border-radius: calc(4 * var(--global--border-radius)); overflow-x: clip; } @media only screen and (min-width: 1024px) { .site-content { border-radius: calc(4 * var(--global--border-radius)); padding-bottom: calc(4 * var(--global--spacing-vertical)); } } /* Startseite Teaser Condition */ .home .site-content { padding-top: 0; padding-bottom: calc(0.75 * var(--global--spacing-vertical)); } .home .site-content .site-main { margin-top: -16px; } @media only screen and (min-width: 482px) { .home .site-content { padding-top: 0; padding-bottom: calc(1 * var(--global--spacing-vertical)); } .home .site-content .site-main { margin-top: -12px; } } @media only screen and (min-width: 822px) { .home .site-content { padding-top: 0; padding-bottom: calc(1 * var(--global--spacing-vertical));} .home .site-content .site-main { margin-top: -10px; } } @media only screen and (min-width: 1024px) { .home .site-content { padding-top: calc(2 * var(--global--spacing-vertical)); padding-bottom: calc(2 * var(--global--spacing-vertical));} .home .site-content .site-main { margin-top: 0; } } .site-main { position: relative; padding-top: 0; padding-bottom: 0; /* overflow: hidden; */ } .site-main > article { } .site-main > article > *, .site-main > .not-found > *, .entry-content > *, [class*=inner-container] > *, .wp-block-template-part > *, .wp-block-post-template :where(li > *) { } .site-main > article > *:last-child, .site-main > .not-found > *:last-child, .entry-content > *:last-child, [class*=inner-container] > *:last-child, .wp-block-template-part > *:last-child, .wp-block-post-template :where(li > *):last-child { margin-bottom: 0!important; padding-bottom: 0; } .entry-content > .wp-block-group, .entry-content > .wp-block-media-text { margin-top: calc(5 * var(--global--spacing-unit)); margin-bottom: calc(5 * var(--global--spacing-unit)); padding-top: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(5 * var(--global--spacing-unit)); } .entry-content > .wp-block-group.has-background, .entry-content > .wp-block-media-text.has-background { margin-top: calc(5 * var(--global--spacing-unit)) !important; margin-bottom: 0; padding: calc(0 * var(--global--spacing-unit)); } .entry-content > .wp-block-group.has-background + .has-background { margin-top: 0; } .entry-content:first-child > .wp-block-group.has-background, .entry-content:first-child > .wp-block-media-text.has-background { margin-top: 0; } .site-main > article > .entry-content { padding-right: calc(2 * var(--global--spacing-unit)); padding-left: calc(2 * var(--global--spacing-unit)); } @media only screen and (min-width: 1141px) { .site-main > article > .entry-content { padding-right: 0; padding-left: 0; } } .post-thumbnail, .entry-content .wp-audio-shortcode, .entry-content>*:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce), *[class*=inner-container]>*:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) { max-width: var(--responsive--aligndefault-width); } body .is-layout-constrained > * + * { } body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { max-width: var(--responsive--aligndefault-width); margin-left: auto !important; margin-right: auto !important; } .wp-block-columns { display: flex; margin-bottom: 0; box-sizing: border-box; flex-wrap: wrap; align-items: normal!important; } .wp-block-columns .wp-block-column > * { margin-top: 0; margin-bottom: 0; } .wp-block-group.has-background { } @media only screen and (min-width: 482px) { .wp-block-group.has-background { } } @media (max-width: 821px) { .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column { flex-basis: 100%!important; } } body { font-size: var(--global--font-size-md); font-weight: 400; color: var(--global--color-gray-950); text-align: left; background-color: var(--global--color-background); } @media only screen and (min-width: 482px) { body { font-size: var(--global--font-size-md); } } body.single, body.single.custom-background { background-color: var(--global--color-white); } body .is-layout-flex { column-gap: calc(2 * var(--global--spacing-horizontal)); row-gap: calc(1 * var(--global--spacing-horizontal));; } p, ul, ol { padding-bottom: calc(1 * var(--global--spacing-vertical)); } ul > li, ol > li { padding-top: calc(0 * var(--global--spacing-vertical)); padding-bottom: calc(1 * var(--global--spacing-vertical)); } b, strong { font-weight: 600; color: var(--global--color-red-900); } /* * HEADER */ header#masthead { position: relative; z-index: 1000; margin-right: 0; margin-left: 0; max-width: 100%; } @media only screen and (min-width: 769px) { header#masthead { margin-right: var(--global--spacing-horizontal); margin-left: var(--global--spacing-horizontal);} } .site-topbar { /* position: sticky; top: 0; */ z-index: 1000; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 0; margin-top: 0; padding-top: calc(1 * var(--global--spacing-unit)); padding-right: calc(0.5 * var(--global--spacing-unit)); padding-bottom: calc(1 * var(--global--spacing-unit)); padding-left: calc(0.5 * var(--global--spacing-unit)); border-bottom: 1px solid var(--global--color-gray-200); font-size: var(--global--font-size-sm); line-height: var(--global--line-height-body); } @media only screen and (min-width: 769px) { .site-topbar { margin-top: calc(2 * var(--global--spacing-unit)); } } @media only screen and (min-width: 1200px) { .site-topbar { justify-content: space-between; } } /* .site-topbar.is-sticky { position: fixed; top: 0; margin-top: 0; margin-bottom: 0; margin-right: auto; margin-left: auto; width: 100%; box-shadow: rgba(55, 55, 55, 0.25) 0px -4px 24px; border-bottom-style: none; } */ .site-topbar a:link, .site-topbar a:visited, .site-topbar a:active { display: inline-flex; flex-direction: row; flex-wrap: nowrap; align-items: center; gap: calc(0.5 * var(--global--spacing-unit)); padding-top: var(--global--spacing-unit); padding-right: var(--global--spacing-unit); padding-bottom: var(--global--spacing-unit); padding-left: var(--global--spacing-unit); border-radius: var(--global--border-radius); font-weight: 400; text-decoration: none; letter-spacing: 0; color: var(--global--color-gray-950); } .site-topbar a:hover { text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; } .site-topbar a:focus { outline: 2px dotted var(--global--color-black)!important; } .site-topbar a:focus i, .site-topbar > div:last-of-type > a:last-of-type:focus > i { color: var(--global--color-white); } .site-topbar i { color: var(--global--color-gray-700); } .site-topbar > div:last-of-type > a:last-of-type > i { color: var(--global--color-red-900); } .site-topbar > div:last-of-type > a:last-of-type { color: var(--global--color-red-900); } @media only screen and (max-width: 481px) { .site-topbar > div:first-of-type > a:nth-of-type(2) { display: none; } } @media only screen and (max-width: 1023px) { .site-topbar > div:first-of-type > a:first-of-type { display: none; } .site-topbar > div:first-of-type > a:nth-of-type(2) > span { display: none; } } @media only screen and (max-width: 1199px) { .site-topbar > div:first-of-type > a:last-of-type { display: none; } } .site-header { display: flex; justify-content: flex-start!important; align-items: center; max-width: 100%; padding-top: calc(2 * var(--global--spacing-horizontal)); padding-right: 0; padding-bottom: calc(2 * var(--global--spacing-horizontal)); padding-left: 0; background-color: transparent; } @media only screen and (max-width: 782px) { .site-header { padding-top: calc(1 * var(--global--spacing-horizontal)); padding-bottom: calc(1 * var(--global--spacing-horizontal)); } } .admin-bar .site-header { top: 0; } @media only screen and (max-width: 782px) { .admin-bar .site-header { top: 46px; } } .site-branding { margin-right: 0; max-width: 220px; } @media only screen and (min-width: 482px) { .site-branding { max-width: 280px; } } /*h1*/.site-title > * { display: block; padding: calc(1.5 * var(--global--spacing-unit)); border-radius: var(--global--border-radius); font-size: var(--heading--font-size-h4); color: var(--global--color-gray-950); } /*p*/.site-title { padding-bottom: 0; } /*p*/.site-title a:link, /*p*/.site-title a:active, /*p*/.site-title a:visited { text-decoration: none; color: var(--global--color-gray-950); } /*p*/.site-title a:hover { background-color: var(--global--color-red-900); color: var(--global--color-white); text-decoration: underline; text-decoration-style: dotted; } /*p*/.site-title a:focus { outline-offset: 2px; outline: 2px dotted var(--global--color-black) !important; } /* Responsive Menu Toggle */ @media only screen and (max-width: 821px) { .menu-button-container { display: flex; justify-content: normal; align-items: center; gap: var(--global--spacing-horizontal); position: relative; z-index: 1000; right: 0; padding: calc(1.5 * var(--global--spacing-unit)); } .primary-navigation-open .menu-button-container { background-color: transparent; } .menu-button-container #primary-mobile-menu { display: flex; margin-left: auto; padding: 0; background-color: transparent; border: none; color: var(--primary-nav--color-link); } .menu-button-container #primary-mobile-menu .dropdown-icon .svg-icon, .menu-button-container .contact-icon { margin-left: 0; width: 48px !important; height: 48px !important; border-radius: var(--button--border-radius) !important; line-height: 2.1; text-align: center; } .primary-navigation { position: relative; display: block; top: auto; right: auto; width: auto; margin-right: 0; margin-left: auto; line-height: var(--global--line-height-body); } .primary-navigation-open .primary-navigation { position: relative; display: block; top: auto; right: auto; width: auto; line-height: var(--global--line-height-body); } .primary-navigation > .primary-menu-container { position: fixed; visibility: hidden; opacity: 0; overflow: initial; transform: none; top: 172px; height: 100vh; overflow-x: hidden; overflow-y: auto; display: flex; justify-content: center; padding: 0; background-color: var(--global--color-white); } .primary-navigation-open .primary-navigation > .primary-menu-container { position: fixed; top: 0; height: 100vH; visibility: visible; opacity: 1; transform: translateY(0); z-index: 499; } } @media only screen and (min-width: 822px) { .primary-navigation { margin-right: 0; margin-left: 0; width: 100%; } } @media only screen and (min-width: 1024px) { .primary-navigation { margin-right: 0; margin-left: auto; width: fit-content; } } /* Main Navigation Styles */ .primary-navigation > div > .menu-wrapper { display: flex; flex-direction: column; justify-content: center; flex-wrap: wrap; gap: var(--global--spacing-horizontal); list-style: none; position: relative; margin: 0; padding-left: 0; padding-top: 128px; padding-bottom: 0; max-width: none; } @media only screen and (min-width: 822px) { .primary-navigation > div > .menu-wrapper { flex-direction: row; justify-content: flex-start; padding-top: 0; } } .primary-navigation .primary-menu-container { margin-right: 0; margin-left: 0; } .primary-navigation .primary-menu-container > ul > .menu-item { justify-content: center; } .primary-navigation .primary-menu-container > ul > .menu-item > a { padding-top: calc(1.7 * var(--global--spacing-unit)); padding-left: calc(1.5 * var(--global--spacing-unit)); padding-bottom: calc(1.5 * var(--global--spacing-unit)); padding-right: calc(1.5 * var(--global--spacing-unit)); border-radius: var(--global--border-radius); text-align: center; } .primary-navigation .primary-menu-container > ul > li:last-of-type a { background-color: var(--global--color-red-900); color: var(--global--color-white); } .primary-navigation a:hover { background-color: var(--global--color-red-900); color: var(--global--color-white); } .primary-navigation a:focus { outline-offset: 2px; outline: 2px dotted var(--global--color-black) !important; } .primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child { text-decoration: none; border-bottom: 2px solid var(--global--color-red-900);} .primary-navigation .primary-menu-container > ul > li:last-of-type.current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child { text-decoration: none; border-bottom: 2px solid var(--global--color-red-300);} /* * PAGE Header */ .singular .entry-header { margin-bottom: calc(2 * var(--global--spacing-vertical)); padding-bottom: 0; padding-right: var(--global--spacing-horizontal); padding-left: var(--global--spacing-horizontal); border-bottom: none; text-align: center; } @media only screen and (min-width: 822px) { .singular .entry-header { margin-bottom: calc(4 * var(--global--spacing-vertical)); } } .singular .entry-header .entry-title { margin-top: calc(0 * var(--global--spacing-vertical)); margin-bottom: calc(0 * var(--global--spacing-vertical)); } @media only screen and (min-width: 822px) { .singular .entry-header .entry-title { margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(1 * var(--global--spacing-vertical)); padding-bottom: 0; } } .rank-math-breadcrumb { font-size: var(--global--font-size-sm); color: var(--global--color-gray-700); } .rank-math-breadcrumb p { padding-bottom: 0; } .rank-math-breadcrumb a { margin-right: calc(0.5 * var(--global--spacing-unit)); margin-left: calc(0.5 * var(--global--spacing-unit)); padding-right: calc(0.5 * var(--global--spacing-unit)); padding-left: calc(0.5 * var(--global--spacing-unit)); border-radius: 4px !important; font-weight: 600; color: var(--global--color-gray-950); } .rank-math-breadcrumb a:focus { outline-offset: 2px; outline: 2px dotted var(--global--color-black)!important; } .rank-math-breadcrumb .last { margin-right: calc(0.5 * var(--global--spacing-unit)); margin-left: calc(0.5 * var(--global--spacing-unit)); padding-right: calc(0.5 * var(--global--spacing-unit)); padding-left: calc(0.5 * var(--global--spacing-unit)); } /* * BLOCK Gallery */ .wp-block-gallery {} .wp-block-gallery > .wp-block-image { border-radius: calc(2 * var(--global--border-radius)); overflow: hidden; } @media (min-width: 600px) { .wp-block-gallery.has-nested-images.columns-3 figure.wp-block-image:not(#individual-image) { max-width: calc(33.33333% - var(--wp--style--unstable-gallery-gap, 16px)*.66667); width: calc(33.33333% - var(--wp--style--unstable-gallery-gap, 16px) * .66667); } } .wp-block-gallery.team > .wp-block-image img { aspect-ratio: auto 680 / 1024; } @media only screen and (min-width: 482px) { } @media only screen and (min-width: 769px) { } @media only screen and (min-width: 822px) { .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding: 0.75em; background: linear-gradient(0deg,#0009,#0000); text-shadow: 0 0 10px #000; font-size: var(--global--font-size-sm); line-height: 1.5; } } @media only screen and (min-width: 1024px) { .wp-block-gallery.has-nested-images figure.wp-block-image figcaption { padding: 1em; font-size: var(--global--font-size-md); } } /* * BLOCK Image */ /*figure*/.wp-block-image { position: relative; width: fit-content; } .wp-block-image > img { aspect-ratio: 1.125 / 1; object-fit: cover; border-radius: calc(2 * var(--global--border-radius)); } .wp-block-image.bg-bl:before { content: ''; position: absolute; left: -50px; bottom: -50px; z-index: -10; width: 320px; height: 320px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIwIiBoZWlnaHQ9IjMyMCIgdmlld0JveD0iMCAwIDMyMCAzMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIzMjAiIGhlaWdodD0iMzIwIiByeD0iMTI4IiBmaWxsPSIjRUJFNkQzIi8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-size: contain; } .wp-block-image.bg-tl:before { content: ''; position: absolute; left: -50px; top: -50px; z-index: -10; width: 320px; height: 320px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIwIiBoZWlnaHQ9IjMyMCIgdmlld0JveD0iMCAwIDMyMCAzMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIzMjAiIGhlaWdodD0iMzIwIiByeD0iMTI4IiBmaWxsPSIjRTFEQUJEIi8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-size: contain; } .wp-block-image.bg-tr:after { content: ''; position: absolute; right: -20px; top: -20px; z-index: -10; width: 160px; height: 160px; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIwIiBoZWlnaHQ9IjMyMCIgdmlld0JveD0iMCAwIDMyMCAzMjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxyZWN0IHdpZHRoPSIzMjAiIGhlaWdodD0iMzIwIiByeD0iMTI4IiBmaWxsPSIjRTFEQUJEIi8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-size: contain; } .wp-block-image.alignleft { display: contents; } .wp-block-image figcaption { font-size: var(--global--font-size-md); line-height: 1rem; color: var(--global--color-dark-blue-500); } .wp-block-image figcaption > strong { color: var(--global--color-white); } /* * BLOCK Blockquote */ .wp-block-quote {} .wp-block-quote:before { content: "“"; position: absolute; top: 16px; left: -4px; font-size: var(--global--font-size-xxl); font-style: italic; color: var(--global--color-red-300); } .wp-block-quote p:after { content: "”"; position: relative; top: 4px; font-size: var(--global--font-size-xxl); font-style: italic; line-height: 0.5; color: var(--global--color-red-300); } .wp-block-quote p { font-style: italic; } .wp-block-quote cite { margin-top: 0; } /* * BLOCK Teaser */ .teaser {} .teaser .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):before { content: '\f063' !important; } .teaser .wp-block-button.is-style-outline .wp-block-button__link:hover:before, .teaser .wp-block-button.is-style-outline .wp-block-button__link:focus:before { content: '\f063' !important; } /* * BLOCK Actionbar */ .actionbar.is-layout-flex { display: flex; flex-direction: row; column-gap: 8px !important; row-gap: 8px !important; } .actionbar > .wp-block-button { flex-grow: 1; flex-basis: 100%; line-height: 1; } @media only screen and (min-width: 482px) { .home .actionbar > .wp-block-button { flex-basis: 100%; } } @media only screen and (min-width: 1024px) { .home .actionbar > .wp-block-button { flex-basis: calc((100% - 24px)/4); } } @media only screen and (min-width: 482px) { .actionbar > .wp-block-button { flex-basis: calc((100% - 24px)/2); } } @media only screen and (min-width: 1024px) { .actionbar > .wp-block-button { flex-basis: calc((100% - 24px)/4); } } .actionbar > .wp-block-button > a { display: flex; justify-content: center; align-items: center; flex-wrap: nowrap; column-gap: 8px; } .actionbar > .wp-block-button > a:link:before, .actionbar > .wp-block-button > a:active:before, .actionbar > .wp-block-button > a:visited:before { content: ''; position: relative; display: inline-block; width: 24px; height: 24px; color: var(--global--color-red-300); font-family: 'Font Awesome 7 Free'; font-weight: 900; font-size: var(--global--font-size-md); } .actionbar > .wp-block-button > a:hover:before { color: var(--global--color-white); text-decoration-style: unset; } .actionbar > .wp-block-button:nth-of-type(1) > a:before { content: '\f073'; } .actionbar > .wp-block-button:nth-of-type(2) > a:before { content: '\f0f1'; } .actionbar > .wp-block-button:nth-of-type(3) > a:before { content: '\f15c'; } .actionbar > .wp-block-button:nth-of-type(4) > a:before { content: '\f0e0'; } .actionbar > .wp-block-button > a.has-red-900-background-color { color: var(--global--color-white) !important; } .actionbar > .wp-block-button > a.has-gray-100-background-color { color: var(--global--color-gray-950); } .actionbar > .wp-block-button > a.has-red-900-background-color:before { color: var(--global--color-red-300); } .actionbar > .wp-block-button > a.has-gray-100-background-color:before { color: var(--global--color-gray-300); } .actionbar > .wp-block-button > a.has-gray-100-background-color:hover:before, .actionbar > .wp-block-button > a.has-gray-100-background-color:focus:before { color: var(--global--color-white); } /* * BLOCK News Item */ /*a oder div */.news-item { border-radius: var(--global--border-radius); border-style: solid; border-width: 2px; border-color: var(--global--color-red-300); } /*a oder div */.news-item time { font-weight: var(--heading--font-weight-strong); } /*a oder div */.news-item time:before { content: '\f073'; position: relative; display: inline-block; width: 24px; height: 24px; color: var(--global--color-gray-900); font-family: 'Font Awesome 7 Free'; font-weight: 900; font-size: var(--global--font-size-md); } /* * BLOCK Service Item */ /*a*/.service-item { position: relative; z-index: 10; display: flex; flex-direction: column; gap: var(--global--spacing-vertical); margin-top: var(--global--spacing-vertical) !important; margin-bottom: var(--global--spacing-vertical) !important; height: 100%; width: 100%; border-left-style: solid; border-left-width: 4px; border-left-color: var(--global--color-red-300); text-decoration: none; transition: all ease-out 0.25s; overflow: hidden; outline-style: none; } .service-item:hover { outline-style: solid; outline-width: 4px; outline-color: var(--global--color-red-300); outline-offset: -4px; } .service-item:hover .wp-block-heading { text-decoration-style: dotted; text-decoration-line: none; text-underline-offest: 8px; } .service-item:focus { border-left-color: var(--global--color-gray-900); outline-offset: 2px; outline: 2px dotted var(--global--color-black)!important; } .service-item:focus .wp-block-heading { color: var(--global--color-white) !important; } /*a*/.service-item > *:last-child { margin-bottom: 0; padding-bottom: 0; } /*a*/.service-item:after { opacity: 0; visibility: hidden; content: '\f061'; position: absolute; bottom: -158px; right: -54px; display: flex; justify-content: center; align-items: center; width: 64px; height: 256px; background: var(--global--color-red-300); color: var(--global--color-red-900); font-family: 'Font Awesome 7 Free'; font-weight: 900; transform:rotate(45deg); transition: all ease-out 0.25s; } /*a*/.service-item:hover:after, /*a*/.service-item:focus:after { opacity: 1; visibility: visible; position: absolute; bottom: -100px; right: -4px; } /*a*/.service-item:focus:after { background: var(--global--color-gray-900); color: var(--global--color-white); } /* * BLOCK Alert */ .alert { padding-top: calc(2.5 * var(--global--spacing-unit)); padding-right: calc(2.5 * var(--global--spacing-unit)); padding-bottom: calc(2.5 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); border-radius: 12px; border: 2px solid var(--global--color-red-300); } .alert > *:first-child:before { content: '\f071'; position: relative; display: inline-block; margin-right: 8px; color: var(--global--color-gray-700); font-family: 'Font Awesome 7 Free'; font-weight: 900; line-height: var(--global--line-height-body); color: var(--global--color-red-900); } .alert > *:not(:first-child) { padding-left: 28px; font-size: var(--global--font-size-sm); } /* * BLOCK Contact Form 7 */ .wpcf7-form {} /* Form Groups and Headlines */ .wpcf7-form fieldset { margin-top: calc(2.5 * var(--global--spacing-unit)); margin-bottom: calc(2.5 * var(--global--spacing-unit)); padding-top: calc(0.666 * var(--global--spacing-vertical)); padding-right: calc(0.666 * var(--global--spacing-vertical)); padding-bottom: calc(0.666 * var(--global--spacing-vertical)); padding-left: calc(0.666 * var(--global--spacing-vertical)); border-radius: 12px; border: 2px solid var(--global--color-red-300); } @media only screen and (min-width: 482px) { .wpcf7-form fieldset { padding-top: calc(3.5 * var(--global--spacing-unit)); padding-right: var(--global--spacing-vertical); padding-bottom: calc(2 * var(--global--spacing-unit)); padding-left: var(--global--spacing-vertical); } } @media only screen and (min-width: 822px) { .wpcf7-form fieldset { padding-top: calc(3.5 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(4.5 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); } } .wpcf7-form fieldset legend { float: left; margin-bottom: calc(2.5 * var(--global--spacing-unit)); line-height: 1.15; font-size: var(--heading--font-size-h4); font-weight: 600; color: var(--global--color-red-900); } .wpcf7-form fieldset legend h2, .wpcf7-form fieldset legend h3 { display: contents; } .wpcf7-form fieldset legend:before { content: ''; position: relative; display: inline-block; margin-right: 8px; color: var(--global--color-gray-700); font-family: 'Font Awesome 7 Free'; font-weight: 900; line-height: var(--global--line-height-body); color: var(--global--color-red-900); } .wpcf7-form fieldset.message legend:before { content: '\f0e0'; } .wpcf7-form fieldset.transfer legend:before { content: '\f0f1'; } .wpcf7-form fieldset.medicine legend:before { content: '\f15c'; } .wpcf7-form fieldset.appointment legend:before { content: '\f073'; } .wpcf7-form fieldset.additional legend:before { content: '\f328'; } .wpcf7-form fieldset.contact legend:before { content: '\f007'; } .wpcf7-form fieldset.privacy legend:before { content: '\f023'; } .wpcf7-form fieldset.protection legend:before { content: '\f3ed'; } /* Form Miscellaneous */ .wpcf7-form br { display: none; } .wpcf7-form p { padding-bottom: 0; } .wpcf7-form a:link, .wpcf7-form a:active, .wpcf7-form a:visited { margin-right: calc(0.5 * var(--global--spacing-unit)); margin-left: calc(0.5 * var(--global--spacing-unit)); padding-right: calc(0.5 * var(--global--spacing-unit)); padding-left: calc(0.5 * var(--global--spacing-unit)); border-radius: 4px !important; } .wpcf7-form a:hover {} .wpcf7-form a:focus { outline-offset: 2px !important; outline: 2px dotted var(--global--color-black) !important; } /* Form Inputs and Labels */ .wpcf7-form label, .wpcf7-form .label { display: block; margin: 0; margin-top: calc(2.5 * var(--global--spacing-unit)); padding: 0; font-weight: 600; } .wpcf7-form fieldset label:first-of-type { margin-top: 0; } .wpcf7-form input[type=text], .wpcf7-form input[type=email], .wpcf7-form input[type=tel], .wpcf7-form input[type=date], .wpcf7-form select, .wpcf7-form textarea { margin: 0; padding: var(--global--spacing-unit) calc(1.5 * var(--global--spacing-unit)); width: 100%; max-height: 200px; background-color: var(--global--color-gray-50); border-radius: 12px; border: 2px solid var(--global--color-gray-200); letter-spacing: 0.15; color: var(--global--color-gray-950); } @media only screen and (min-width: 482px) { .wpcf7-form textarea { max-height: 120px; } } .wpcf7-form *::placeholder { font-style: italic; color: var(--global--color-gray-700); } /* Form Radio, Checkbox und Radio-/Checkbox-Gruppe */ .wpcf7-form .wpcf7-form-control.wpcf7-radio .wpcf7-list-item > label, .wpcf7-form .wpcf7-form-control.wpcf7-checkbox { display: flex; flex-direction: column; row-gap: 8px; column-gap: 40px; margin-top: 0; padding: calc(1.5 * var(--global--spacing-unit)); background-color: var(--global--color-gray-50); border-radius: 12px; border: 2px solid var(--global--color-gray-200); } @media only screen and (min-width: 1024px) { .wpcf7-form .wpcf7-form-control.wpcf7-radio .wpcf7-list-item > label, .wpcf7-form .wpcf7-form-control.wpcf7-checkbox { flex-direction: row; } } .wpcf7-form .wpcf7-form-control.wpcf7-radio .wpcf7-list-item > label { column-gap: 8px; margin-bottom: 8px; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.vertical { flex-direction: column; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays .wpcf7-list-item > label { display: flex; flex-direction: row; column-gap: 8px; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays .wpcf7-list-item-label { display: flex; flex-direction: column; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays .wpcf7-list-item-label:after, .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient .wpcf7-list-item-label:after { margin-top: -4px; width: fit-content; font-size: var(--global--font-size-sm); font-weight: 300; color: var(--global--color-gray-700); } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays > *:nth-of-type(1) .wpcf7-list-item-label:after { content: 'Vormittags und nachmittags'; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays > *:nth-of-type(2) .wpcf7-list-item-label:after { content: 'Vormittags und nachmittags'; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays > *:nth-of-type(3) .wpcf7-list-item-label:after { content: 'Nur vormittags'; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays > *:nth-of-type(4) .wpcf7-list-item-label:after { content: 'Vormittags und nachmittags'; } .wpcf7-form .wpcf7-form-control.wpcf7-checkbox.weekdays > *:nth-of-type(5) .wpcf7-list-item-label:after { content: 'Nur vormittags'; } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient { display: flex; justify-content: stretch; flex-direction: column; } @media only screen and (min-width: 1024px) { .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient { display: flex; justify-content: stretch; flex-direction: row; } } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient > * { width: 100%; } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient > * > label { display: flex; flex-direction: row; } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient .wpcf7-list-item-label { display: flex; flex-direction: column; } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient > *:nth-of-type(1) .wpcf7-list-item-label:after { content:'Sie wurden bereits bei uns behandelt'; } .wpcf7-form .wpcf7-form-control.wpcf7-radio.patient > *:nth-of-type(2) .wpcf7-list-item-label:after { content:'Sie sind zum ersten Mal in unserer Praxis'; } .wpcf7-form input[type=radio] { -webkit-appearance: none; -moz-appearance: none; position: relative; top: 5px; width: 25px; height: 25px; border-radius: 50%; border: 1px solid var(--global--color-gray-500); } .wpcf7-form input[type=checkbox] { -webkit-appearance: none; -moz-appearance: none; position: relative; top: 5px; width: 25px; height: 25px; border-radius: 4px; border: 1px solid var(--global--color-gray-500); } .wpcf7-form .wpcf7-list-item { margin-right: 0; margin-left: 0; } .wpcf7-form .wpcf7-list-item.first { margin-right: 0; margin-left: 0; } .wpcf7-form .wpcf7-form-control.wpcf7-radio .wpcf7-list-item { margin-right: 20px; } .wpcf7-form .wpcf7-list-item-label::before, .wpcf7-form .wpcf7-list-item-label::after { content: " "; display: inline-block; width: 8px; } /* Form Acceptance */ .wpcf7-form .wpcf7-acceptance > span { margin: 0; width: 100%; } .wpcf7-form .wpcf7-acceptance label { display: flex; gap: 8px; margin-top: calc(2.5 * var(--global--spacing-unit)) !important; padding: calc(1.5 * var(--global--spacing-unit)); background-color: var(--global--color-gray-50); border-radius: 12px; border: 2px solid var(--global--color-gray-200); } .wpcf7-form .wpcf7-acceptance .wpcf7-list-item-label { display: inline; width: calc(100% - 32px); font-weight: 400; } /* Form Image Captcha */ .wpcf7-form .captcha-image { padding: 0; border: none; text-align: left; } .wpcf7-form .captcha-image svg { width: 48px; height: 48px; } /* Form Error and Mandatory Handling */ .wpcf7-form .mandatory { color: var(--global--color-red-900); } .wpcf7-not-valid-tip { font-size: var(--global--font-size-sm); color: var(--global--color-red-900) !important; } input[type=text].wpcf7-not-valid, input[type=email].wpcf7-not-valid, input[type=tel].wpcf7-not-valid, input[type=date].wpcf7-not-valid { border: 2px dashed var(--global--color-red-900); } .wpcf7-not-valid input[type=chekcbox], .wpcf7-not-valid input[type=radio] { border: 2px dashed var(--global--color-red-900); } /* Form Checkbox */ input[type=checkbox]:checked { background-color: var(--global--color-gray-300); } @supports (-webkit-appearance:none) or (-moz-appearance:none) { input[type=checkbox]:after { content: ""; opacity: 0; display: block; left: 8px; top: 1px; position: absolute; width: 10px; height: 18px; border: 4px solid var(--global--color-gray-950); border-top: 0; border-left: 0; transform: rotate(45deg); } } input[type=radio]:before { content: ""; opacity: 0; display: block; left: 5px; top: 5px; position: absolute; width: 15px; height: 15px; border-radius: 50%; background: var(--global--color-gray-950); z-index: 10; } input[type=radio]:after { content: ""; opacity: 0; display: block; left: 0; top: 0; position: absolute; width: 25px; height: 25px; border-radius: 50%; background: var(--global--color-gray-950); } input[type=radio]:checked:before, input[type=radio]:checked:after { opacity: 1; } input[type=submit].wpcf7-form-control { background-color: var(--global--color-red-900) !important; color: var(--global--color-white) !important; } input[type=submit].wpcf7-form-control:disabled { background-color: var(--global--color-gray-100) !important; color: var(--global--color-gray-300) !important; } input[type=submit].wpcf7-form-control:hover { background-color: var(--global--color-yellow); text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; } input[type=submit].wpcf7-form-control:focus { background-color: var(--global--color-black) !important; border-radius: var(--button--border-radius); outline-offset: 2px; outline: 2px dotted var(--global--color-black); } /* Form Medicine Item */ .wpcf7-form .medicine-item { position: relative; margin-bottom: var(--global--spacing-vertical); padding: calc(2.5 * var(--global--spacing-unit)); background-color: var(--global--color-gray-50); border-radius: var(--global--border-radius); max-height: 500px; overflow: hidden; transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out, margin 0.4s ease-in-out; opacity: 1; } .wpcf7-form .medicine-item.hidden { max-height: 0; opacity: 0; margin-bottom: 0; padding: 0; overflow: hidden; } .wpcf7-form .medicine-item.hidden input, .wpcf7-form .medicine-item.hidden select, .wpcf7-form .medicine-item.hidden textarea, .wpcf7-form .medicine-item.hidden a, .wpcf7-form .medicine-item.hidden button { pointer-events: none; } .wpcf7-form .medicine-item strong { display: inline-block; margin-bottom: var(--global--spacing-vertical); padding: calc(0.5 * var(--global--spacing-unit)) calc(1.5 * var(--global--spacing-unit)); background-color: var(--global--color-gray-200); border-radius: 8px; font-size: var(--global--font-size-sm); color: var(--global--color-gray-950); } .wpcf7-form .medicine-item .delete-medicine-btn { position: absolute; top: 0; right: 0; margin-top: calc(2.5 * var(--global--spacing-unit)); margin-right: calc(1.5 * var(--global--spacing-unit)); margin-bottom: calc(2.5 * var(--global--spacing-unit)); margin-left: calc(1.5 * var(--global--spacing-unit)); padding: calc(0.5 * var(--global--spacing-unit)) calc(1.5 * var(--global--spacing-unit)); font-size: var(--global--font-size-sm); font-weight: 600; color: var(--global--color-red-900); } .wpcf7-form .add-medicine-btn:link, .wpcf7-form .add-medicine-btn:visited, .wpcf7-form .add-medicine-btn:active { margin: 0 !important; padding-top: calc(1 * var(--global--spacing-unit)) !important; padding-right: calc(2 * var(--global--spacing-unit)) !important; padding-bottom: calc(1 * var(--global--spacing-unit)) !important; padding-left: 0 !important; border-radius: var(--button--border-radius) !important; } .wpcf7-form .add-medicine-btn:before { content: '\2b' !important; } .wpcf7-form .add-medicine-btn:hover:before { padding-left: 10px; } /* * BLOCK Background-Colors and Paddings */ .site-main > article > * { margin-top: 0; margin-bottom: 0; } .wp-block-media-text .wp-block-media-text__content { padding: 0; } .wp-block-media-text.has-background, .wp-block-group.has-background { position: relative; } .wp-block-media-text.has-background:after, .wp-block-group.has-background:after { content:''; position: absolute; top: 0; right: -200%; z-index: -100; width: 200%; height: 100%; background-color: inherit; } .wp-block-media-text.has-background:before, .wp-block-group.has-background:before { content:''; position: absolute; top: 0; left: -200%; z-index: -100; width: 200%; height: 100%; background-color: inherit; } .wp-block-group > .wp-block-media-text.has-background:after, .wp-block-group > .wp-block-media-text.has-background:before { display: none; } .wp-block-media-text.border-radius-8.has-background:after, .wp-block-media-text.border-radius-8.has-background:before { display: none; } .wp-block-group.border-radius-8.has-background:after, .wp-block-group.border-radius-8.has-background:before { display: none; } /* * BLOCK CORNERS: OPTIONAL DESIGN CORNERS */ .wp-block-corner-container { position: absolute; margin-top: 0!important; margin-bottom: 0!important; margin-right: calc(-2*var(--global--spacing-unit)); margin-left: calc(-2*var(--global--spacing-unit)); padding-top: 0!important; padding-bottom: 0!important; width: 100%; height: 80px; } @media only screen and (min-width: 822px) { .wp-block-corner-container { height: 96px; } } @media only screen and (min-width: 1140px) { .wp-block-corner-container { margin-right: auto; margin-left: auto; } } .wp-block-corner-tr, .wp-block-corner-tl, .wp-block-corner-br, .wp-block-corner-bl { z-index: 1000; background-repeat: no-repeat; background-size: contain; } .wp-block-corner-tr { margin-top: -79px!important; transform: rotate(180deg); } @media only screen and (min-width: 822px) { .wp-block-corner-tr { margin-top: -94px!important; }} .wp-block-corner-tl { margin-top: -80px!important; } @media only screen and (min-width: 822px) { .wp-block-corner-tl { margin-top: -94px!important; }} .wp-block-corner-br { margin-top: -79px!important; transform: rotate(180deg); } @media only screen and (min-width: 822px) { .wp-block-corner-br { margin-top: -94px!important; }} .wp-block-corner-bl { margin-top: -1px!important; } @media only screen and (min-width: 822px) { .wp-block-corner-bl { margin-top: -1px!important; }} .wp-block-corner-beige-300 { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYwIiBoZWlnaHQ9IjEyOSIgdmlld0JveD0iMCAwIDE2MCAxMjkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTYwIDAuNzQ5OTg2TDAgMC43NUwxLjExOTAyZS0wNSAxMjguNzVDNS4wMTAwM2UtMDYgNTguMDU4IDU3LjMwNzYgMC43NTA0ODMgMTI4IDAuNzUwNDc3TDE2MCAwLjc1MDQ3NEwxNjAgMC43NDk5ODZaIiBmaWxsPSIjRTFEQUJEIi8+Cjwvc3ZnPgo="); } .wp-block-corner-beige-200 { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYwIiBoZWlnaHQ9IjEyOSIgdmlld0JveD0iMCAwIDE2MCAxMjkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTYwIDAuNzQ5OTg2TDAgMC43NUwxLjExOTAyZS0wNSAxMjguNzVDNS4wMTAwM2UtMDYgNTguMDU4IDU3LjMwNzYgMC43NTA0ODMgMTI4IDAuNzUwNDc3TDE2MCAwLjc1MDQ3NEwxNjAgMC43NDk5ODZaIiBmaWxsPSIjZWJlNmQzIi8+Cjwvc3ZnPgo="); } .wp-block-corner-beige-100 { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYwIiBoZWlnaHQ9IjEyOSIgdmlld0JveD0iMCAwIDE2MCAxMjkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTYwIDAuNzQ5OTg2TDAgMC43NUwxLjExOTAyZS0wNSAxMjguNzVDNS4wMTAwM2UtMDYgNTguMDU4IDU3LjMwNzYgMC43NTA0ODMgMTI4IDAuNzUwNDc3TDE2MCAwLjc1MDQ3NEwxNjAgMC43NDk5ODZaIiBmaWxsPSIjRjVGMkUyIi8+Cjwvc3ZnPgo="); } /* * BLOCK OPTIONS: FONT COLOR IF BACKGROUND */ .entry-content > *:not(.has-background) { color: var(--global--color-gray-950); } .entry-content > *:not(.has-background) h1, .entry-content > *:not(.has-background) h2, .entry-content > *:not(.has-background) h3, .entry-content > *:not(.has-background) h4 { color: var(--global--color-gray-950); } .entry-content > *:not(.has-background) h5, .entry-content > *:not(.has-background) h6 { color: var(--global--color-gray-950); } /* * BLOCK OPTIONS: FONT SIZE */ :root .is-extra-small-text, :root .has-extra-small-font-size { font-size: var(--global--font-size-base); } :root .is-small-text, :root .has-small-font-size { font-size: var(--global--font-size-xs); } :root .is-regular-text, :root .has-regular-font-size, :root .is-normal-font-size, :root .has-normal-font-size, :root .has-medium-font-size { font-size: var(--global--font-size-sm); } :root .is-large-text, :root .has-large-font-size { font-size: var(--global--font-size-md); line-height: var(--global--line-height-heading); } :root .is-larger-text, :root .has-larger-font-size, :root .is-extra-large-text, :root .has-extra-large-font-size { font-size: var(--global--font-size-lg); line-height: var(--global--line-height-heading); } :root .is-huge-text, :root .has-huge-font-size { font-size: var(--global--font-size-xl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } :root .is-gigantic-text, :root .has-gigantic-font-size { font-size: var(--global--font-size-xxl); line-height: var(--global--line-height-heading); font-weight: var(--heading--font-weight-page-title); } /* * FOOTER */ /*footer*/.site-footer, .no-widgets .site-footer { margin: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; width: auto; max-width: 100%; font-size: var(--footer--font-size); } @media only screen and (min-width: 769px) { /*footer*/.site-footer, .no-widgets .site-footer { padding-right: 0; padding-left: 0; } } .site-footer .widget-area { display: grid; align-items: flex-end; column-gap: 60px; row-gap: 0; grid-template-columns: 1fr; margin-top: calc(2 * var(--global--spacing-vertical)); margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-bottom: 0; max-width: 100%; color: var(--footer--color-text); font-size: var(--footer--font-size); font-family: var(--footer--font-family); } .site-footer .widget-area > *:nth-child(1) { grid-column: auto; } .site-footer .widget-area > *:nth-child(2) { grid-column: auto; } .site-footer .widget-area > *:nth-child(3) { grid-column: auto; } .site-footer .widget-area /*dl*/.opening-hours, .site-footer .widget-area /*div*/.widget_nav_menu { margin-block-start: 0; } @media only screen and (min-width: 769px) { .site-footer .widget-area { margin-right: var(--global--spacing-horizontal); margin-left: var(--global--spacing-horizontal); } } @media only screen and (min-width: 1140px) { .site-footer .widget-area { display: grid; align-items: flex-end; column-gap: 60px; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; } .site-footer .widget-area > *:nth-child(1) { grid-column: 1 / span 2; } .site-footer .widget-area > *:nth-child(2) { grid-column: 1; } .site-footer .widget-area > *:nth-child(3) { grid-column: 2; } .site-footer .widget-area > *:nth-child(3) > *, .site-footer .widget-area > *:nth-child(3) > * > * { margin-left: unset !important; margin-right: unset !important; } } @media only screen and (min-width: 1440px) { .site-footer .widget-area { display: grid; align-items: flex-end; column-gap: 60px; grid-template-columns: calc((100% - 120px) * 0.25) calc((100% - 120px) * 0.35) calc((100% - 120px) * 0.40); grid-template-rows: none; } .site-footer .widget-area > *:nth-child(1) { grid-column: unset; } .site-footer .widget-area > *:nth-child(2) { grid-column: unset; } .site-footer .widget-area > *:nth-child(3) { grid-column: unset; } } @media only screen and (min-width: 1600px) { .site-footer .widget-area { column-gap: 120px; grid-template-columns: calc((100% - 240px) * 0.25) calc((100% - 240px) * 0.35) calc((100% - 240px) * 0.40); } } .site-footer > *, .widget-area > * { margin-top: 0; margin-bottom: calc(2 * var(--global--spacing-vertical)); } @media only screen and (max-width: 768px) { .site-footer .widget-area > *:nth-child(1) > div { margin: 0 auto; max-width: var(--responsive--aligndefault-width); } } @media only screen and (max-width: 1139px) { .site-footer .widget-area > *:nth-child(1) > div { margin: 0 auto; max-width: var(--responsive--aligndefault-width); } .site-footer .widget-area > *:nth-child(2) > div { margin: 0 auto; max-width: var(--responsive--aligndefault-width); } } .site-footer .widget-area .wp-block-image > img { aspect-ratio: initial; border-radius: unset; } .site-footer .widget h3 { margin-right: 0 !important; margin-left: 0 !important; padding-right: calc(1.5 * var(--global--spacing-unit)); padding-bottom: 0; padding-left: calc(1.5 * var(--global--spacing-unit)); font-size: var(--heading--font-size-h4); line-height: var(--heading--line-height-h4); } @media only screen and (min-width: 1024px) { .site-footer .widget h3 { } } .site-footer p { padding-bottom: 0; } .site-footer strong { display: block; padding-top: calc(1 * var(--global--spacing-unit)); padding-right: calc(1.5 * var(--global--spacing-unit)); padding-bottom: calc(1 * var(--global--spacing-unit)); padding-left: calc(1.5 * var(--global--spacing-unit)); line-height: var(--global--line-height-body); color: var(--global--color-red-900); } .site-footer /*ul*/.address { margin: 0 !important; padding-top: 0; padding-right: calc(1.5 * var(--global--spacing-unit)); padding-bottom: 0; padding-left: calc(1.75 * var(--global--spacing-unit)); width: fit-content; list-style-type: none; } @media only screen and (min-width: 769px) { .site-footer /*ul*/.address { padding-right: calc(1.5 * var(--global--spacing-unit)); padding-left: calc(1.5 * var(--global--spacing-unit)); } } .site-footer /*ul*/.address > li { position: relative; padding-top: var(--global--spacing-unit); padding-bottom: var(--global--spacing-unit); padding-left: calc(1.5 * var(--global--spacing-unit)); line-height: var(--widget--line-height-list); } .site-footer /*ul*/.address > li:before { position: relative; left: calc(-1.25 * var(--global--spacing-unit)); display: inline-block; width: 16px; color: var(--global--color-gray-700); font-family: 'Font Awesome 7 Free'; font-weight: 900; line-height: var(--global--line-height-body); } .site-footer /*ul*/.address > li:nth-child(1):before { content: '\f3c5'; } .site-footer /*ul*/.address > li:nth-child(2):before { content: '\f095'; } .site-footer /*ul*/.address > li:nth-child(3):before { content: '\f0e0'; } .site-footer /*ul*/.address > li > a:link, .site-footer /*ul*/.address > li > a:active, .site-footer /*ul*/.address > li > a:visited { text-decoration: none; } .site-footer /*ul*/.address > li > a:hover { text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; } .site-footer /*dl*/.opening-hours { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; margin-left: auto !important; margin-right: auto !important; max-width: var(--responsive--aligndefault-width); } @media only screen and (min-width: 769px) { .site-footer /*dl*/.opening-hours { margin-left: 0 !important; margin-right: 0 !important; max-width: 540px; } } .site-footer /*dl*/.opening-hours > dt, .site-footer /*dl*/.opening-hours > dd { /* display: inline-block; */ margin:0; padding-top: var(--global--spacing-unit); padding-right: calc(1.5 * var(--global--spacing-unit)); padding-bottom: var(--global--spacing-unit); padding-left: calc(1.5 * var(--global--spacing-unit)); width: 40%; font-weight: 400; } .site-footer /*dl*/.opening-hours > dd { width: 57.5%; text-align: right; } .site-footer /*ul*/.menu {} .site-footer /*ul*/.menu > li { display: inline-flex; } .site-footer /*ul*/.menu > li a:link, .site-footer /*ul*/.menu > li a:visited, .site-footer /*ul*/.menu > li a:active { position: relative; z-index: 10; display: inline-block; padding-top: calc(1 * var(--global--spacing-unit)); padding-right: calc(1.5 * var(--global--spacing-unit)); padding-bottom: calc(1 * var(--global--spacing-unit)); padding-left: calc(1.5 * var(--global--spacing-unit)); border-radius: 12px !important; text-align: center; line-height: var(--global--line-height-body); text-decoration: none; transition: all ease-out 0.25s; overflow: hidden; } .site-footer /*ul*/.menu > li a:link:after, .site-footer /*ul*/.menu > li a:visited:after, .site-footer /*ul*/.menu > li a:active:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -10; opacity: 0; visibility: hidden; background-color: var(--global--color-red-900); color: var(--global--color-white); transition: all ease-out 0.25s; /* transform: translateX(-101%); */ } .site-footer /*ul*/.menu > li a:hover { text-decoration-style: dotted; text-decoration-line: underline; text-decoration-underline-offest: 3px; color: var(--global--color-white); } .site-footer /*ul*/.menu > li a:hover:after { /* transform: translateX(0); */ opacity: 1; visibility: visible; } .site-footer /*ul*/.menu > li a:focus { outline-offset: 2px; outline: 2px dotted var(--global--color-black)!important; } @media only screen and (min-width: 769px) { .site-footer /*ul*/.menu > li a:link { text-align: left; } } .site-footer /*ul*/.legal-area { display: flex; justify-content: space-between; flex-direction: column; gap: 0; margin-top: 0; margin-bottom: var(--global--spacing-vertical); padding-right: var(--global--spacing-horizontal); padding-left: var(--global--spacing-horizontal); list-style-type: none; border-top: 1px solid var(--global--color-gray-200); } @media only screen and (min-width: 1140px) { .site-footer /*ul*/.legal-area { flex-direction: row; gap: var(--global--spacing-unit); } } .site-footer /*ul*/.legal-area > li > span { display: block; visibility: hidden; height: 1px; } @media only screen and (min-width: 1140px) { .site-footer /*ul*/.legal-area > li > span { display: inline; visibility: initial; height: auto; } } .site-footer /*ul*/.legal-area > li:first-of-type { display: block; margin: 0; padding-top: calc(4 * var(--global--spacing-unit)); padding-right: var(--global--spacing-unit); padding-bottom: calc(1 * var(--global--spacing-unit)); padding-left: var(--global--spacing-unit); text-align: center; } @media only screen and (min-width: 1140px) { .site-footer /*ul*/.legal-area > li:first-of-type { padding-top: calc(2 * var(--global--spacing-unit)); padding-bottom: calc(2 * var(--global--spacing-unit)); } } .site-footer /*ul*/.legal-area > li > ul { display: flex; justify-content: center; flex-direction: row; gap: var(--global--spacing-unit); margin: 0; padding: 0; list-style-type: none; } .site-footer /*ul*/.legal-area > li > ul > li { position: relative; } .site-footer /*ul*/.legal-area a:before { content: '•'; position: absolute; left: -8px; width: 8px; color: var(--global--color-gray-700); line-height: var(--global--line-height-body); } .site-footer /*ul*/.legal-area > li > ul > li:first-of-type > a:before { content: ''; } .site-footer /*ul*/.legal-area a:link, .site-footer /*ul*/.legal-area a:visited, .site-footer /*ul*/.legal-area a:active { display: block; margin: calc(1 * var(--global--spacing-unit)); padding-top: var(--global--spacing-unit); padding-right: calc(2 * var(--global--spacing-unit)); padding-bottom: var(--global--spacing-unit); padding-left: calc(2 * var(--global--spacing-unit)); border-radius: 12px !important; text-decoration: none; color: var(--global--color-gray-950); } .site-footer /*ul*/.legal-area a:hover { text-decoration-style: dotted; text-decoration-line: underline; text-underline-offset: 3px; } .site-footer /*ul*/.legal-area a:focus { outline-offset: 2px; outline: 2px dotted var(--global--color-black)!important; } /* * FONTS */ /* nunito-sans-regular - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Nunito Sans'; font-style: normal; font-weight: 400; src: url('assets/webfonts/nunito-sans-v18-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('assets/webfonts/nunito-sans-v18-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ } /* nunito-sans-600 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Nunito Sans'; font-style: normal; font-weight: 600; src: url('assets/webfonts/nunito-sans-v18-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('assets/webfonts/nunito-sans-v18-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ }