/* Theme Name: PIO.CARE Theme URI: https://www.pio.care Description: Theme for PIO.CARE 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 only screen and (max-width: 481px) {} @media only screen and (max-width: 781px) {} @media only screen and (max-width: 821px) {} @media only screen and (max-width: 951px) {} @media only screen and (max-width: 1199px) {} @media only screen and (min-width: 482px) {} @media only screen and (min-width: 592px) {} @media only screen and (min-width: 652px) {} @media only screen and (min-width: 782px) {} @media only screen and (min-width: 822px) {} @media only screen and (min-width: 1200px) {} @media screen and (min-width: 600px) {} /* * VARIABLES */ :root { /* Font Family */ --global--font-primary: var(--font-headings, 'Rubik', -apple-system, BlinkMacSystemFont, 'Segoe UI'); --global--font-secondary: var(--font-base, 'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Oxygen-Sans, Ubuntu, 'Helvetica Neue', sans-serif); /* Font Size */ --global--font-size-base: 1rem; /* 16px */ --global--font-size-xs: 1rem; /* 16px */ --global--font-size-sm: 1.125rem; /* 18px */ --global--font-size-md: 1.25rem; /* 20px */ --global--font-size-lg: 1.5rem; /* 24px */ --global--font-size-xl: 2.25rem; /* 36px */ --global--font-size-xxl: 3rem; /* 48px */ --global--font-size-xxxl: 3.75rem; /* 60px */ --global--font-size-page-title: var(--global--font-size-xxxl); --global--letter-spacing: 0.05rem; /* Line Height */ --global--line-height-body: 1.80; --global--line-height-heading: 1.25; --global--line-height-page-title: 1.25; /* Headings */ --heading--font-family: var(--global--font-primary); --heading--font-size-h4: var(--global--font-size-md); --heading--font-size-h3: var(--global--font-size-lg); --heading--font-size-h2: var(--global--font-size-xl); --heading--font-size-h1: var(--global--font-size-xxxl); --heading--letter-spacing-h4: var(--global--letter-spacing); --heading--letter-spacing-h3: var(--global--letter-spacing); --heading--letter-spacing-h2: var(--global--letter-spacing); --heading--letter-spacing-h1: var(--global--letter-spacing); --heading--line-height-h4: var(--global--line-height-heading); --heading--line-height-h3: var(--global--line-height-heading); --heading--line-height-h2: var(--global--line-height-heading); --heading--line-height-h1: var(--global--line-height-page-title); --heading--font-style: normal; --heading--font-weight: 500; --heading--font-weight-page-title: 500; --heading--font-weight-strong: 500; /* Colors */ --global--color-black: #000000; --global--color-white: #ffffff; --global--color-gray-900: #3D3D3D; --global--color-gray-800: #464646; --global--color-gray-700: #525252; --global--color-gray-600: #656565; --global--color-gray-500: #7C7C7C; --global--color-gray-400: #989898; --global--color-gray-300: #BDBDBD; --global--color-gray-200: #DCDCDC; --global--color-gray-100: #EFEFEF; --global--color-gray-50: #FAFAFA; --global--color-green-900: #254A1D; --global--color-green-800: #2C5A21; --global--color-green-700: #347124; --global--color-green-600: #408F2A; --global--color-green-500: #4B9D34; --global--color-green-400: #76C95F; --global--color-green-300: #A6E095; --global--color-green-200: #CEEEC4; --global--color-green-100: #E7F7E1; --global--color-green-50: #F4FBF2; --global--color-blue-500: #0DAEE0; --global--color-red: #a62811; --global--color-primary: var(--global--color-gray-900); /* H1, H2 */ --global--color-secondary: var(--global--color-gray-800); /* Body text color, site title, footer text color. */ /* Used for borders (separators) */ /* Spacing */ --global--spacing-unit: 4px; --global--spacing-measure: unset; --global--spacing-horizontal: 8px; --global--spacing-vertical: 8px; /* Radius */ --global--border-radius: 4px; /* Buttons */ --button--color-text: rgb(var(--global--color-white)); --button--color-text-hover: rgb(var(--global--color-white)); --button--color-text-active: rgb(var(--global--color-white)); --button--color-background: rgb(var(--global--color-green-500)); --button--color-background-active: rgb(var(--global--color-green-400)); --button--font-family: var(--global--font-secondary); --button--font-size: var(--global--font-size-base); --button--font-weight: 500; --button--line-height: 1.15; --button--border-radius: 8px; --button--padding-vertical: 12px; --button--padding-horizontal: calc(1.66667 * var(--button--padding-vertical)); /* entry */ --entry-header--color: rgb(var(--global--color-primary)); --entry-header--color-link: currentColor; --entry-header--color-hover: rgb(var(--global--color-primary-hover)); --entry-header--color-focus: rgb(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: rgb(var(--global--color-primary)); --branding--color-link: rgb(var(--global--color-primary)); --branding--color-link-hover: rgb(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-h4); --branding--title--font-weight: normal; --branding--title--text-transform: uppercase; --branding--description--font-family: var(--global--font-secondary); --branding--description--font-size: var(--global--font-size-sm); --branding--logo--max-width: 320px; --branding--logo--max-height: 80px; --branding--logo--max-width-mobile: 200px; --branding--logo--max-height-mobile: 80px; /* 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-xs); --primary-nav--font-size-sub-menu: var(--global--font-size-xs); --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-xs); --primary-nav--font-style: normal; --primary-nav--font-style-sub-menu-mobile: normal; --primary-nav--font-weight: 500; --primary-nav--font-weight-button: 500; --primary-nav--color-link: var(--global--color-green-800); --primary-nav--color-link-hover: var(--global--color-white); --primary-nav--color-text: var(--global--color-green-800); --primary-nav--padding: calc(2 * var(--global--spacing-unit)); --primary-nav--border-color: var(--global--color-green-800); /* Footer */ --footer--color-text: var(--global--color-gray-800); --footer--color-link: var(--global--color-gray-800); --footer--color-link-hover: var(--global--color-gray-800); --footer--font-family: var(--global--font-secondary); --footer--font-size: var(--global--font-size-xs); } /* ========================================================================================================== */ /* ========================================================================================================== */ /* ========================================================================================================== */ /* Misc ========================================================================== */ /* RESPONSIVE Order */ @media only screen and (max-width: 821px) { .reverse-mobile-only.is-layout-flex { flex-direction: column-reverse !important; row-gap: 2rem; } } /* 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-desktop-only { display: inherit !important;} .show-tablet-only { display: none !important;} .show-mobile-only { display: none !important; } @media only screen and (max-width: 1023px) { .show-desktop-only { display: none !important; } .show-tablet-only { display: inherit !important; } .show-mobile-only { display: none !important; } } @media only screen and (max-width: 1199px) { .show-desktop-only { display: none !important; } .show-tablet-only { display: none !important; } .show-mobile-only { display: inherit !important; } } /* Add Border Radius */ .border-radius-8 { border-radius: calc(5 * var(--global--border-radius)); overflow: hidden; } .border-radius-top-right-8 { border-top-right-radius: calc(5 * var(--global--border-radius)); overflow: hidden; } .border-radius-bottom-right-8 { border-bottom-right-radius: calc(5 * var(--global--border-radius)); overflow: hidden; } .border-radius-16 { border-radius: calc(10 * var(--global--border-radius)); overflow: hidden; } .edit-link { position: relative; width: 100%; } .edit-link > .post-edit-link { position: absolute; right: 0; bottom: 0; z-index: 99999; padding: calc( 3 * var(--global--spacing-unit)); background-color: rgb(var(--global--color-white)); border-radius: var(--global--border-radius); box-shadow: 0 0 20px 12px rgba(var(--global--color-grey-900), 0.12); } /* * text-underline-offset doesn't work in Chrome at all 👎 * But looks nice in Safari/Firefox, so let's keep it and * maybe Chrome will support it soon. */ a { margin-left: calc(-0.5 * var(--global--spacing-unit)); margin-right: calc(-0.5 * var(--global--spacing-unit)); padding-top: calc(1 * var(--global--spacing-unit)); padding-right: calc(1 * var(--global--spacing-unit)); padding-bottom: calc(1 * var(--global--spacing-unit)); padding-left: calc(1 * var(--global--spacing-unit)); cursor: pointer; color: var(--global--color-primary); text-underline-offset: 3px; text-decoration-skip-ink: all; } a:hover { text-decoration-style: dotted; text-decoration-skip-ink: none; } .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { /* Only visible in Windows High Contrast mode */ outline: 2px dotted transparent; outline-offset: 2px; text-decoration: underline 1px dotted currentColor; text-decoration-skip-ink: none; transition: all 0.25s ease-in-out; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) { color: rgb(var(--global--color-white)); text-decoration: none; background: var(--global--color-grey-900); outline-style: dotted; outline-width: 2px; outline-offset: 1px; outline-color: var(--global--color-gray-900); border-top-right-radius: var(--global--border-radius); border-bottom-right-radius: var(--global--border-radius); border-bottom-left-radius: var(--global--border-radius); border-top-left-radius: var(--global--border-radius); transition: all 0.25s ease-in-out; } .has-background-white .site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) .meta-nav { color: rgb(var(--global--color-white)); } p { margin-block-start: 0 ; margin-block-end: 0 ; padding-top: calc(0 * var(--global--spacing-unit)); padding-bottom: calc(5 * var(--global--spacing-unit)); width: 100%; line-height: var(--wp--typography--line-height, var(--global--line-height-body)); } p.has-background { padding: var(--global--spacing-unit); } p.has-text-color a { color: var(--global--color-primary); } p.lead, .entry-content > p.lead { padding-top: calc(0 * var(--global--spacing-unit)); padding-bottom: calc(8 * var(--global--spacing-unit)); font-size: var(--global--font-size-md); font-weight: 500; } a:focus { outline-style: dotted; outline-width: 2px; outline-offset: 1px; outline-color: #020617 !important; } .entry-content ul, .entry-content ol { padding-top: calc( 0 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); } @media only screen and (min-width: 822px) { .entry-content ul, .entry-content ol { padding-top: calc( 2.5 * var(--global--spacing-unit)); padding-right: calc(10 * var(--global--spacing-unit)); padding-bototm: calc( 2.5 * var(--global--spacing-unit)); padding-left: calc(10 * var(--global--spacing-unit)); } } .entry-content ul > li, .entry-content ol > li { padding-top: calc(2.5 * var(--global--spacing-unit)); padding-bottom: calc(2.5 * var(--global--spacing-unit)); } /*figure*/.profile { margin: 0; margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0; margin-inline-end: 0; } /*figure*/.profile img { aspect-ratio: 1 / 1; object-fit: cover; object-position: top; border-radius: 50%; } /** * Responsive Styles */ /** * Required Variables */ /** * 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: calc(100% - 8 * var(--global--spacing-horizontal)); --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)), 800px); --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)), 800px); --responsive--alignwide-width: min(calc(100vw - 8 * var(--global--spacing-horizontal)), 1360px); } } /** * Headlines H1 to H6 */ h1, .h1, .widget h1, .widget .h1, h2, .h2, .widget h2, .widget .h2, h3, .h3, .widget h3, .widget .h3, h4, .h4, .widget h4, .widget .h4, h5, .h5, .widget h5, .widget .h5, h6, .h6, .widget h6, .widget .h6 { clear: both; margin-top: 0; margin-bottom: 0; padding-top: calc(10 * var(--global--spacing-unit)); font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); padding-bottom: 0; word-break: keep-all; overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; color: var(--global--color-gray-900); } h1, .h1, .widget h1, .widget .h1 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h2, .h2, .widget h2, .widget .h2 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h3, .h3, .widget h3, .widget .h3 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h4, .h4, .widget h4, .widget .h4 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-weight: var(--heading--font-weight-strong); padding-top: calc(5 * var(--global--spacing-unit)); } h5, .h5, .widget h5, .widget .h5 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); font-weight: var(--heading--font-weight-strong); padding-top: calc(5 * var(--global--spacing-unit));} h6, .h6, .widget h6, .widget .h6 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); font-weight: var(--heading--font-weight-strong); padding-top: calc(5 * var(--global--spacing-unit));} @media only screen and (min-width: 482px) { h1, .h1, .widget h1, .widget .h1 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h2, .h2, .widget h2, .widget .h2 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h3, .h3, .widget h3, .widget .h3 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); } h4, .h4, .widget h4, .widget .h4 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-weight: var(--heading--font-weight-strong); } h5, .h5, .widget h5, .widget .h5 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-weight: 600; } h6, .h6, .widget h6, .widget .h6 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-weight: 600; } } @media only screen and (min-width: 952px) { h1, .h1, .widget h1, .widget .h1 { font-size: var(--heading--font-size-h1); letter-spacing: var(--heading--letter-spacing-h1); line-height: var(--heading--line-height-h1); } h2, .h2, .widget h2, .widget .h2 { font-size: var(--heading--font-size-h2); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); } h3, .h3, .widget h3, .widget .h3 { font-size: var(--heading--font-size-h3); letter-spacing: var(--heading--letter-spacing-h3); line-height: var(--heading--line-height-h3); } h4, .h4, .widget h4, .widget .h4 { font-size: var(--heading--font-size-h4); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); font-weight: var(--heading--font-weight-strong); } h5, .h5, .widget h5, .widget .h5 { font-size: var(--heading--font-size-h5); letter-spacing: var(--heading--letter-spacing-h5); line-height: var(--heading--line-height-h5); font-weight: 600; } h6, .h6, .widget h6, .widget .h6 { font-size: var(--heading--font-size-h6); letter-spacing: var(--heading--letter-spacing-h6); line-height: var(--heading--line-height-h6); font-weight: 600; } } .widget > h3:last-child, .widget > .h3:last-child { padding-top: 0; padding-bottom: 0; } .wp-block-group h1, .wp-block-group .h1, .wp-block-group h2, .wp-block-group .h2, .wp-block-group h3, .wp-block-group .h3, .wp-block-group h4, .wp-block-group .h4, .wp-block-group h5, .wp-block-group .h5, .wp-block-group h6, .wp-block-group .h6 { padding-top: 0; } h1 strong, .h1 strong, .widget h1 strong, .widget .h1 strong, h2 strong, .h2 strong, .widget h2 strong, .widget .h2 strong, h3 strong, .h3 strong, .widget h3 strong, .widget .h3 strong, h4 strong, .h4 strong, .widget h4 strong, .widget .h4 strong, h5 strong, .h5 strong, .widget h5 strong, .widget .h5 strong, h6 strong, .h6 strong, .widget h6 strong, .widget .h6 strong { font-weight: var(--heading--font-weight-strong); } h1 a, .h1 a, .widget h1 a, .widget .h1 a, h2 a, .h2 a, .widget h2 a, .widget .h2 a, h3 a, .h3 a, .widget h3 a, .widget .h3 a, h4 a, .h4 a, .widget h4 a, .widget .h4 a, h5 a, .h5 a, .widget h5 a, .widget .h5 a, h6 a, .h6 a, .widget h6 a, .widget .h6 a { color: rgb(var(--global--color-green-500)); text-decoration: none; } /** * BACK BUTTON */ .wp-block-button.back.is-style-outline > .wp-block-button__link, .wp-block-button.back .wp-block-button__link.is-style-outline { padding-top: 9px; padding-bottom: 9px; } .wp-block-button.back .wp-block-button__link:before { content: '\f060'; margin-right: 20px; font-family: 'Font Awesome 6 Free'; font-weight: 900; line-height: 1.5; text-align: center; } /** * SHOW MORE BUTTON */ .wp-block-buttons.btn-show-more { position: absolute; bottom: -40px; left: 0; right: 0; z-index: 1000; display: flex; flex-direction: row; justify-content: center; align-items: center; } .wp-block-buttons.btn-show-more > .wp-block-button > .wp-block-button__link { margin: auto; display: flex; width: auto; flex-direction: row; padding: .5rem 2rem; vertical-align: text-bottom; font-weight: 500; border-width: 0 40px; border-style: solid; border-image-source: url(https://pio.care/wp-content/themes/pio.care/assets/images/btn-show-more.png); border-image-slice: 0 40 fill; border-image-repeat: stretch; height: 40px; background-color: transparent !important; font-size: 16px; line-height: 24px; color: #464646 !important; } .wp-block-buttons.btn-show-more > .wp-block-button > .wp-block-button__link:hover { background-color: transparent !important; color: #464646 !important; } .wp-block-buttons.btn-show-more > .wp-block-button > .wp-block-button__link:before { content: ''; position: relative; margin-right: 8px; width: 20px; height: 20px; background-image: url("data:image/svg+xml;base64,PHN2ZyBhcmlhLWhpZGRlbj0idHJ1ZSIgZm9jdXNhYmxlPSJmYWxzZSIgZGF0YS1wcmVmaXg9ImZhcyIgZGF0YS1pY29uPSJjaGV2cm9uLWRvd24iIGNsYXNzPSJzdmctaW5saW5lLS1mYSBmYS1jaGV2cm9uLWRvd24gdy01IGgtNSBtci0yIiByb2xlPSJpbWciIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDUxMiA1MTIiPjxwYXRoIGZpbGw9ImN1cnJlbnRDb2xvciIgZD0iTTIzMy40IDQwNi42YzEyLjUgMTIuNSAzMi44IDEyLjUgNDUuMyAwbDE5Mi0xOTJjMTIuNS0xMi41IDEyLjUtMzIuOCAwLTQ1LjNzLTMyLjgtMTIuNS00NS4zIDBMMjU2IDMzOC43IDg2LjYgMTY5LjRjLTEyLjUtMTIuNS0zMi44LTEyLjUtNDUuMyAwcy0xMi41IDMyLjggMCA0NS4zbDE5MiAxOTJ6Ij48L3BhdGg+PC9zdmc+IA=="); } /** * BLOCK BUTTON */ .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 { border: 1px solid 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: var(--button--line-height); padding: var(--button--padding-vertical) var(--button--padding-horizontal); text-decoration: none; } .wpcf7-submit { border: none; color: var(--global--color-white)!important; } .wp-block-button.is-style-outline>.wp-block-button__link, .wp-block-button .wp-block-button__link.is-style-outline { padding: var(--button--padding-vertical) var(--button--padding-horizontal); border: 1px solid; } .site .button.has-large-font-size, button.has-large-font-size, input[type=submit].has-large-font-size, input[type=reset].has-large-font-size, .wp-block-search.has-large-font-size .wp-block-search__button, .wp-block-button.has-large-font-size .wp-block-button__link, .wp-block-file.has-large-font-size a.wp-block-file__button, .wpcf7-submit.has-large-font-size { font-size: var(--global--font-size-md)!important; } .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-green-500); } .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-white); } .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-white); } .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: var(--global--color-green-500); } .has-background .site .button:not(:hover):not(:active):not(.has-background), .has-background button:not(:hover):not(:active):not(.has-background), .has-background input[type=submit]:not(:hover):not(:active):not(.has-background), .has-background input[type=reset]:not(:hover):not(:active):not(.has-background), .has-background .wp-block-search .wp-block-search__button:not(:hover):not(:active):not(.has-background), .has-background .wp-block-button .wp-block-button__link:not(:hover):not(:active):not(.has-background), .has-background .wp-block-file a.wp-block-file__button:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-green-500); } .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: var(--global--color-green-400); border-color: transparent; color: var(--global--color-white); } .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 { border-radius: var(--button--border-radius); outline-offset: 2px; outline: 2px dotted var(--global--color-green-500); } .site .button.has-orange-500-background-color:focus, button.has-orange-500-background-color:focus, input[type=submit].has-orange-500-background-color:focus, input[type=reset].has-orange-500-background-color:focus, .wp-block-search .wp-block-search__button.has-orange-500-background-color:focus, .wp-block-button .wp-block-button__link.has-orange-500-background-color:focus, .wp-block-file a.wp-block-file__button.has-orange-500-background-color:focus { border-radius: var(--button--border-radius); outline-offset: 2px; outline: 2px dotted var(--global--color-green-500); } .wp-block-button.is-style-outline .wp-block-button__link:focus { outline: 2px dotted currentColor; } .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-grey-100); border-color: var(--global--color-grey-100); color: var(--button--color-text-active); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-white); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-green-500); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background { color: var(--global--color-green-500); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color):focus, .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-text-color).has-background:focus { background-color: var(--global--color-white) !important; border-color: var(--global--color-white); color: var(--global--color-grey-900); outline: 2px dotted var(--global--color-white); opacity: 1; } .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-green-500); } .has-background .wp-block-button:not(.is-style-outline) .wp-block-button__link:not(:hover):not(:active):not(.has-background) { background-color: var(--global--color-green-500); } .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .wp-block-button:not(.is-style-outline) .wp-block-button__link:active { border-color: transparent !important; background-color: var(--global--color-green-700) !important; color: var(--global--color-white) !important; } .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: var(--global--color-gray-300); } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active).has-pioniere-primary-500-background-color { background-color: transparent !important; border-color: var(--global--color-green-500) !important; color: var(--global--color-green-500) !important; } .wp-block-button.is-style-outline .wp-block-button__link:not(:hover):not(:active):not(.has-text-color) { color: var(--global--color-gray-800); } .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-800); } .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: var(--global--color-gray-50); } .wp-block-button.is-style-outline .wp-block-button__link:hover, .wp-block-button.is-style-outline .wp-block-button__link:active { background-color: var(--global--color-green-700) !important; border-color: var(--global--color-green-700) !important; color: var(--global--color-white) !important; } .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 { border-color: transparent !important; background-color: var(--global--color-gray-50) !important; color: var(--global--color-gray-800) !important; } .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:hover, .has-text-color .wp-block-button.is-style-outline .wp-block-button__link:active { color: var(--local--color-background, var(--global--color-background)) !important; } .wp-block-button .is-style-squared .wp-block-button__link { border-radius: 0; } .is-style-outline .wp-block-button__link[style*=radius]:focus, .wp-block-button a.wp-block-button__link[style*=radius]:focus { border-radius: var(--button--border-radius); outline-offset: 2px; outline: 2px dotted var(--button--color-background); } /* * BLOCK Image */ .wp-block-image { display: block; overflow:hidden; } .wp-block-image.border-radius-8 > * { border-radius: calc(5 * var(--global--border-radius)); overflow: hidden; } .wp-block-image.vertical-stretch { height: 100%; } .wp-block-image.vertical-stretch > * { height: 100% !important; background-size: cover; object-fit: cover; } .wp-block-image.alignleft { display: contents; } .wp-block-image figcaption { font-size: var(--global--font-size-base); line-height: 1rem; color: var(--global--color-gray-800); } /* * BLOCK Media-Text */ .wp-block-media-text { gap: 20px; padding: 0 calc(10 * var(--global--spacing-unit)); } .wp-block-media-text:first-of-type { padding-top: calc(10 * var(--global--spacing-unit)); } .wp-block-media-text:last-of-type { padding-bottom: calc(10 * var(--global--spacing-unit)); } .wp-block-media-text .wp-block-media-text__media { max-width: 240px; margin: 0 auto; } @media only screen and (min-width: 601px) { .wp-block-media-text .wp-block-media-text__media { max-width: none; } } .wp-block-media-text .wp-block-media-text__content { text-align: center; } @media only screen and (min-width: 601px) { .wp-block-media-text .wp-block-media-text__content { text-align: inherit; } } /* * BLOCK TEASER (Homepage) */ .teaser { margin-left: 0 !important; margin-right: 0 !important; max-width: 100%; border-bottom-right-radius: calc(10* var(--global--spacing-unit)); outline-width: 8px; outline-color: var(--global--color-white); outline-style: solid; } @media only screen and (min-width: 822px) { .teaser { outline-style: none; } } .teaser:before { content: ''; position: absolute; top: -2.5rem; right: 0; z-index: -10; width: 2.5rem; height: 2.5rem; background-color: var(--global--color-white); } .teaser:after { content: ''; position: absolute; bottom: -3rem; left: 0; width: 2.5rem; height: 2.5rem; border-top-left-radius: 2.5rem; background-color: var(--global--color-gray-100); box-shadow: -5px -10px 0px 5px #fff; } @media only screen and (min-width: 822px) { .teaser:after { bottom: -2.5rem; } } .teaser .wp-block-columns.alignwide, .teaser .wp-block-columns.alignfull { column-gap: 40px; } .teaser .wp-block-image { position: relative; overflow: visible; } @media only screen and (max-width: 951px) { .teaser .wp-block-image { max-width: 360px; } } .teaser .wp-block-image:before { content: ''; position: absolute; left: 40px; bottom: -64px; width: 80%; height: 80%; background-color: var(--global--color-blue-500); border-radius: calc(5* var(--global--spacing-unit)); } @media only screen and (max-width: 951px) { .teaser .wp-block-image:before { max-width: 360px; } } .teaser .wp-block-image:after { content: ''; position: absolute; bottom: -32px; right: -40px; width: 80%; height: 80%; background-color: var(--global--color-green-500); border-radius: calc(5* var(--global--spacing-unit)); mix-blend-mode: multiply; } @media only screen and (max-width: 951px) { .teaser .wp-block-image:after { max-width: 360px; } } .teaser img { position: relative; z-index: 10; border-radius: calc(5 * var(--global--spacing-unit)); } @media only screen and (max-width: 481px) { .teaser img { max-width: 100%; } } @media only screen and (max-width: 951px) { .teaser img { max-width: 360px; } } .teaser h1 { margin: 0; padding: 0; text-align: left; } @media only screen and (max-width: 951px) { .teaser h1 { text-align: center; } } /* * BLOCK NOTICE BOX (Hinweise im Inhaltsbereich) */ .notice-box { margin-top: calc(10 * var(--global--spacing-unit)) !important; margin-bottom: calc(10 * var(--global--spacing-unit)) !important; background-color: rgb(var(--global--color-green-400)); border-radius: calc(1.5 * var(--global--border-radius)); color: rgb(var(--global--color-white)); } .notice-box > *:first-child, .notice-box .wp-block-column > *:first-child { margin-top: 0; padding-top: 0; } .notice-box > *:last-child, .notice-box .wp-block-column > *:last-child { margin-bottom: 0; padding-bottom: 0; } /* * BLOCK EMBED (YouTube...) */ .wp-block-embed { padding-top: calc(5 * var(--global--spacing-unit)); border-radius: calc(3 * var(--global--spacing-unit)); overflow: hidden; } .wp-block-embed iframe { border-radius: calc(3 * var(--global--spacing-unit)); } /* * BLOCK TABLE */ .wp-block-table table { table-layout: auto; font-style: normal!important; } .wp-block-table table th, .wp-block-table table td { vertical-align: top; border-bottom: 1px solid var(--global--color-gray-200); } .wp-block-table table thead tr th { font-weight: 700!important; } .wp-block-table table tr th:first-of-type, .wp-block-table table tr td:first-of-type { width: auto; font-weight: 700; } @media (min-width: 822px) { .wp-block-table table tr th:first-of-type, .wp-block-table table tr td:first-of-type { width: 280px; } } .wp-block-table table tr th:not(:first-of-type), .wp-block-table table tr td:not(:first-of-type) { width: 120px; font-weight: 300; text-align: center; } @media (min-width: 822px) { .wp-block-table table tr th:not(:first-of-type), .wp-block-table table tr td:not(:first-of-type) { width: auto; text-align: left; } } .wp-block-table table td strong { display: none; } @media (min-width: 822px) { .wp-block-table table td strong { display: inline; font-weight: 300; } } /* * BLOCK GALLERY */ .wp-block-gallery { padding-top: calc(5 * var(--global--spacing-unit)); } .wp-block-gallery > figure { border-radius: calc(3 * var(--global--spacing-unit)); overflow: hidden; } /* * BLOCK NAVIGATION PAGINATION */ .pagination, .comments-pagination { margin-top: 0; margin-bottom: 0; padding-top: calc(10 * var(--global--spacing-unit)); } .pagination .nav-links > *, .comments-pagination .nav-links > * { margin-top: 0; margin-right: var(--global--spacing-unit); margin-bottom: 0; margin-left: var(--global--spacing-unit); padding-top: 0; padding-right: calc(3 * var(--global--spacing-unit)); padding-bottom: 0; padding-left: calc(3 * var(--global--spacing-unit)); font-family: var(--global--font-secondary); font-size: var(--global--font-size-md); font-weight: 500; line-height: 2.25; color: rgb(var(--global--color-green-500)); } .pagination .nav-links > *.current, .comments-pagination .nav-links > *.current { text-decoration: none; color: rgb(var(--global--color-grey-900)); background-color: rgb(var(--global--color-white)); border-radius: var(--global--border-radius); } .pagination .nav-links > *:not(.dots):not(.current):hover, .comments-pagination .nav-links > *:not(.dots):not(.current):hover { text-decoration-style: none; color: rgb(var(--global--color-green-200)); } /* * BLOCK LIST LINKS */ /*ul*/.link-list { margin-top: calc(4 * var(--global--spacing-unit)); margin-bottom: calc(4 * var(--global--spacing-unit)); padding: 0 !important; } /*ul*/.link-list > li { border-bottom: 1px solid rgb(var(--global--color-grey-100)); } /*ul*/.link-list > li:last-of-type { border-bottom: none; } /*ul*/.link-list > li > a:link, /*ul*/.link-list > li > a:hover, /*ul*/.link-list > li > a:active, /*ul*/.link-list > li > a:visited { display: inline-block; width: 100%; padding-top: calc(3 * var(--global--spacing-unit)); padding-right: calc(2 * var(--global--spacing-unit)); padding-bottom: calc(3 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); line-height: 1.35; font-weight: 500; text-decoration: none; text-indent: -12px; color: rgb(var(--global--color-green-200)); transition: padding-left 0.25s ease-in-out; } /*ul*/.link-list > li > a:hover, /*ul*/.link-list > li > a:focus { padding-left: calc(6 * var(--global--spacing-unit)); } /* * BLOCK TABLE COMPARISON */ /*figure*/.wp-block-table {} /*figure*/.wp-block-table table { font-size: var(--global--font-size-base); font-style: italic; line-height: calc(var(--global--line-height-body) / 1.3); border-style: hidden; border-color: rgb(var(--global--color-gray-100)); } /*figure*/.wp-block-table thead { font-style: initial; border-bottom: 1px solid rgb(var(--global--color-gray-100)); } /*figure*/.wp-block-table th, /*figure*/.wp-block-table td { padding-top: calc(2 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-bottom: calc(2 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); border: 1px solid rgb(var(--global--color-gray-100)); } /*figure*/.wp-block-table.comparison td:not(:nth-of-type(1)) { position: relative; z-index: 0; } /*figure*/.wp-block-table.comparison td:not(:nth-of-type(1)):not(:empty):before, /*figure*/.wp-block-table.comparison td:not(:nth-of-type(1)):empty:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index:100; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMyAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMxLjU0NjkgNS45NTMxMkMzMi40NjA5IDYuNzk2ODggMzIuNDYwOSA4LjI3MzQ0IDMxLjU0NjkgOS4xMTcxOUwxMy41NDY5IDI3LjExNzJDMTIuNzAzMSAyOC4wMzEyIDExLjIyNjYgMjguMDMxMiAxMC4zODI4IDI3LjExNzJMMS4zODI4MSAxOC4xMTcyQzAuNDY4NzUgMTcuMjczNCAwLjQ2ODc1IDE1Ljc5NjkgMS4zODI4MSAxNC45NTMxQzIuMjI2NTYgMTQuMDM5MSAzLjcwMzEyIDE0LjAzOTEgNC41NDY4OCAxNC45NTMxTDExLjkyOTcgMjIuMzM1OUwyOC4zODI4IDUuOTUzMTJDMjkuMjI2NiA1LjAzOTA2IDMwLjcwMzEgNS4wMzkwNiAzMS41NDY5IDUuOTUzMTJaIiBmaWxsPSIjNDhEMzQ2Ii8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-position: center; background-color: rgb(var(--global--color-grey-50)); } /*figure*/.wp-block-table.comparison td:not(:nth-of-type(1)):empty:before { background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMyAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI3LjA0NjkgMjMuOTUzMUMyNy45NjA5IDI0Ljc5NjkgMjcuOTYwOSAyNi4yNzM0IDI3LjA0NjkgMjcuMTE3MkMyNi42MjUgMjcuNTM5MSAyNi4wNjI1IDI3Ljc1IDI1LjUgMjcuNzVDMjQuODY3MiAyNy43NSAyNC4zMDQ3IDI3LjUzOTEgMjMuODgyOCAyNy4xMTcyTDE2LjUgMTkuNzM0NEw5LjA0Njg4IDI3LjExNzJDOC42MjUgMjcuNTM5MSA4LjA2MjUgMjcuNzUgNy41IDI3Ljc1QzYuODY3MTkgMjcuNzUgNi4zMDQ2OSAyNy41MzkxIDUuODgyODEgMjcuMTE3MkM0Ljk2ODc1IDI2LjI3MzQgNC45Njg3NSAyNC43OTY5IDUuODgyODEgMjMuOTUzMUwxMy4yNjU2IDE2LjVMNS44ODI4MSA5LjExNzE5QzQuOTY4NzUgOC4yNzM0NCA0Ljk2ODc1IDYuNzk2ODggNS44ODI4MSA1Ljk1MzEyQzYuNzI2NTYgNS4wMzkwNiA4LjIwMzEyIDUuMDM5MDYgOS4wNDY4OCA1Ljk1MzEyTDE2LjUgMTMuMzM1OUwyMy44ODI4IDUuOTUzMTJDMjQuNzI2NiA1LjAzOTA2IDI2LjIwMzEgNS4wMzkwNiAyNy4wNDY5IDUuOTUzMTJDMjcuOTYwOSA2Ljc5Njg4IDI3Ljk2MDkgOC4yNzM0NCAyNy4wNDY5IDkuMTE3MTlMMTkuNjY0MSAxNi41NzAzTDI3LjA0NjkgMjMuOTUzMVoiIGZpbGw9IiNFMERFREUiLz4KPC9zdmc+Cg=="); } /** * BLOCK VITA */ .entry-content /*ul*/.vita { position: relative; list-style-type: none; padding-top: calc(5*var(--global--spacing-unit)); padding-right: calc(5*var(--global--spacing-unit)); padding-bottom: calc(5*var(--global--spacing-unit)); padding-left: calc(5*var(--global--spacing-unit)); } .entry-content /*ul*/.vita:before { content: ''; position: absolute; top: 60px; left: 52px; width: 1px; height: calc(100% - 150px); border-left: 2px dotted rgb(var(--global--color-grey-100)); } @media only screen and (min-width: 482px) { .entry-content /*ul*/.vita:before { height: calc(100% - 100px); } } .entry-content /*ul*/.vita > li { position: relative; padding-top: calc(0*var(--global--spacing-unit)); padding-bottom: calc(3*var(--global--spacing-unit)); padding-left: calc(22*var(--global--spacing-unit)); } .entry-content /*ul*/.vita > li > mark { /* Timestamp */ position: absolute; top: 28px; left: 0px; display: flex; flex-direction: column; justify-content: center; padding-bottom: calc(1*var(--global--spacing-unit)); width: 64px; height: 76px; font-family: var(--global--font-primary); font-weight: 300; text-align: center; line-height: 1.35; color: rgb(var(--global--color-white))!important; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOTYiIGhlaWdodD0iMTA5IiB2aWV3Qm94PSIwIDAgOTYgMTA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC4xNzk5NDcgMzQuOTY1N0MwLjA2OTA4NTcgMjkuMDkwMSAzLjE4ODE2IDIzLjYyNjYgOC4zMDQxOCAyMC43MzQ5TDQwLjU2NzMgMi40OTkyMkM0NS40OTk4IC0wLjI4ODY5MyA1MS41Mzg4IC0wLjI2MDEwMSA1Ni40NDQ3IDIuNTc0MzhMODguMDA0NCAyMC44MDg5QzkyLjk1MjQgMjMuNjY3NyA5NiAyOC45NDgzIDk2IDM0LjY2MjhWNzIuNDUxOEM5NiA3Ny45Nzk4IDkzLjE0NjQgODMuMTE2MiA4OC40NTI4IDg2LjAzNjdMNTYuOTgwMyAxMDUuNjJDNTEuODA1MSAxMDguODQgNDUuMjQ5OCAxMDguODQgNDAuMDc0NiAxMDUuNjJMOC40MzUyOSA4NS45MzI5QzMuODMyNzQgODMuMDY5MSAwLjk5MzIyNyA3OC4wNjk2IDAuODkwOTY3IDcyLjY0OThMMC4xNzk5NDcgMzQuOTY1N1oiIGZpbGw9IiMwMDc1N0IiLz4KPC9zdmc+Cg==); background-repeat: no-repeat; background-size: contain; } /* * BLOCK EXPERT ITEM */ .expert-item-list { } .expert-item-list ul { padding: 0; } /*a*/.expert-item { display: block; width: 100%; height: 100%; padding-top: calc(2.5*var(--global--spacing-unit))!important; padding-bottom: calc(2.5*var(--global--spacing-unit))!important; text-decoration: none; } /*a*/.expert-item /*h3*/.wp-block-post-title { margin-bottom: calc(2.5*var(--global--spacing-unit)); padding-top: 0; min-height: 72px; color: rgb(var(--global--color-green-500)); } /*a*/.expert-item /*h3*/.wp-block-post-excerpt { margin-top: 0; margin-bottom: 0; color: rgb(var(--global--color-gray-500)); } /*a*/.expert-item /*h3*/.wp-block-post-excerpt p { padding-top: 0; } /*a*/.expert-item:focus .wp-block-post-title, /*a*/.expert-item:focus .wp-block-post-excerpt { color: rgb(var(--global--color-white)); } /* * BLOCK PAGE ITEM */ /* Page Item within Loop Query Block */ .wp-block-query /*ul*/.page-item-list { gap: calc(15*var(--global--spacing-unit)); padding-left: 0; padding-right: 0; } .wp-block-query /*ul*/.page-item-list a:focus h3 { color: rgb(var(--global--color-white)); } .wp-block-query /*ul*/.page-item-list h3 { /* H3 in loop query yis the same as .page-item-content */ display: -webkit-box; margin-top: 0; margin-bottom: calc(6*var(--global--spacing-unit)); padding-bottom: 0; color: rgb(var(--global--color-green-500)); text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .page-item-list.is-layout-flow {} .page-item-list.is-layout-flow > article:first-of-type > a { margin-top: calc(10 * var(--global--spacing-unit)); } .wp-block-post-template.page-item-list-loop.is-flex-container, .page-item-list-loop.is-layout-flow { clear: both; flex-direction: row; flex-wrap: wrap!important; gap: calc(15 * var(--global--spacing-unit))!important; align-items: normal!important; } @media (min-width: 822px) { .wp-block-post-template.page-item-list-loop.is-flex-container, .page-item-list-loop.is-layout-flow { clear: both; flex-direction: row; flex-wrap: nowrap!important; gap: calc(15 * var(--global--spacing-unit))!important; } } .wp-block-post-template.page-item-list-loop.is-flex-container.is-flex-container.columns-3>li, .page-item-list-loop.is-layout-flow > li { } @media (max-width: 821px) { .wp-block-post-template.page-item-list-loop.is-flex-container.is-flex-container.columns-3>li, .page-item-list-loop.is-layout-flow > li { flex-basis: 100%!important; } } @media (min-width: 822px) { .wp-block-post-template.page-item-list-loop.is-flex-container.is-flex-container.columns-3>li, .page-item-list-loop.is-layout-flow > li { flex-basis: auto!important; } } .page-item-list-loop.is-layout-flow > li > a { flex-direction: column; } /* Nummerierte Liste (Anleitung, Checkliste) */ .page-item-list.is-numbered { counter-reset: numbered-list; } .page-item-list.is-numbered > .page-item { padding-left: initial; } @media only screen and (min-width: 482px) { .page-item-list.is-numbered > .page-item { padding-left: calc(32px + 80px + 32px) !important; } } .page-item-list.is-numbered > .page-item:before { counter-increment: numbered-list; content: counter(numbered-list, decimal-leading-zero); position: relative; width: 80px; height: 80px; background-color: var(--global--color-green-100); border-radius: calc(2 * var(--global--border-radius)); font-family: var(--global--font-primary); font-weight: var(--heading--font-weight-page-title); font-size: var(--global--font-size-xl); line-height: 2.25; text-align: center; color: var(--global--color-green-500); } @media only screen and (min-width: 482px) { .page-item-list.is-numbered > .page-item:before { position: absolute; top: 32px; left: 32px;} } .page-item-list.is-numbered > .page-item > .wp-block-heading { padding-top: calc(6 * var(--global--spacing-unit)); } /*a*/.page-item { display: flex; overflow: hidden; margin-bottom: calc(10 * var(--global--spacing-unit)); padding: 0; background-color: var(--global--color-white); border-radius: calc(5 * var(--global--border-radius)); text-decoration: none; } /*a*/.page-item:focus > .page-item-content > .page-item-header > h2.h3 { color: rgb(var(--global--color-white)); } .page-item.vertical { flex-direction: column; } @media only screen and (max-width: 781px) { .page-item.vertical { margin-bottom: 0; } } .page-item.vertical > .page-item-image, .page-item.horizontal > .wp-block-post-featured-image { flex-basis: 100%; max-height: 215px; } @media only screen and (max-width: 781px) { .page-item.vertical > .page-item-image { } } .page-item.vertical > .page-item-content { flex-basis: 100%; } .page-item.vertical > .page-item-image > img, .page-item.vertical > .wp-block-post-featured-image > img { max-width: 100%; height: auto; min-height: 215px; max-height: 280px; object-fit: cover; overflow: hidden; } @media only screen and (max-width: 781px) { .page-item.vertical > .page-item-image > img { width: 100%; max-height: inherit; } } .page-item.horizontal { flex-direction: row; } @media only screen and (max-width: 781px) { .page-item.horizontal { flex-direction: column; } } .page-item.horizontal > .page-item-image, .page-item.horizontal > .wp-block-post-featured-image { flex-basis: 40%; max-height: 100%; } .page-item.horizontal > .page-item-content { flex-basis: 60%; } .page-item.horizontal > .page-item-image > img, .page-item.horizontal > .wp-block-post-featured-image > img { width: 100%; max-width: 100%; height: 100%; min-height: 215px; max-height: 280px; object-fit: cover; overflow: hidden; } .page-item > .page-item-content { padding-top: calc(6 * var(--global--spacing-unit)); padding-right: calc(8 * var(--global--spacing-unit)); padding-bottom: calc(6 * var(--global--spacing-unit)); padding-left: calc(8 * var(--global--spacing-unit)); } .page-item-list-loop.is-layout-flow > li > a > h3 { display: -webkit-box; /* Loop Item */ margin-top: 0; /* Loop Item */ margin-bottom: calc(6 * var(--global--spacing-unit)); padding-top: calc(6 * var(--global--spacing-unit)); padding-right: calc(8 * var(--global--spacing-unit)); padding-left: calc(8 * var(--global--spacing-unit)); color: rgb(var(--global--color-green-500)); /* Loop Item */ text-overflow: ellipsis; /* Loop Item */ -webkit-line-clamp: 2; /* Loop Item */ -webkit-box-orient: vertical; /* Loop Item */ overflow: hidden; /* Loop Item */ } .page-item > .page-item-content > .page-item-header { display: grid; } .page-item > .page-item-content > .page-item-header > h2.h3 { display: -webkit-box; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; color: rgb(var(--global--color-green-500)); text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .page-item > .page-item-content > .page-item-header > p { margin-top: calc(2 * var(--global--spacing-unit)); margin-bottom: 0; color: rgb(var(--global--color-green-200)); } .page-item > .page-item-content > .page-item-excerpt { margin-top: calc(6 * var(--global--spacing-unit)); padding-top: 0; } /* * BLOCK COUNT Item (Homepage) */ .count-item {} body .count-item.is-layout-constrained > * + *, .count-item > p { margin-block-start: 0; margin-block-end: 0; margin: 0; padding: 0; color: rgb(var(--global--color-green-500)); } .count-item > p.h1 { font-size: calc(1.5 * var(--heading--font-size-h1)); line-height: 1.5; } /* * BLOCK QUOTE */ .wp-block-quote { margin-top: calc(10 * var(--global--spacing-unit))!important; margin-bottom: calc(10 * var(--global--spacing-unit))!important; padding-top: calc(8 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-bottom: calc(8 * var(--global--spacing-unit)); padding-left: calc(12 * var(--global--spacing-unit)); border-top: 1px solid rgb(var(--global--color-grey-100)); border-bottom: 1px solid rgb(var(--global--color-grey-100)); } @media only screen and (min-width: 482px) { .wp-block-quote {} } @media only screen and (min-width: 652px) { .wp-block-quote { padding-top: calc(8 * var(--global--spacing-unit)); padding-right: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(8 * var(--global--spacing-unit)); padding-left: calc(16 * var(--global--spacing-unit)); } } .wp-block-quote:before { content: '”'; left: 4px; font-family: var(--global--font-tertiary); font-size: 64px; line-height: 1.35; color: rgb(var(--global--color-green-200)); } @media only screen and (min-width: 482px) { .wp-block-quote:before { left: 4px; font-size: 64px; line-height: 1.35; } } @media only screen and (min-width: 652px) { .wp-block-quote:before { left: 12px; font-size: 84px; line-height: 1.15; } } .wp-block-quote > p { padding-top: 0; padding-bottom: calc(4 * var(--global--spacing-unit)); font-family: var(--global--font-tertiary); font-weight: 500; font-style: italic; font-size: var(--global--font-size-sm); letter-spacing: var(--global--letter-spacing); line-height: 1.65; color: rgb(var(--global--color-green-500)); } @media only screen and (min-width: 482px) { .wp-block-quote > p { font-size: var(--global--font-size-md); } } @media only screen and (min-width: 652px) { .wp-block-quote > p { font-size: var(--global--font-size-md); } } .wp-block-quote > cite { font-size: var(--global--font-size-base); line-height: 1.65; font-style: italic; color: rgb(var(--global--color-gray-500)); } .wp-block-quote > cite > a { font-style: normal; font-weight: 500; } /* * BLOCK SHORT SUMMARY */ .short-summary { padding: calc(4 * var(--global--spacing-unit)); background-color: var(--global--color-green-50); border-left: 4px solid var(--global--color-green-200); font-size: var(--global--font-size-base); color: var(--global--color-green-800); } .short-summary > * { margin: 0; margin-block-start: 0 !important; padding: 0; } .short-summary > *:first-child { text-transform: uppercase; } .short-summary > ul, .short-summary > ol { list-style-type: disc; padding-left: calc(4 * var(--global--spacing-unit)); } .short-summary > ul > li, .short-summary > ol > li { margin-top: var(--global--spacing-unit); margin-bottom: var(--global--spacing-unit); } /* * BLOCK CHECKLIST */ .checklist { margin: 0 auto; padding: 16px; max-width: calc(100% - 32px); width: 100%; background-color: var(--global--color-green-800); border-radius: calc(10 * var(--global--border-radius)); } @media only screen and (min-width: 822px) { .checklist { padding: 40px; max-width: calc(100% - 80px); } } @media only screen and (min-width: 1200px) { .checklist { padding: 80px; max-width: calc(1920px - 160px); } } .checklist > * { padding-top: calc(8 * var(--global--spacing-unit)); padding-right: calc(8 * var(--global--spacing-unit)); padding-bottom: calc(8 * var(--global--spacing-unit)); padding-left: calc(8 * var(--global--spacing-unit)); background-color: var(--global--color-white); border-radius: calc(5 * var(--global--border-radius)); } .checklist > * > h2, .checklist > * > .h2, .checklist > * > h3, .checklist > * > .h3 { position: relative; } .checklist > * > h2:before, .checklist > * > .h2:before, .checklist > * > h3:before, .checklist > * > .h3:before { content: counter(checklist-counter, decimal-leading-zero); display: inline-block; margin-right: calc(5 * var(--global--spacing-unit)); width: 80px; height: 80px; background-color: var(--global--color-green-100); border-radius: calc(2 * var(--global--border-radius)); font-size: var(--global--font-size-xl); line-height: 2.25; text-align: center; color: var(--global--color-green-500); } .checklist > * > p, .checklist > * > ul, .checklist > * > ol, .checklist > * > .wp-block-buttons { margin-block-start: 0 !important; margin-top: 0; padding-bottom: 1.25rem; padding-left: 100px; } .checklist > *:not(:first-of-type) { margin-top: calc(20 * var(--global--spacing-unit)); } .checklist > *:nth-of-type(1) { margin-left: 0 !important; } .checklist > *:nth-of-type(2) { margin-right: 0 !important; } .checklist > *:nth-of-type(3) { margin-left: 80px !important; } .checklist > *:nth-of-type(4) { margin-right: 80px !important; } .checklist > *:nth-of-type(5) { margin-left: 160px !important; } .checklist > *:nth-of-type(6) { margin-right: 160px !important; } .checklist > *:nth-of-type(7) { margin-left: 80px !important; } .checklist > *:nth-of-type(8) { margin-right: 80px !important; } .checklist > *:nth-of-type(9) { margin-left: 160px !important; } .checklist > *:nth-of-type(10){ margin-right: 160px !important; } /* * BLOCK CONTACT FORM */ .wpcf7 { display: flex; justify-content: space-between; margin-top: calc(5 * var(--global--spacing-unit)); margin-bottom: calc(5 * var(--global--spacing-unit)); padding-top: calc(6 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-bottom: calc(12 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); border-top: 1px solid rgb(var(--global--color-grey-100)); border-bottom: 1px solid rgb(var(--global--color-grey-100)); } .wpcf7-form-control-wrap { display: flex; flex-direction: column; } .wpcf7 label, .wpcf7 .label { display: flex; flex-direction: column; margin-bottom: calc(5 * var(--global--spacing-unit)); width: 100%; font-family: var(--global--font-secondary); font-size: var(--global--font-size-md); font-weight: 500; color: rgb(var(--global--color-green-500)); } .wpcf7 .label { margin-bottom: 0;} .wpcf7 label input:not([type='checkbox']), .wpcf7 label select, .wpcf7 label textarea { margin: 0; width: 100%; border: 2px solid rgb(var(--global--color-grey-100)); border-radius: var(--button--border-radius); } .wpcf7 label input[type='checkbox'], .wpcf7 label input[type='radio'] { width: 32px; height: 32px; border: 2px solid rgb(var(--global--color-grey-100)); border-radius: var(--button--border-radius); } .wpcf7 .wpcf7-checkbox, .wpcf7 .wpcf7-acceptance { display: flex; flex-direction: column; } .wpcf7 .wpcf7-checkbox .wpcf7-list-item, .wpcf7 .wpcf7-acceptance .wpcf7-list-item { margin-left: 0; } .wpcf7 .wpcf7-checkbox .wpcf7-list-item label, .wpcf7 .wpcf7-acceptance .wpcf7-list-item label, .wpcf7 .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label { display: flex; flex-direction: row; gap: calc(3 * var(--global--spacing-unit)); width: fit-content; font-size: var(--global--font-size-base); font-weight: 300; color: rgb(var(--global--color-grey-900)); } .wpcf7 .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label { margin-bottom: 0; } .wpcf7 .wpcf7-not-valid-tip { font-size: var(--global--font-size-base); } /* * BLOCK PAGE CONTACT FOOTER */ .page-contact-footer, .site-main > article > .page-contact-footer, .site-main > article > .page-contact-footer:last-child { margin-top: calc(10 * var(--global--spacing-unit)); margin-bottom: calc(-20 * var(--global--spacing-unit)); padding: 0 !important; color: rgb(var(--global--color-white)); background-color: rgb(var(--global--color-green-500)); } .page-contact-footer > *, .site-main > article > .page-contact-footer > *, .site-main > article > .page-contact-footer:last-child > * { max-width: var(--responsive--alignwide-width) !important; margin-left: auto; margin-right: auto; padding-right: calc(4 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); gap: calc(6 * var(--global--spacing-unit)) !important; } @media only screen and (max-width: 821px) { .page-contact-footer, .site-main > article > .page-contact-footer, .site-main > article > .page-contact-footer:last-child { margin-right: calc(-4 * var(--global--spacing-unit)); margin-left: calc(-4 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); } .page-contact-footer > *, .site-main > article > .page-contact-footer > *, .site-main > article > .page-contact-footer:last-child > * { max-width: var(--responsive--alignwide-width); margin-left: auto; margin-right: auto; gap: calc(6 * var(--global--spacing-unit)); } } .page-contact-footer .page-contact-intro {} .page-contact-footer .page-contact-intro > h2 { padding-top: 0; } .page-contact-footer .wp-block-column.page-contact-box { padding-top: 0; padding-right: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); padding-left: calc(10 * var(--global--spacing-unit)); max-width: 50%; background-color: rgb(var(--global--color-green-400)); border-radius: calc(3 * var(--global--spacing-unit)); } @media only screen and (max-width: 951px) { .page-contact-footer .wp-block-column.page-contact-box { max-width: 100%; } } .page-contact-footer .page-contact-box .wp-columns, .page-contact-footer .page-contact-box .wp-block-columns { display: flex; flex-direction: column !important; flex-basis: auto !important; gap: calc(6*var(--global--spacing-unit)) !important; padding-top: 0; padding-bottom: 0; } @media only screen and (min-width: 652px) { .page-contact-footer .page-contact-box .wp-columns, .page-contact-footer .page-contact-box .wp-block-columns { display: flex; flex-direction: row !important; flex-basis: auto !important; gap: calc(6*var(--global--spacing-unit)) !important; padding-top: 0; padding-bottom: 0; } } .page-contact-footer .page-contact-box .wp-column:last-child { flex-basis: calc(100% - 150px - 24px) !important; } .page-contact-footer .page-contact-box .wp-block-column:last-child { flex-basis: calc(100% - 320px - 24px) !important; } @media only screen and (min-width: 652px) { .page-contact-footer .page-contact-box .wp-column:last-child { flex-basis: calc(100% - 150px - 24px) !important; } .page-contact-footer .page-contact-box .wp-block-column:last-child { flex-basis: calc(100% - 320px - 24px) !important; } } .page-contact-footer .page-contact-box h3 { text-align: center; padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(5 * var(--global--spacing-unit)); } .page-contact-footer .page-contact-box /*h4*/.page-contact-title { text-align: center; margin-top: 0; padding-top: 0; margin-bottom: calc(2 * var(--global--spacing-unit)); } .page-contact-footer .page-contact-box p { text-align: center; } .page-contact-footer .page-contact-box p:first-of-type { text-align: center; margin-top: 0; padding-top: 0; } @media only screen and (min-width: 652px) { .page-contact-footer .page-contact-box h3 { text-align: left; padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(5 * var(--global--spacing-unit)); } .page-contact-footer .page-contact-box /*h4*/.page-contact-title { text-align: left; margin-top: 0; padding-top: 0; margin-bottom: calc(2 * var(--global--spacing-unit)); } .page-contact-footer .page-contact-box p { text-align: left; } .page-contact-footer .page-contact-box p:first-of-type { text-align: left; margin-top: 0; padding-top: 0; } } .page-contact-footer .page-contact-box a:link, .page-contact-footer .page-contact-box a:active, .page-contact-footer .page-contact-box a:visited { padding-top: calc(2 * var(--global--spacing-unit)); padding-right: calc(2 * var(--global--spacing-unit)); padding-bottom: calc(2 * var(--global--spacing-unit)); text-decoration: none; transition: padding-left 0.25s ease-in-out; } .page-contact-footer .page-contact-box a:hover, .page-contact-footer .page-contact-box a:focus { padding-left: calc(2 * var(--global--spacing-unit)); } /* * BLOCK SOCIAL SHARE */ .share, .entry-content > .share:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator){ display: flex; justify-content: space-between; margin-top: calc(5 * var(--global--spacing-unit)); margin-bottom: calc(5 * var(--global--spacing-unit)); padding-top: calc(4 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-bottom: calc(4 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); border-top: 1px solid rgb(var(--global--color-grey-100)); border-bottom: 1px solid rgb(var(--global--color-grey-100)); color: rgb(var(--global--color-gray-500)); } .share > *:first-child, .share > *:last-child { display: none; } @media only screen and (min-width: 482px) { .share > *:last-child { display: inline; } } @media only screen and (min-width: 652px) { .share > *:first-child { display: inline; } } .share > a { padding: 0; padding-right: calc(1*var(--global--spacing-vertical)); padding-left: calc(1*var(--global--spacing-vertical)); font-weight: 500; text-decoration: none; color: rgb(var(--global--color-primary)); } /* * BLOCK DETAILS (Akkordeon) */ /*.wp-block-details*/details { padding-top: calc(5*var(--global--spacing-unit)); padding-right: calc(5*var(--global--spacing-unit)); padding-bottom: calc(5*var(--global--spacing-unit)); padding-left: calc(5*var(--global--spacing-unit)); border-bottom: none; } details:first-of-type {} *:not(details) + details { margin-top: calc(10*var(--global--spacing-unit)) !important; } details ~ details { margin-bottom: calc(10*var(--global--spacing-unit)); border-top: 1px solid rgb(var(--global--color-grey-100)); } details > summary { /* Headline */ position: relative; display: block; padding-top: 0; padding-right: calc(10*var(--global--spacing-unit)); padding-left: calc(10*var(--global--spacing-unit)); color: rgb(var(--global--color-green-500)); font-size: var(--heading--font-size-h3); font-family: var(--heading--font-family); font-weight: var(--heading--font-weight); letter-spacing: var(--heading--letter-spacing-h4); line-height: var(--heading--line-height-h4); cursor: pointer; } details > summary:before { content: ""; position: absolute; top: 6px; left: 2px; width: 24px; height: 24px; --svg: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTMuNzUgMTBMMTAuNSAxMEwxMC41IDMuMjVDMTAuNSAyLjgxMjUgMTAuNjQwNiAyLjQ1MzEyIDEwLjkyMTkgMi4xNzE4N0MxMS4yMDMxIDEuODkwNjIgMTEuNTYyNSAxLjc1IDEyIDEuNzVDMTIuNDM3NSAxLjc1IDEyLjc5NjkgMS44OTA2MiAxMy4wNzgxIDIuMTcxODdDMTMuMzU5NCAyLjQ1MzEyIDEzLjUgMi44MTI1IDEzLjUgMy4yNUwxMy41IDEwTDIwLjI1IDEwQzIwLjY4NzUgMTAgMjEuMDQ2OSAxMC4xNDA2IDIxLjMyODEgMTAuNDIxOUMyMS42MDk0IDEwLjcwMzEgMjEuNzUgMTEuMDYyNSAyMS43NSAxMS41QzIxLjc1IDExLjkzNzUgMjEuNjA5NCAxMi4yOTY5IDIxLjMyODEgMTIuNTc4MUMyMS4wNDY5IDEyLjg1OTQgMjAuNjg3NSAxMyAyMC4yNSAxM0wxMy41IDEzTDEzLjUgMTkuNzVDMTMuNSAyMC4xODc1IDEzLjM1OTQgMjAuNTQ2OSAxMy4wNzgxIDIwLjgyODFDMTIuNzk2OSAyMS4xMDk0IDEyLjQzNzUgMjEuMjUgMTIgMjEuMjVDMTEuNTYyNSAyMS4yNSAxMS4yMDMxIDIxLjEwOTQgMTAuOTIxOSAyMC44MjgxQzEwLjY0MDYgMjAuNTQ2OSAxMC41IDIwLjE4NzUgMTAuNSAxOS43NUwxMC41IDEzTDMuNzUgMTNDMy4zMTI1IDEzIDIuOTUzMTIgMTIuODU5NCAyLjY3MTg3IDEyLjU3ODFDMi4zOTA2MiAxMi4yOTY5IDIuMjUgMTEuOTM3NSAyLjI1IDExLjVDMi4yNSAxMS4wNjI1IDIuMzkwNjIgMTAuNzAzMSAyLjY3MTg3IDEwLjQyMTlDMi45NTMxMiAxMC4xNDA2IDMuMzEyNSAxMCAzLjc1IDEwWiIgZmlsbD0iIzAwNzU3QiIvPgo8L3N2Zz4K"); -webkit-mask: var(--svg); mask: var(--svg); background-color: rgb(var(--global--color-green-500)); transform: rotate(-90deg); transition: transform 150ms ease-in-out; } details[open] > summary:before { --svg: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIuMjUgMTEuNUMyLjI1IDExLjA2MjUgMi4zOTA2MyAxMC43MDMxIDIuNjcxODggMTAuNDIxOUMyLjk1MzEzIDEwLjE0MDYgMy4zMTI1IDEwIDMuNzUgMTBMMjAuMjUgMTBDMjAuNjg3NSAxMCAyMS4wNDY5IDEwLjE0MDYgMjEuMzI4MSAxMC40MjE5QzIxLjYwOTQgMTAuNzAzMSAyMS43NSAxMS4wNjI1IDIxLjc1IDExLjVDMjEuNzUgMTEuOTM3NSAyMS42MDk0IDEyLjI5NjkgMjEuMzI4MSAxMi41NzgxQzIxLjA0NjkgMTIuODU5NCAyMC42ODc1IDEzIDIwLjI1IDEzTDMuNzUgMTNDMy4zMTI1IDEzIDIuOTUzMTMgMTIuODU5NCAyLjY3MTg4IDEyLjU3ODFDMi4zOTA2MyAxMi4yOTY5IDIuMjUgMTEuOTM3NSAyLjI1IDExLjVaIiBmaWxsPSIjMDA3NTdCIi8+Cjwvc3ZnPgo="); -webkit-mask: var(--svg); mask: var(--svg); transform: rotate(0deg); } details > summary:focus:before, details > summary:focus-visible:before { background-color: rgb(var(--global--color-white)); } details > summary:hover { opacity: 0.8; } details > summary:focus, details > summary:focus-visible { color: rgb(var(--global--color-white)); text-decoration: none; border-radius: var(--button--border-radius); background: rgb(var(--global--color-grey-900)); outline: 2px dotted rgb(var(--global--color-grey-900)); outline-offset: 2px; } details > * { /* Content */ margin-top: 0; padding-top: 0; padding-right: calc(10*var(--global--spacing-unit)); padding-left: calc(10*var(--global--spacing-unit)); width: auto; } details > *:nth-child(2) { padding-top: calc(5*var(--global--spacing-unit)); } details > *:last-child { padding-bottom: 0; } /* * BLOCK RANK MATH FAQ * Source: https://gist.github.com/neverything/93546eabd9d7399ab80b2f12630cd695#file-rankmath-faq-accordion-js */ #rank-math-faq { margin-block-start: 0; margin-block-end: 0; padding-top: calc(10*var(--global--spacing-unit)); padding-bottom: calc(10*var(--global--spacing-unit)); } #rank-math-faq .rank-math-list-item { padding-top: calc(5*var(--global--spacing-unit)); padding-right: calc(5*var(--global--spacing-unit)); padding-bottom: calc(5*var(--global--spacing-unit)); padding-left: calc(5*var(--global--spacing-unit)); border-bottom: 1px solid rgb(var(--global--color-grey-100)); } #rank-math-faq .rank-math-list-item:last-of-type { border-bottom: none; } /*h3*/.rank-math-question { position: relative; display: block; padding-top: 0; padding-right: calc(10*var(--global--spacing-unit)); padding-left: calc(10*var(--global--spacing-unit)); color: rgb(var(--global--color-green-500)); cursor: pointer; tabindex: 0; } /*h3*/.rank-math-question:focus, /*h3*/.rank-math-question:focus-visible { color: rgb(var(--global--color-white)); text-decoration: none; border-radius: var(--button--border-radius); background: rgb(var(--global--color-grey-900)); outline: 2px dotted rgb(var(--global--color-grey-900)); outline-offset: 2px; } .rank-math-question:before { content: ""; position: absolute; top: 6px; left: 2px; width: 24px; height: 24px; --svg: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjUiIHZpZXdCb3g9IjAgMCAyNCAyNSIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIyLjA3ODEgMTQuMDc4MUMyMi4zNTk0IDEzLjc2NTYgMjIuNSAxMy40MDYyIDIyLjUgMTNDMjIuNSAxMi41OTM3IDIyLjM1OTQgMTIuMjM0NCAyMi4wNzgxIDExLjkyMTlMMTQuNTc4MSA0LjQyMTg3QzE0LjI2NTYgNC4xNDA2MiAxMy45MDYyIDQgMTMuNSA0QzEzLjA5MzcgNCAxMi43MzQ0IDQuMTQwNjIgMTIuNDIxOSA0LjQyMTg3QzEyLjE0MDYgNC43MzQzNyAxMiA1LjA5Mzc1IDEyIDUuNUMxMiA1LjkwNjI1IDEyLjE0MDYgNi4yNjU2MiAxMi40MjE5IDYuNTc4MTJMMTcuMzkwNiAxMS41TDMgMTEuNUMyLjU2MjUgMTEuNSAyLjIwMzEyIDExLjY0MDYgMS45MjE4NyAxMS45MjE5QzEuNjQwNjIgMTIuMjAzMSAxLjUgMTIuNTYyNSAxLjUgMTNDMS41IDEzLjQzNzUgMS42NDA2MiAxMy43OTY5IDEuOTIxODcgMTQuMDc4MUMyLjIwMzEyIDE0LjM1OTQgMi41NjI1IDE0LjUgMyAxNC41TDE3LjM5MDYgMTQuNUwxMi40MjE5IDE5LjQyMTlDMTIuMTQwNiAxOS43MzQ0IDEyIDIwLjA5MzcgMTIgMjAuNUMxMiAyMC45MDYyIDEyLjE0MDYgMjEuMjY1NiAxMi40MjE5IDIxLjU3ODFDMTIuNzM0NCAyMS44NTk0IDEzLjA5MzggMjIgMTMuNSAyMkMxMy45MDYyIDIyIDE0LjI2NTYgMjEuODU5NCAxNC41NzgxIDIxLjU3ODFMMjIuMDc4MSAxNC4wNzgxWiIgZmlsbD0iIzAwNzU3QiIvPgo8L3N2Zz4K"); -webkit-mask: var(--svg); mask: var(--svg); background-color: rgb(var(--global--color-green-500)); transform: rotate(0deg); transition: all 150ms ease-in-out; } .rank-math-question:focus:before, .rank-math-question:focus-visible:before { background-color: rgb(var(--global--color-white)); } .rank-math-question.collapse:before { transform: rotate(90deg); } .rank-math-question:hover { opacity: 0.8; } .rank-math-answer { margin-top: 0; padding-top: 0; padding-right: calc(10*var(--global--spacing-unit)); padding-left: calc(10*var(--global--spacing-unit)); } /* * BLOCK RANK MATH TABLE OF CONTENTS */ .wp-block-rank-math-toc-block { display: flex; flex-direction: column; justify-content: space-between; margin-top: calc(20 * var(--global--spacing-unit)); margin-bottom: calc(10 * var(--global--spacing-unit)); padding-top: calc(4 * var(--global--spacing-unit)); padding-right: calc(4 * var(--global--spacing-unit)); padding-bottom: calc(4 * var(--global--spacing-unit)); padding-left: calc(4 * var(--global--spacing-unit)); border-top: 1px solid var(--global--color-gray-200); border-bottom: 1px solid var(--global--color-gray-200); color: rgb(var(--global--color-gray-900)); } .wp-block-rank-math-toc-block > *:first-child { margin: 0; padding-top: 0; padding-bottom: calc(2 * var(--global--spacing-unit)); font-size: var(--global--font-size-base); font-weight: 500; text-transform: uppercase; color: var(--global--color-gray-900); } .wp-block-rank-math-toc-block > nav > ol { margin: 0; padding: 0; list-style-type: none; } .wp-block-rank-math-toc-block > nav > ol > li { counter-increment: toc-counter; padding-top: calc(0*var(--global--spacing-unit)); } .wp-block-rank-math-toc-block nav ol li:before { display: none; } .wp-block-rank-math-toc-block > nav > ol > li > a:link, .wp-block-rank-math-toc-block > nav > ol > li > a:hover, .wp-block-rank-math-toc-block > nav > ol > li > a:active, .wp-block-rank-math-toc-block > nav > ol > li > a:visited { display: inline-block; position: relative; width: 100%; padding-top: calc(2 * var(--global--spacing-unit)); padding-bottom: calc(2 * var(--global--spacing-unit)); padding-left: calc(8 * var(--global--spacing-unit)); line-height: 1.35; font-size: var(--global--font-size-base); font-weight: 500; text-decoration: none; color: var(--global--color-gray-900); transition: all 0.25s ease-in-out; } .wp-block-rank-math-toc-block > nav > ol > li > a:hover, .wp-block-rank-math-toc-block > nav > ol > li > a:focus { padding-left: calc(10 * var(--global--spacing-unit)); } .wp-block-rank-math-toc-block > nav > ol > li > a:before { content: counter(toc-counter, decimal-leading-zero) '. '; position: absolute; left: -2px; width: calc(6 * var(--global--spacing-unit)); text-align: left; transition: all 0.25s ease-in-out; } .wp-block-rank-math-toc-block > nav > ol > li > a:hover:before, .wp-block-rank-math-toc-block > nav > ol > li > a:focus:before { left: 6px; } /* * Micro Classes */ ul.wp-block-list, ol.wp-block-list { padding-left: calc(7.5 * var(--global--spacing-unit)); padding-right: calc(0 * var(--global--spacing-unit)); line-height: calc(0.75 * var(--global--line-height-body)); font-weight: 500; color: var(--global--color-green-900); } .checklist ul.wp-block-list, .checklist ol.wp-block-list { padding-left: calc(7.5 * var(--global--spacing-unit) + 100px); } ul.wp-block-list > li, ol.wp-block-list > li { list-style-type: disc; } ul.wp-block-list > li::marker, ol.wp-block-list > li::marker { font-size: var(--global--font-size-lg); color: var(--global--color-green-500); } ul.wp-block-list.list-style-check { list-style-type: none; } ul.wp-block-list.list-style-check > li { position: relative; } ul.wp-block-list.list-style-check > li:before { content: ''; position: absolute; top: 2px; margin-left: -32px; width: 32px; height: 32px; background-position: center; background-repeat: no-repeat; background-image: url("data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMXB4IiB2aWV3Qm94PSIwIDAgMjAgMjEiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIxIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM0MzUzNjIiIGQ9Ik0xNi42NjQsNS4yMTdjMC41OSwwLjUyNCwwLjY0MywxLjQyNywwLjExOCwyLjAxN2wtNy42MTksOC41NzFjLTAuMjcxLDAuMzA2LTAuNjYsMC40OC0xLjA2NywwLjQ4DQoJYy0wLjQwOCwwLTAuNzk3LTAuMTc1LTEuMDY4LTAuNDhsLTMuODEtNC4yODVjLTAuNTI0LTAuNTktMC40NzEtMS40OTMsMC4xMTktMi4wMTdjMC41OS0wLjUyNCwxLjQ5My0wLjQ3MSwyLjAxNywwLjExOWwyLjc0MiwzLjA4NA0KCWw2LjU1MS03LjM3QzE1LjE3MSw0Ljc0NiwxNi4wNzQsNC42OTIsMTYuNjY0LDUuMjE3eiIvPg0KPC9zdmc+DQo="); } ol.wp-block-list.list-style-numbers { list-style-type: none; padding-left: 0; max-width: 100%; } ol.wp-block-list.list-style-numbers > li { display: flex; align-items: flex-start; gap: 4px; } ol.wp-block-list.list-style-numbers > li > svg { margin-top: 2px; } /* * COLUMNS */ /** * Extends */ .post-thumbnail, .entry-content .wp-audio-shortcode, .entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .entry-related > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), *[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator), .default-max-width { max-width: var(--responsive--aligndefault-width); margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; } .wp-block-columns { margin-top: 0; margin-bottom: 0; padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); } .wp-block-post-template.is-flex-container, .wp-block-columns:not(.alignwide):not(.alignfull) { clear: both; gap: calc(10 * var(--global--spacing-unit)); } .wp-block-columns.alignwide, .wp-block-columns.alignfull { clear: both; flex-direction: row; gap: calc(20 * var(--global--spacing-unit)); padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); } @media (max-width: 951px) { .wp-block-columns.alignwide, .wp-block-columns.alignfull { clear: both; flex-direction: column; gap: calc(10 * var(--global--spacing-unit)); } } .wp-block-group > .wp-block-columns.alignwide, .wp-block-group > .wp-block-columns.alignfull { padding-top: 0; padding-bottom: 0; } .wp-block-columns .wp-block-column > * { margin-top: 0; margin-bottom: 0; } @media only screen and (min-width: 482px) { .wp-block-columns .wp-block-column > * { margin-top: 0; margin-bottom: 0; } } .wp-block-columns .wp-block-column { padding-top: calc(0 * var(--global--spacing-unit)); padding-bottom: calc(0 * var(--global--spacing-unit)); } @media (max-width: 951px) { .wp-block-columns:not(.is-not-stacked-on-mobile)>.wp-block-column { flex-basis: 100%!important; } } .wp-block-columns.is-style-twentytwentyone-columns-overlap { justify-content: space-around; } @media only screen and (min-width: 822px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2) { margin-left: calc(-66 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(1) { position:relative; z-index: 100; } } @media only screen and (min-width: 822px) { .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(2) { margin-left: calc(-66 * var(--global--spacing-horizontal)); margin-top: calc(2.5 * var(--global--spacing-horizontal)); z-index: 2; } .wp-block-columns.is-style-twentytwentyone-columns-overlap .wp-block-column:nth-child(1) { position:relative; z-index: 100; } } /* * LOOP with COLUMNS */ .wp-block-post-template.is-flex-container, .wp-block-columns:not(.alignwide):not(.alignfull) { justify-content: space-between; gap: calc(10 * var(--global--spacing-unit)); } @media only screen and (max-width: 781px) { .wp-block-post-template.is-flex-container, .wp-block-columns:not(.alignwide):not(.alignfull) { justify-content: space-around; gap: calc(10 * var(--global--spacing-unit)); } } @media (min-width: 600px) { .wp-block-post-template.is-flex-container.is-flex-container.columns-3>li { flex-basis: min-content; } } .wp-block-post-featured-image.aligncenter { margin: 0 auto!important; } .wp-block-post-title { margin-top: calc(5 * var(--global--spacing-unit));; margin-bottom: calc(5 * var(--global--spacing-unit));; } /* ========================================================================================================== */ /* ========================================================================================================== */ /* ========================================================================================================== */ /** * Site Structure * * - Set vertical margins and responsive widths on * top-level wrappers and content wrappers * - `--global--width-content` is a responsive variable * - See: globals/_global-width-responsive.scss */ html { scroll-behavior: smooth; } body { font-size: var(--global--font-size-md); font-weight: 300; color: var(--global--color-gray-900); text-align: left; } body .is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull):not(.alignwide)) { /* max-width: var(--wp--style--global--content-size); */ max-width: var(--responsive--alignwide-width); margin-left: auto !important; margin-right: auto !important; } body .is-layout-constrained > * + * { /* margin-block-start: calc(5 * var(--global--spacing-unit)); margin-block-end: calc(5 * var(--global--spacing-unit)); */ } /** * Top Level Wrappers (header, main, footer) * - Set vertical padding and horizontal margins */ .site-header, .site-main, .widget-area, .site-footer { margin-left: calc(5 * var(--global--spacing-unit)); margin-right: calc(5 * var(--global--spacing-unit)); margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } @media only screen and (min-width: 482px) { .site-header, .site-main, .widget-area, .site-footer { margin-left: auto; margin-right: auto; } } @media only screen and (min-width: 822px) { .site-header, .site-main, .widget-area, .site-footer { margin-left: auto; margin-right: auto; } } .site-main > *:first-child { margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; } .site-main > article.category-blog {} /* Blog articles with post images */ .site-main > article > .entry-content { position: relative; } /* Important for shortinfo positioning */ .site-main > *:last-child { margin-left: auto; margin-right: auto; margin-top: 0; margin-bottom: 0; } .site-main { margin-bottom: calc(20 * var(--global--spacing-unit)); } /* * Block & non-gutenberg content wrappers * - Set margins */ .entry-header, .post-thumbnail, .entry-content, .entry-footer, .entry-related, .author-bio { margin-right: auto; margin-left: auto; margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } /* * Block & non-gutenberg content wrapper children * - Sets spacing-vertical margin logic */ .site-main > article > *, .site-main > .not-found > *, .site-main > .entry-content:first-child > *, [class*=inner-container] > * { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } .entry-header > *:first-child, .post-thumbnail > *:first-child, .page-content > *:first-child, .comment-content > *:first-child, .widget > *:first-child { margin-top: unset; margin-bottom: unset; padding-top: calc(20 * var(--global--spacing-unit)); padding-bottom: unset; } .entry-header > *:last-child, .post-thumbnail > *:last-child, .page-content > *:last-child, .comment-content > *:last-child, .widget > *:last-child { margin-top: initial; margin-bottom: initial; padding-top: initial; padding-bottom: initial; } .wp-block-template-part > *, .wp-block-post-template :where(li > *) { margin-top: calc(5 * var(--global--spacing-unit)); margin-bottom: calc(5 * var(--global--spacing-unit)); } @media only screen and (min-width: 482px) { .site-main > article > *, .site-main > .not-found > *, .entry-content > *, [class*=inner-container] > *, .wp-block-template-part > *, .wp-block-post-template :where(li > *) { margin-top: 0; margin-bottom: 0; } } .site-main > article > *:first-child, .site-main > .not-found > *:first-child, .entry-content > *:first-child, [class*=inner-container] > *:first-child, .wp-block-template-part > *:first-child, .wp-block-post-template :where(li > *):first-child { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; } .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; } .site-footer > * { margin-top: 0; margin-bottom: 0; } @media only screen and (min-width: 482px) { .site-footer > * { margin-top: 0; margin-bottom: 0; } } .site-footer .widget-area { display: flex; flex-wrap: wrap; flex-direction: column; margin-left: 0; margin-right: 0; padding-top: calc(10 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); max-width: 100%; text-align: center; } @media only screen and (min-width: 1200px) { .site-footer .widget-area { flex-direction: row; gap: calc(5 * var(--global--spacing-unit)); align-items: end; text-align: left; } .site-footer .widget-area > *:nth-child(1), .site-footer .widget-area > *:nth-child(2) { flex-basis: 47.5%;} .site-footer .widget-area > *:nth-child(3) { margin: 0; } } @media only screen and (min-width: 1400px) { .site-footer .widget-area { flex-direction: row; flex-wrap: nowrap; justify-content: space-between; gap: calc(5 * var(--global--spacing-unit)); text-align: left; } .site-footer .widget-area > *:nth-child(1), .site-footer .widget-area > *:nth-child(2), .site-footer .widget-area > *:nth-child(3) { flex-basis: content; margin-top: calc(10 * var(--global--spacing-unit)); margin-bottom: calc(10 * var(--global--spacing-unit)); } } .site-footer .widget-area > * { margin-top: 0; margin-bottom: 0; } @media only screen and (min-width: 1200px) { .site-footer .widget-area > * { margin-top: calc(10 * var(--global--spacing-unit)); margin-bottom: calc(10 * var(--global--spacing-unit)); } } .site-footer .widget-area .wp-block-columns { margin: 0; padding: 0; } .site-footer .widget-area .widget h3 { padding-top: 0; } .site-footer .widget-area .widget p { margin-block-start: 8px; } .site-footer .widget-area ul { } .site-footer .widget-area ul > li { list-style-type: none; font-weight: 300; color: var(--global--color-gray-800); } .site-footer .widget a { display: block; padding-top: calc(2.5 * var(--global--spacing-unit)); padding-right: calc(1.25 * var(--global--spacing-unit)); padding-bottom: calc(2.5 * var(--global--spacing-unit)); padding-left: calc(1.25 * var(--global--spacing-unit)); color: var(--footer--color-link); text-decoration: none; line-height: 2rem; } .site-footer .widget a:link, .site-footer .widget a:visited, .site-footer .widget a:active { color: var(--footer--color-link); } .site-footer .widget a:hover { color: var(--footer--color-link-hover); text-decoration-style: dotted; } .site-footer .widget-area .widget figure { margin-right: auto; margin-left: auto; margin-top: calc(10 * var(--global--spacing-unit)); padding: calc(10 * var(--global--spacing-unit)); max-width: 480px; background-color: var(--global--color-gray-50); border-radius: calc(5 * var(--global--spacing-unit)); } @media only screen and (min-width: 1200px) { .site-footer .widget-area .widget figure { margin: 0 !important; max-width: unset; } } @media only screen and (min-width: 1400px) { .site-footer .widget-area .widget figure { margin: 0 !important; max-width: 320px; } } .site-footer .widget-area .widget figure > img { width: 100%; max-width: 400px; } @media only screen and (min-width: 1400px) { .site-footer .widget-area .widget figure > img { width: 100%; max-width: 280px; } } /* * HEADER */ header#masthead { } /*header > div*/.site-header { position: relative; display: flex; flex-direction: column; justify-content: center; margin: 0; max-width: 100% !important; width: 100%; column-gap: 0; padding-top: calc(3 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(3 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); border-bottom-right-radius: calc(10 * var(--global--spacing-unit)); background-color: var(--global--color-white); } @media only screen and (min-width: 952px) { /*header > div*/.site-header { flex-direction: row; justify-content: center; padding-top: calc(7 * var(--global--spacing-unit)); padding-right: calc(10 * var(--global--spacing-unit)) ; padding-left: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(7 * var(--global--spacing-unit)); } } @media only screen and (min-width: 1060px) { /*header > div*/.site-header { justify-content: space-between; } } @media only screen and (min-width: 1200px) { /*header > div*/.site-header { padding-right: calc(20 * var(--global--spacing-unit)) ; padding-left: calc(20 * var(--global--spacing-unit)); } } .site-header:before { content: inherit; } .site-header:after { content: ''; position: absolute; bottom: -2.5rem; left: 0; width: 2.5rem; height: 2.5rem; border-top-left-radius: 2.5rem; background-color: var(--global--color-gray-100); box-shadow: -5px -10px 0px 5px #fff; } .site-logo .custom-logo-link { display: block; } .site-logo .custom-logo-link .custom-logo { max-width: var(--branding--logo--max-width); max-height: var(--branding--logo--max-height); margin-top: calc(2 * var(--global--spacing-vertical)); margin-bottom: calc(2 * var(--global--spacing-vertical)); padding-left: calc(0 * var(--global--spacing-unit)); } @media only screen and (max-width: 481px) { .site-logo .custom-logo-link .custom-logo { max-width: var(--branding--logo--max-width-mobile); max-height: var(--branding--logo--max-height-mobile); } .site-header .site-branding { margin-right: 0; } /* Reset */ .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo, .primary-navigation-open .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo { position: relative; display: block; top: auto; } /* Reset */ .site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo img { max-height: inherit; } /* Reset */ } @media only screen and (min-width: 482px) { .site-branding { margin-right: 0; margin-top: 0; } } .page-header, .entry-header, .site-main > article > .entry-header { display: flex; flex-direction: column; gap: 16px; max-width: var(--responsive--alignwide-width); border-bottom: 0; padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); text-align: center; } .page-header .page-title { color: rgb(var(--global--color-grey-900)); } .rank-math-breadcrumb { margin-top: 0; margin-bottom: 0; font-size: var(--global--font-size-base); line-height: 1.75; color: rgb(var(--global--color-gray-500)); } .rank-math-breadcrumb p { padding-top: 0; padding-bottom: 0; } .rank-math-breadcrumb a { font-weight: 500; text-decoration: none !important; color: rgb(var(--global--color-primary)); } .rank-math-breadcrumb a:hover { text-decoration: underline !important; } @media only screen and (min-width: 482px) { .rank-math-breadcrumb {} } @media only screen and (min-width: 652px) { .rank-math-breadcrumb {} } /* * MOBILE NAVIGATION MENU */ .menu-button-container { display: none; } @media only screen and (max-width: 481px) { .menu-button-container { display: flex; justify-content: normal; position: initial; right: 0; padding: 0; } } .menu-button-container #primary-mobile-menu { display: flex; margin-left: auto; padding: calc(var(--button--padding-vertical) - 0.25 * var(--global--spacing-unit)) calc(0.5 * var(--button--padding-horizontal)); font-size: var(--primary-nav--font-size-button); font-weight: var(--primary-nav--font-weight-button); background-color: transparent; border: none; color: var(--primary-nav--color-link); } .menu-button-container #primary-mobile-menu .dropdown-icon { display: flex; align-items: center; } .menu-button-container #primary-mobile-menu .dropdown-icon .svg-icon { margin-left: calc(0.25 * var(--global--spacing-unit)); } .menu-button-container #primary-mobile-menu .dropdown-icon.open .svg-icon { position: relative; top: -1px; } .menu-button-container #primary-mobile-menu .dropdown-icon.close { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.open { display: none; } .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { display: flex; } .has-logo.has-title-and-tagline .menu-button-container #primary-mobile-menu[aria-expanded*=true] .dropdown-icon.close { animation-name: twentytwentyone-close-button-transition; animation-duration: 0.3s; } .primary-navigation-open .menu-button-container { width: 100%; z-index: 500; background-color: var(--global--color-background); } .primary-navigation-open .menu-button-container #primary-mobile-menu { position: static; } /* * NAVIGATION MENU */ .primary-navigation { position: relative; display: block; top: auto; right: auto; width: auto; line-height: var(--global--line-height-body); } @media only screen and (max-width: 481px) { .primary-navigation-open .primary-navigation { position: relative; display: block; top: auto; right: auto; width: auto; line-height: var(--global--line-height-body); } } @media only screen and (min-width: 482px) and (max-width: 951px) { .primary-navigation { margin: 0 auto; right: unset; left: unset; } } .primary-navigation-open .primary-navigation > .primary-menu-container { position: fixed; visibility: visible; opacity: 1; transform: translateY(0); } @media only screen and (max-width: 481px) { .primary-navigation > .primary-menu-container { position: fixed; z-index: 499; top: 200px; height: 100vh; overflow-x: hidden; overflow-y: auto; padding-top: calc(10 * var(--global-spacing-unit)); padding-right: calc( 5 * var(--global-spacing-unit)); padding-bottom: calc(10 * var(--global-spacing-unit)); padding-left: calc( 5 * var(--global-spacing-unit)); border: 2px solid transparent; } .primary-navigation-open .has-logo.has-title-and-tagline .primary-navigation > .primary-menu-container { transform: translateX(0) translateY(0); } } @media only screen and (min-width: 482px) { .primary-navigation { margin-left: 0; } .primary-navigation > .primary-menu-container { visibility: visible; opacity: 1; position: relative; padding: 0; background-color: transparent; overflow: initial; transform: none; } .primary-navigation > div > .menu-wrapper { display: flex; flex-direction: row; justify-content: center; gap: 16px; } .primary-navigation #toggle-menu { display: none; } .primary-navigation > .primary-menu-container ul > li .sub-menu-toggle[aria-expanded=false] ~ ul { display: none; } .admin-bar .primary-navigation { top: initial; } .admin-bar .primary-navigation > .primary-menu-container { top: initial; } } .primary-navigation .primary-menu-container > ul > .menu-item { } .primary-navigation .primary-menu-container > ul > .menu-item > a { padding-top: var(--primary-nav--padding); padding-right: calc(1.5 * var(--primary-nav--padding)); padding-bottom: var(--primary-nav--padding); padding-left: calc(1.5 * var(--primary-nav--padding)); } .primary-navigation > div > .menu-wrapper .sub-menu-toggle { width: auto; background-color: transparent; } @media only screen and (min-width: 482px) { .primary-navigation .primary-menu-container { margin-right: calc( 1 * var(--primary-nav--padding)); margin-left: calc(-2 * var(--primary-nav--padding)); } .primary-navigation .primary-menu-container > ul > .menu-item { display: flex; align-items: center; } .primary-navigation .primary-menu-container > ul > .menu-item > a { padding-top: var(--primary-nav--padding); padding-right: calc(1.5 * var(--primary-nav--padding)); padding-bottom: var(--primary-nav--padding); padding-left: calc(1.5 * var(--primary-nav--padding)); } .primary-navigation .primary-menu-container > ul > .menu-item > a + .sub-menu-toggle { margin-left: -4px; } } .primary-navigation a { display: block; border-radius: calc(2 * var(--global--border-radius)); font-family: var(--primary-nav--font-family-mobile); font-size: var(--primary-nav--font-size-mobile); font-weight: var(--primary-nav--font-weight); text-decoration: none !important; text-align: center; } @media only screen and (min-width: 482px) { .primary-navigation a { display: block; font-family: var(--primary-nav--font-family); font-size: var(--primary-nav--font-size); font-weight: var(--primary-nav--font-weight); } } .primary-navigation .menu-item-primary a:link, .primary-navigation .menu-item-primary a:active, .primary-navigation .menu-item-primary a:visited { background-color: var(--global--color-green-800); color: var(--global--color-white); } .primary-navigation a + svg { fill: var(--primary-nav--color-text); } .primary-navigation a:hover, .primary-navigation a:link, .primary-navigation a:visited { background-color: transparent; color: var(--primary-nav--color-link); } .primary-navigation a:hover { background-color: var(--global--color-green-700); text-decoration: underline !important; color: var(--primary-nav--color-link-hover); } .primary-navigation a:focus { position: relative; z-index: 99999; outline-style: dotted; outline-width: 2px; outline-offset: 1px; outline-color: #020617; transition: all 0.25s ease-in-out; } /* Active Status - Main Menu */ .primary-navigation .current-page-parent > a, .primary-navigation .current-menu-parent > a, .primary-navigation .current-menu-item > a:first-child, .primary-navigation .current_page_item > a:first-child { text-decoration: none; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAyNCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMy4xOTUyIDUuODQ3NDhDMjMuODQ2OCA2LjIyOTk2IDIzLjg1NTIgNy4xNjkxOCAyMy4yMTA0IDcuNTYzMThMMjAuMzc0NiA5LjI5NjE4QzIwLjA0NzUgOS40OTYwOCAxOS42MzQ5IDkuNDkxMzggMTkuMzEyNCA5LjI4NDA4TDEyLjgzOTYgNS4xMjI5OUMxMi41NTM0IDQuOTM4OTkgMTIuMzgwNCA0LjYyMjA4IDEyLjM4MDQgNC4yODE4MVYxLjI0NjE0QzEyLjM4MDQgMC40NzMxNTIgMTMuMjE5OSAtMC4wMDc1NjE2MiAxMy44ODY2IDAuMzgzNzI4TDIzLjE5NTIgNS44NDc0OFpNMC44MDQzNDcgNS44Mjc3OEMwLjE1MjcxNiA2LjIxMDI1IDAuMTQ0MzY4IDcuMTQ5NDcgMC43ODkwOTggNy41NDM0N0wzLjYxMTc4IDkuMjY4NDRDMy45Mzg5IDkuNDY4MzUgNC4zNTE1MSA5LjQ2MzY1IDQuNjczOTkgOS4yNTYzNEwxMS4xMjYzIDUuMTA4MzlDMTEuNDEyNiA0LjkyNDM5IDExLjU4NTYgNC42MDc0OCAxMS41ODU2IDQuMjY3MjFWMS4yNDYxNEMxMS41ODU2IDAuNDczMTUyIDEwLjc0NiAtMC4wMDc1NjA3OSAxMC4wNzk0IDAuMzgzNzI4TDAuODA0MzQ3IDUuODI3NzhaIiBmaWxsPSIjMDA3NTdCIi8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-position: center bottom; } .primary-navigation .current-menu-item > a:first-child:hover, .primary-navigation .current_page_item > a:first-child:hover { text-decoration: none; background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMTAiIHZpZXdCb3g9IjAgMCAyNCAxMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik0yMy4xOTUyIDUuODQ3NDhDMjMuODQ2OCA2LjIyOTk2IDIzLjg1NTIgNy4xNjkxOCAyMy4yMTA0IDcuNTYzMThMMjAuMzc0NiA5LjI5NjE4QzIwLjA0NzUgOS40OTYwOCAxOS42MzQ5IDkuNDkxMzggMTkuMzEyNCA5LjI4NDA4TDEyLjgzOTYgNS4xMjI5OUMxMi41NTM0IDQuOTM4OTkgMTIuMzgwNCA0LjYyMjA4IDEyLjM4MDQgNC4yODE4MVYxLjI0NjE0QzEyLjM4MDQgMC40NzMxNTIgMTMuMjE5OSAtMC4wMDc1NjE2MiAxMy44ODY2IDAuMzgzNzI4TDIzLjE5NTIgNS44NDc0OFpNMC44MDQzNDcgNS44Mjc3OEMwLjE1MjcxNiA2LjIxMDI1IDAuMTQ0MzY4IDcuMTQ5NDcgMC43ODkwOTggNy41NDM0N0wzLjYxMTc4IDkuMjY4NDRDMy45Mzg5IDkuNDY4MzUgNC4zNTE1MSA5LjQ2MzY1IDQuNjczOTkgOS4yNTYzNEwxMS4xMjYzIDUuMTA4MzlDMTEuNDEyNiA0LjkyNDM5IDExLjU4NTYgNC42MDc0OCAxMS41ODU2IDQuMjY3MjFWMS4yNDYxNEMxMS41ODU2IDAuNDczMTUyIDEwLjc0NiAtMC4wMDc1NjA3OSAxMC4wNzk0IDAuMzgzNzI4TDAuODA0MzQ3IDUuODI3NzhaIiBmaWxsPSIjMDA3NTdCIi8+Cjwvc3ZnPgo="); background-repeat: no-repeat; background-position: center bottom; } /* Active Status - Sub Menu */ .primary-navigation .sub-menu > .current-menu-item > a { background-image: none; } .primary-navigation .sub-menu { overflow: hidden; margin: 0; padding: 0; list-style: none; } .primary-navigation .sub-menu .sub-menu { border: none; } @media only screen and (min-width: 482px) { .primary-navigation > div > .menu-wrapper > li > .sub-menu { left: 0; display: grid; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; min-width: max-content; position: absolute; top: 100%; padding-top: 8px; z-index: 88888; background-color: transparent; border: none; border-radius: var(--global--border-radius); -webkit-box-shadow: 0 12px 20px 0 rgb(68 68 68 / 12%); box-shadow: 0 12px 20px 0 rgb(68 68 68 / 12%); } .primary-navigation .sub-menu > .menu-item > .sub-menu { padding: 0; } .primary-navigation > div > .menu-wrapper > li > .sub-menu:before, .primary-navigation > div > .menu-wrapper > li > .sub-menu:after { content: ""; display: none; position: absolute; width: 0; top: -10px; left: var(--global--spacing-horizontal); border-style: solid; border-color: var(--primary-nav--border-color) transparent; border-width: 0 7px 10px 7px; } } @media only screen and (max-width: 481px) { .primary-navigation > div > .menu-wrapper { padding-bottom: 0; } .primary-navigation .sub-menu .menu-item:last-child { margin-bottom: 0; } } .primary-navigation .sub-menu .menu-item > a { padding: calc(1.25 * var(--primary-nav--padding)) var(--primary-nav--padding); display: block; font-size: var(--primary-nav--font-size-sub-menu-mobile); font-style: var(--primary-nav--font-style-sub-menu-mobile); } @media only screen and (min-width: 482px) { .primary-navigation .sub-menu .menu-item > a { display: flex; margin-right: calc(2 * var(--global--spacing-unit)); margin-left: calc(2 * var(--global--spacing-unit)); padding: calc(2 * var(--global--spacing-unit)); background-color: rgb(var(--global--color-white)); font-size: var(--primary-nav--font-size-sub-menu); font-style: var(--primary-nav--font-style); } .primary-navigation .sub-menu .menu-item:first-of-type > a { margin-top: calc(2 * var(--global--spacing-unit)); border-top-left-radius: var(--global--border-radius); border-top-right-radius: var(--global--border-radius); } .primary-navigation .sub-menu .menu-item:last-of-type > a { margin-bottom: calc(2 * var(--global--spacing-unit)); border-bottom-left-radius: var(--global--border-radius); border-bottom-right-radius: var(--global--border-radius); } } .primary-navigation .menu-item-has-children > .svg-icon { display: none; } @media only screen and (min-width: 482px) { .primary-navigation .menu-item-has-children > .svg-icon { display: inline-block; height: 100%; } .primary-navigation .menu-item-has-children .sub-menu .svg-icon { display: none; } } /* * CONTENT */ .site { display: flex; flex-direction: column; } .site-content { position: relative; border-bottom-left-radius: calc(10 * var(--global--spacing-unit)); } .site-content:after { position: absolute; bottom: 0; left: 0; z-index: -10; width: 2.5rem; height: 2.5rem; border-bottom-left-radius: 2.5rem; background-color:var(--global--color-background); content: ""; box-shadow: -5px 10px 0px 5px #fff; } /* * FOOTER */ /* Reset */ .no-widgets .site-footer { display: flex; flex-wrap: wrap; margin: 0; padding: 0; } @media only screen and (min-width: 1200px) { .no-widgets .site-footer { flex-wrap: nowrap; } } .site-footer { background-color: var(--global--color-white); border-top-right-radius: calc(10 * var(--global--spacing-unit)); } @media only screen and (min-width: 1200px) { .site-footer > *:nth-child(1) { order: 2; } .site-footer > *:nth-child(2) { order: 1; } } .site-footer .footer-logo { position: relative; width: 100%; margin-right: calc(5 * var(--global--spacing-unit)); margin-left: calc(5 * var(--global--spacing-unit)); padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit) + 210px); text-align: center; } @media only screen and (min-width: 1200px) { .site-footer .footer-logo { align-content: end; width: 400px; min-width: 400px; margin-right: calc(5 * var(--global--spacing-unit)); margin-left: calc(5 * var(--global--spacing-unit)); } } .site-footer .footer-logo > img { /* padding-left: calc(10 * var(--global--spacing-unit)); */ max-height: var(--branding--logo--max-height); } .site-footer .footer-logo:after { content: ''; position: absolute; right: 0; bottom: 0; width: calc(100% - calc(10 * var(--global--spacing-unit))); height: 176px; background-color: var(--global--color-green-500); border-top-left-radius: calc(5 * var(--global--spacing-unit)); border-top-right-radius: calc(5 * var(--global--spacing-unit)); mix-blend-mode: multiply; } @media only screen and (min-width: 652px) { .site-footer .footer-logo:after { position: absolute; right: calc(50% - 260px); max-width: 480px; } } @media only screen and (min-width: 1200px) { .site-footer .footer-logo:after { position: absolute; right: 20px; max-width: 320px; } } .site-footer .footer-logo:before { content: ''; position: absolute; left: 0; bottom: 0; width: calc(100% - calc(10 * var(--global--spacing-unit))); height: 210px; background-color: var(--global--color-blue-500); border-top-left-radius: calc(5 * var(--global--spacing-unit)); border-top-right-radius: calc(5 * var(--global--spacing-unit)); } @media only screen and (min-width: 652px) { .site-footer .footer-logo:before { position: absolute; left: calc(50% - 260px); max-width: 480px; } } @media only screen and (min-width: 1200px) { .site-footer .footer-logo:before { position: absolute; left: 20px; max-width: 320px; } } .site-footer .footer-content { margin-right: calc(5 * var(--global--spacing-unit)); margin-left: calc(5 * var(--global--spacing-unit)); width: 100%; } .site-footer .footer-navigation { margin-top: 0; margin-bottom: 0; } .site-footer .footer-info { padding-top: calc(10 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(0 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); border-top-style: solid; border-top-width: 1px; border-top-color: var(--global--color-gray-200); font-size: var(--global--font-size-base); text-align: center; color: var(--global--color-gray-800); } @media only screen and (min-width: 1200px) { .site-footer .footer-info { padding-top: calc(5 * var(--global--spacing-unit)); padding-right: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(5 * var(--global--spacing-unit)); padding-left: calc(5 * var(--global--spacing-unit)); text-align: left; } } .site-footer .footer-info > span { display: block; } @media only screen and (min-width: 1200px) { .site-footer .footer-info > span { display: inline !important; } } .site-footer .footer-info a:link, .site-footer .footer-info a:active, .site-footer .footer-info a:visited { margin: 0 4px; text-decoration: none; } /* ========================================================================================================== */ /* ========================================================================================================== */ /* ========================================================================================================== */ /* * Page Detail */ /* .site-main > article */ .entry-title { font-size: var(--entry-header--font-size); letter-spacing: var(--heading--letter-spacing-h2); line-height: var(--heading--line-height-h2); text-align: center; overflow-wrap: break-word; color: var(--global--color-grey-900); } .entry-header > .entry-title { padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: 0; } /* * Info & Checklist Detail */ /* .site-main > article */ .info-header, /* .site-main > article */ .checklist-header { max-width: 100%; margin-bottom: -24px; padding-right: calc(2 * var(--global--spacing-horizontal)); padding-left: calc(2 * var(--global--spacing-horizontal)); padding-top: calc(10 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); background-color: var(--global--color-white); text-align: left; } /* .site-main > article */ .info-header > *, /* .site-main > article */ .checklist-header > * { max-width: 960px; width: 100%; margin: 0 auto; padding-top: 0; padding-bottom: 0; } .info-header:before, .checklist-header:before { position: absolute; top: -2.5rem; right: 0; width: 2.5rem; height: 2.5rem; content: var(--tw-content); --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)); } /* .site-main > article */ .intro { padding-right: calc(2 * var(--global--spacing-horizontal)); padding-left: calc(2 * var(--global--spacing-horizontal)); padding-top: calc(5 * var(--global--spacing-unit)); padding-bottom: calc(10 * var(--global--spacing-unit)); margin-bottom: calc(30 * var(--global--spacing-unit)); border-bottom-right-radius: 2.5rem; } /* .site-main > article */ .intro > * { max-width: 960px; width: 100%; } /* .site-main > article */ .intro:after { position: absolute; bottom: -2.5rem; left: 0px; z-index: -10; width: 2.5rem; height: 2.5rem; border-top-left-radius: 2.5rem; --tw-bg-opacity: 1; background-color: rgb(239 239 239 / var(--tw-bg-opacity, 1)); content: var(--tw-content); --tw-shadow: -5px -10px 0px 5px #FFFFFF; --tw-shadow-colored: -5px -10px 0px 5px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } /* ========================================================================================================== */ /* ========================================================================================================== */ /* ========================================================================================================== */ /* * FONTS */ /* work-sans-300 - 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: 'Work Sans'; font-style: normal; font-weight: 300; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/work-sans-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* work-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: 'Work Sans'; font-style: normal; font-weight: 300; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/work-sans-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* work-sans-500 - 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: 'Work Sans'; font-style: normal; font-weight: 500; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/work-sans-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* work-sans-700 - 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: 'Work Sans'; font-style: normal; font-weight: 700; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/work-sans-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* rubik-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: 'Rubik'; font-style: normal; font-weight: 300; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/rubik-v28-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* rubik-500 - 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: 'Rubik'; font-style: normal; font-weight: 500; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/rubik-v28-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ } /* rubik-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: 'Rubik'; font-style: normal; font-weight: 600; src: url('https://pio.care/wp-content/themes/pio.care/assets/fonts/rubik-v28-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ }