/* Theme Name: TwentyTwelve Child Description: Mattheis Twentytwelve Childtheme Text Domain: twentytwelve-child Author: Siegbert Mattheis, Japheth Kohl und Tobias Mayer Author URI: https://www.mattheis-berlin.de Template: twentytwelve Version: 1.0 Tags: __ __ _______ _______ _ _ ______ _____ _____ | \/ | /\|__ __|__ __| | | | ____|_ _|/ ____| | \ / | / \ | | | | | |__| | |__ | | | (___ | |\/| | / /\ \ | | | | | __ | __| | | \___ \ | | | |/ ____ \| | | | | | | | |____ _| |_ ____) | |_| |_/_/ \_\_| |_| |_| |_|______|_____|_____/ __ ________ _____ ____ ______ _____ ______ _ _ _______ _ _ _____ \ \ / / ____| __ \| _ \| ____| /\ / ____| ____| \ | |__ __| | | | __ \ \ \ /\ / /| |__ | |__) | |_) | |__ / \ | | __| |__ | \| | | | | | | | |__) | \ \/ \/ / | __| | _ /| _ <| __| / /\ \| | |_ | __| | . ` | | | | | | | _ / \ /\ / | |____| | \ \| |_) | |____ / ____ \ |__| | |____| |\ | | | | |__| | | \ \ \/ \/ |______|_| \_\____/|______/_/ \_\_____|______|_| \_| |_| \____/|_| \_\ ____ ______ _____ _ _____ _ _ | _ \| ____| __ \| | |_ _| \ | | | |_) | |__ | |__) | | | | | \| | | _ <| __| | _ /| | | | | . ` | | |_) | |____| | \ \| |____ _| |_| |\ | |____/|______|_| \_\______|_____|_| \_|–––––––––––––––––––––––––––––––––––––––––––––––––*/ /* Variables General Page Layout Content WPBakery Page Builder Fonts Change Font Size Header Sticky Header Changes Header Image Buttons Breadcrumbs Homepage / Startseite Kategorie Seiten Beiträge Kontaktformular Contact Box Sidebar Search Results / Archives Entry Meta Footer Copyright Line To Top Button */ /*–––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––*/ /*------------------------------- Variables ------------------------------*/ :root { /* Color */ --light-grey: #ededed; --grey: #484847; --dark-grey: #333; --link-color: #6585c1; --link-color-hover: #5d749f; --link-color-light: #96afdf; --link-color-light-hover: #c3d7ff; --blockquote-font-color: darkorange; --primary-color-sha: #400314; --bordeaux: #4c0528; --light-petrol: #248e8e; --wine-red: #92082d; --color-focus: #92082d; --button-color-bg: #92082d; --button-color-bg: #4c0528; --button-color-bg: #000; --button-color-font: #fff; --footer-bg: #4c0528; --footer-bg: #000; --image-border-radius: 5px; --box-border-radius: 5px; --side-gap-general: 16px; /* Header */ /* --top-header-background: #4c0528; */ --top-header-background: #000; /* Mobile Menu */ --mobile-menu-color: #4c0528; --mobile-menu-color: #000; --mobile-menu-font-color: #fff; --mobile-menu-font-color-hover: #eb849f; --mobile-menu-font-color-hover: #fff; --mobile-menu-button-color-hover: #4c0528; --mobile-menu-button-color-hover: #000; --mobile-menu-button-color: #4c0528; --mobile-menu-button-color: #000; /* Desktop Menu */ --menu-font-color: #000; --menu-desktop-first-layer-hover: #4c0528; --menu-desktop-first-layer-hover: #000; --menu-desktop-first-layer-font-hover: #630333; --menu-desktop-first-layer-font-hover: #000; --menu-desktop-submenu-font-hover: #eb849f; --menu-desktop-submenu-font-hover: #fff; /* Sub Menu */ --submenu-color: #4c0528; --submenu-color: #000; --submenu-font-color: #fff; --submenu-fourth-layer-color: #4c0528; --submenu-fourth-layer-color: #000; /* Submenu Trigger */ --trigger-background-color: transparent; /* Menu Item Marker */ --current-menu-item-font-color: #eb849f; --current-menu-item-font-color: #fff; --current-menu-item-mobile-font-color: #eb849f; --current-menu-item-mobile-font-color: #fff; /* Transitions */ --transition-duration-sticky-header: .3s; --transition-timing-function-sticky-header: ease-in; --transition-buttons: all .2s ease-in-out; } @media screen and (min-width: 768px){ :root { --side-gap-general: 24px; } } @media screen and (min-width: 1024px){ :root { --side-gap-general: 32px; } } @media screen and (min-width: 1200px){ :root { --side-gap-general: 40px; } } @media screen and (min-width: 1600px){ :root { --side-gap-general: 64px; } } /*------------------------------- General ------------------------------*/ body { max-width: 100%; background-color: #fff; } .noscroll { overflow: hidden; } #page { margin: 0; padding: 0; box-shadow: none; max-width: none; } .no-display, .visuallyhidden { border: 0; clip: rect(0 0 0 0); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; white-space: nowrap; } /*----- Image -----*/ /* Image Appearance */ .entry-content img, .comment-content img, .widget img, img.header-image, .author-avatar img, img.wp-post-image { box-shadow: none; border-radius: 0; } /*--- Image Caption ---*/ figcaption, .entry-content > .wpb-content-wrapper .vc_row.wpb_row .wpb_wrapper figcaption { font-style: italic; margin-top: 5px; font-size: .75em; } #primary.site-content { margin: 0; } #primary.site-content article { border-bottom: none; margin-bottom: 0; padding: 0; } #secondary.widget-area { padding: 0; } /*header.entry-header { display: none; }*/ /*----- Scrollbar -----*/ body::-webkit-scrollbar { width: 10px; } body::-webkit-scrollbar-track { background: rgba(146, 8, 45, .2); } body::-webkit-scrollbar-thumb { background: var(--bordeaux); border-radius: 0; } body::-webkit-scrollbar-thumb:hover { background: var(--wine-red); } /*----- Skip to Content Button -----*/ #skip-to-content { position: fixed; top: -1000px; left: -1000px; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); white-space: nowrap; z-index: -1; } #skip-to-content:focus { position: fixed; top: 10px; left: 10px; width: auto; height: auto; overflow: visible; clip: auto; clip-path: none; white-space: normal; z-index: 1000; background-color: var(--bordeaux); color: #fff; padding: 10px; border: 2px solid #fff; border-radius: 5px; box-shadow: 0 0 10px rgba(0,0,0,.5); z-index: 1000; } body.admin-bar #skip-to-content:focus { top: 56px; } @media screen and (min-width: 783px){ body.admin-bar #skip-to-content:focus { top: 42px; } } /*------------------------------- Page Layout Content ------------------------------*/ #page { background-image: url(/wp-content/uploads/2025/01/Marmor-Hintergrund-Shayegan-Medical.webp); background-size: cover; background-position: center; background-attachment: fixed; background-repeat: no-repeat; } #page > #main { width: 100%; max-width: 1920px; margin: 0 auto; box-sizing: border-box; } #page > #main > * { width: 100%; padding: 0; padding-left: var(--side-gap-general); padding-right: var(--side-gap-general); margin: 0; box-sizing: border-box; } #page > #main > #primary { margin-top: 0px; } /* Overwrite Parent Theme Text Gaps*/ :is(.entry-content, .entry-summary, .comment-content, .mu_register) :is(p, h1, h2, h3, h4, h5, h6) { margin-bottom: 0; margin-top: 0; } /*----- Gaps vertically consistent -----*/ :root { --sections-margin-bottom: 20px; --widgets-margin-bottom: 20px; } @media screen and (min-width: 1024px){ :root { --sections-margin-bottom: 32px; --widgets-margin-bottom: 32px; } } /*------------------------------- Elementor Page Builder ------------------------------*/ .entry-content > .elementor > .elementor-element, .e-con-inner > .elementor-element { padding-left: 0; padding-right: 0; } /* Texte Elements */ .elementor-widget-text-editor > .elementor-widget-container > *:not(:last-child) { margin-bottom: var(--widgets-margin-bottom); } @media screen and (min-width: 1024px){ } /*------------------------------- WPBakery Page Builder ------------------------------*/ /* Rows */ .entry-content .vc_row { margin-left: 0; margin-right: 0; margin-bottom: 40px; position: relative; } @media screen and (min-width: 1024px){ .entry-content .vc_row { margin-bottom: 70px; } } /* Row max width 1400px */ #page .entry-content .vc_row.row-narrow { width: 100%; max-width: 1400px; margin-left: auto; margin-right: auto; } .entry-content .vc_row > .vc_column_container > .vc_column-inner { padding: 0; } /* Row has fill */ /*@media screen and (min-width: 768px){ .entry-content .vc_row.vc_row-has-fill { padding: 0 !important; } }*/ .entry-content .vc_row.vc_row-has-fill { padding: 20px 30px; } @media screen and (min-width: 1024px){ .entry-content .vc_row.vc_row-has-fill { padding: 30px 50px; } } /* Row full height */ /* First Row on Page */ .entry-content > .wpb-content-wrapper > .vc_row.vc_row-o-full-height, .entry-content > .wpb-content-wrapper > .vc_row .vc_row-o-full-height { max-height: 800px; margin-bottom: 0; } /* Columns */ .entry-content .vc_row .vc_column_container > .vc_column-inner { margin-bottom: 35px; } .entry-content .vc_row .vc_column_container:last-child > .vc_column-inner { margin-bottom: 0; } @media screen and (min-width: 768px){ .entry-content .vc_row .vc_column_container > .vc_column-inner { margin-bottom: 0; } } .entry-content .vc_col-has-fill>.vc_column-inner, .entry-content .vc_row-has-fill+.vc_row-full-width+.vc_row>.vc_column_container>.vc_column-inner, .entry-content .vc_row-has-fill+.vc_row>.vc_column_container>.vc_column-inner, .entry-content .vc_row-has-fill>.vc_column_container>.vc_column-inner { padding-top: 0; } /* Column has fill */ .entry-content .vc_row.wpb_row .vc_col-has-fill.vc_column_container > .vc_column-inner { padding: 20px 30px; } @media screen and (min-width: 1024px){ .entry-content .vc_row.wpb_row .vc_col-has-fill.vc_column_container > .vc_column-inner { padding: 30px 50px; } } /* Column Gaps */ .entry-content .vc_row.vc_column-gap-1 { margin-left: -.5px; margin-right: -.5px; } .entry-content .vc_row.vc_column-gap-2 { margin-left: -1px; margin-right: -1px; } .entry-content .vc_row.vc_column-gap-3 { margin-left: -1.5px; margin-right: -1.5px; } .entry-content .vc_row.vc_column-gap-4 { margin-left: -2px; margin-right: -2px; } .entry-content .vc_row.vc_column-gap-5 { margin-left: -2.5px; margin-right: -2.5px; } .entry-content .vc_row.vc_column-gap-10 { margin-left: -5px; margin-right: -5px; } .entry-content .vc_row.vc_column-gap-15 { margin-left: -7.5px; margin-right: -7.5px; } .entry-content .vc_row.vc_column-gap-20 { margin-left: -10px; margin-right: -10px; } .entry-content .vc_row.vc_column-gap-25 { margin-left: -12.5px; margin-right: -12.5px; } .entry-content .vc_row.vc_column-gap-30 { margin-left: -15px; margin-right: -15px; } .entry-content .vc_row.vc_column-gap-35 { margin-left: -17.5px; margin-right: -17.5px; } @media screen and (max-width: 767px){ .entry-content .vc_row.wpb_row > .wpb_column.vc_column_container { padding-left: 0 !important; padding-right: 0 !important; } .entry-content .vc_row.vc_column-gap-1, .entry-content .vc_row.vc_column-gap-2, .entry-content .vc_row.vc_column-gap-3, .entry-content .vc_row.vc_column-gap-4, .entry-content .vc_row.vc_column-gap-5, .entry-content .vc_row.vc_column-gap-10, .entry-content .vc_row.vc_column-gap-15, .entry-content .vc_row.vc_column-gap-20, .entry-content .vc_row.vc_column-gap-25, .entry-content .vc_row.vc_column-gap-30, .entry-content .vc_row.vc_column-gap-35 { margin-left: 0; margin-right: 0; } } /* Content Elements */ .entry-content > .wpb-content-wrapper > .vc_row .wpb_wrapper > *:not(:first-child) { margin-top: 35px; margin-bottom: 0; } .entry-content > .wpb-content-wrapper > .vc_row .wpb_wrapper > *:first-child { margin-top: 0; margin-bottom: 0; } .entry-content > .wpb-content-wrapper > .vc_row.wpb_row .wpb_wrapper h1 { margin-top: 35px; } /* Text Elements */ .wpb_text_column { break-inside: avoid-column; } .wpb_text_column > .wpb_wrapper > * { max-width: 1400px; } .wpb_text_column > .wpb_wrapper > .centered { margin-left: auto; margin-right: auto; } /* Hilfebereich FAQ */ .vc_toggle .vc_toggle_title { background-color: var(--link-color); border-radius: 15px; } .vc_toggle .vc_toggle_title h4 { font-size: 1em; } /* Plus Icon */ .entry-content .vc_toggle_size_md.vc_toggle_default .vc_toggle_icon::before, .entry-content .vc_toggle_size_md.vc_toggle_default .vc_toggle_icon { width: 12px; height: 2px; border-color: #000; } .entry-content .vc_toggle_size_md.vc_toggle_default .vc_toggle_icon::after { height: 12px; width: 2px; background-color: #000; } /* Text with Multiple Columns */ @media screen and (min-width: 768px){ .text-three-columns, .text-two-columns { column-count: 2; } } @media screen and (min-width: 1366px){ .text-three-columns { column-count: 3; } } /*------------------------------- Fonts ------------------------------*/ * { hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; white-space: normal; box-sizing: border-box; color: #000; font-family: 'Albert Sans', sans-serif; font-weight: 300; } /*----- Text Formatting Inline Elements -----*/ /* Bold */ strong, b { font-family: inherit; color: inherit; font-weight: 500; font-style: inherit; } /* Italic */ em, i { font-family: inherit; color: inherit; font-weight: inherit; font-style: italic; } /* Inline */ span { font-family: inherit; color: inherit; font-weight: inherit; font-style: inherit; } /*----- Blockquote -----*/ blockquote { color: var(--blockquote-font-color); background-color: #eee; font-size: 1.2em; } blockquote * { font-family: inherit; font-style: normal; color: inherit; } /*----- Font Family -----*/ .elementor-widget-button .elementor-widget-container .elementor-button, .elementor-widget-heading .elementor-widget-container .elementor-heading-title { font-family: 'Albert Sans', sans-serif; } /*----- Custom Heading Styles -----*/ :is(h1, h2, h3, h4, h5, h6), :is(.entry-content, .comment-content) :is(h1, h2, h3, h4, h5, h6), .elementor-widget-heading .elementor-widget-container .elementor-heading-title { font-weight: 400; text-transform: none; } /* H1 Page Title */ h1, .entry-header h1.entry-title, .page-header h1.page-title, .archive-header h1.archive-title { margin-left: auto; margin-right: auto; text-transform: none; font-weight: 400; } .entry-header h1.entry-title, .page-header h1.page-title, .archive-header h1.archive-title { text-align: center; } /* Slogan */ .slogan { font-size: 1.5em; } .slogan * { text-shadow: 0 0 3px rgba(255,255,255,.7); } /*----- General Font Styles -----*/ :is(h1, h2, h3, h4, h5, h6), :is(.entry-content, .comment-content) :is(h1, h2, h3, h4, h5, h6), :is(p, ol, ul), :is(.entry-content, .comment-content) :is(p, ol, ul) { line-height: 1.2; padding: 0; } :is(p, ol, ul, li), :is(.entry-content, .comment-content) :is(p, ol, ul, li) { line-height: 1.5; } /*----- Links -----*/ a, a:is(:any-link, :hover, :focus, :active) { text-decoration: none; outline: none; font-family: inherit; font-weight: inherit; } :is(a, button, input, textarea, select):is(:focus-visible) { outline: 2px solid var(--color-focus) !important; } /* Hover */ a:is(:hover, :focus, :focus-within, :focus-visible, :active) { text-decoration: none; } /* in Paragraph (content area #main) */ p a:any-link, .wpb_text_column a:any-link { color: #6585c1; color: var(--link-color); } p a:is(:hover, :focus, :focus-within, :focus-visible, :active), .wpb_text_column a:is(:hover, :focus, :focus-within, :focus-visible, :active) { text-decoration: underline; color: #5d749f; color: var(--link-color-hover); } /*----- Lists -----*/ :is(.entry-content, .comment-content, .mu_register) :is(ul, ol) { list-style-position: outside; padding-left: 28px; } ul + ul, .entry-content .vc_row.wpb_row .wpb_wrapper ul + ul, .comment-content ul + ul { margin-top: 0; } :is(.entry-content, .comment-content, .mu_register) li { list-style-position: outside; margin: 0; break-inside: avoid-column; } /*--- Text Colors -----*/ /* White Text */ :is(.text-white, .white-text, .weiss-text, .text-weiss) * { color: #fff; } /* Links */ :is(.text-white, .white-text, .weiss-text, .text-weiss) a:is(:any-link, :link, :visited) { color: #96afdf; color: var(--link-color-light); } :is(.text-white, .white-text, .weiss-text, .text-weiss) a:is(:hover, :focus, :focus-within, :focus-visible, :active) { color: #c3d7ff; color: var(--link-color-light-hover); } /* Headlines */ :is(h1, h2, h3, h4, h5, h6), :is(.entry-content, .comment-content) :is(h1, h2, h3, h4, h5, h6) { color: var(--primary-color-sha); color: #000; } /*----- Font Size -----*/ body, body.global-font-size-small { font-size: 18px; transition: font-size .2s linear; } body.global-font-size-medium { font-size: 20px; } body.global-font-size-big { font-size: 22px; } * { font-size: 1em; } header.site-header { font-size: .8em; } header.site-header * { font-size: 1em; } footer#colophon { font-size: .8em; } sub/* Tiefstellen */, sup/* Hochstellen */ { font-size: .6em; } /* Widget Titles */ .widget-title { font-weight: 400; font-size: 1.2em; text-transform: none; } .elementor section h1, :is(.entry-content, .comment-content, .entry-header, .page-header, .archive-header) :is(h1, h1.entry-title, h1.page-title, h1.archive-title) { font-size: 1.7em; } .elementor section h2, :is(.entry-content, .comment-content, .entry-header) h2 { font-size: 1.5em; } .elementor section h3, :is(.entry-content, .comment-content, .entry-header) h3 { font-size: 1.4em; } .elementor section h4, :is(.entry-content, .comment-content, .entry-header) h4 { font-size: 1.3em; } .elementor section h5, :is(.entry-content, .comment-content, .entry-header) h5 { font-size: 1.2em; } .elementor section h6, :is(.entry-content, .comment-content, .entry-header) h6 { font-size: 1.1em; } /*----- Tablet portrait -----*/ @media screen and (min-width: 768px){ body, body.global-font-size-small { font-size: 20px; } body.global-font-size-medium { font-size: 22px; } body.global-font-size-big { font-size: 24px; } header.site-header { font-size: .6em; } } /*----- Tablet landscape -----*/ @media screen and (min-width: 1024px){ header.site-header { font-size: .7em; } } /*----- Tablet big landscape -----*/ @media screen and (min-width: 1366px){ body, body.global-font-size-small { font-size: 22px; } body.global-font-size-medium { font-size: 24px; } body.global-font-size-big { font-size: 26px; } header.site-header { font-size: .8em; } .elementor section h1, :is(.entry-content, .comment-content, .entry-header, .page-header, .archive-header) :is(h1, h1.entry-title, h1.page-title, h1.archive-title) { font-size: 2.5em; } .elementor section h2, :is(.entry-content, .comment-content, .entry-header) h2 { font-size: 2em; } .elementor section h3, :is(.entry-content, .comment-content, .entry-header) h3 { font-size: 1.7em; } .elementor section h4, :is(.entry-content, .comment-content, .entry-header) h4 { font-size: 1.5em; } .elementor section h5, :is(.entry-content, .comment-content, .entry-header) h5 { font-size: 1.3em; } .elementor section h6, :is(.entry-content, .comment-content, .entry-header) h6 { font-size: 1.15em; } } /*----- Desktop -----*/ @media screen and (min-width: 1500px){ /* footer * { font-size: 18px; } */ } @media screen and (min-width: 1600px){ /* header.site-header * { font-size: 16px; } */ } /*------------------------------- Header ------------------------------*/ /* Sticky Container */ .header-container { position: fixed; top: 0; left: 0; width: 100%; z-index: 99; } /* Logged-In */ .logged-in.admin-bar .header-container { top: 46px; } @media screen and (min-width: 783px){ .logged-in.admin-bar .header-container { top: 32px; } } #masthead.site-header { width: 100% !important; padding: 0; background: transparent; /* background-color: #fff; background-color: rgba(255,255,255,.7); */ border-bottom: 1px solid #000; color: #000; position: relative; z-index: 10; background-color: rgba(255,255,255,0); } #masthead.site-header.boxShadow { background-color: rgba(255,255,255,.8); /* box-shadow: 0px 0px 6px rgb(0 0 0 / 60%); */ } .header_row_two { } #headerwrap > * { padding: 10px 12px 0; } @media screen and (min-width: 768px){ #headerwrap > * { padding-left: 30px; padding-right: 30px; } } @media screen and (min-width: 1200px){ #headerwrap > * { padding-left: 50px; padding-right: 50px; } } @media screen and (min-width: 1600px){ #headerwrap > * { padding-left: 80px; padding-right: 80px; } } /*---------- Links ----------*/ #masthead.site-header a:is(:any-link, :link, :visited) { } /* Hover */ #masthead.site-header a:is(:hover, :focus, :focus-within, :focus-visible, :active) { } /*---------- Header Info Section - first header row -----*/ #header-info { background-color: var(--top-header-background); display: flex; flex-direction: row; justify-content: space-between; padding-bottom: 8px; } #header-info :is(.contact-links, .social-links) { display: flex; flex-direction: row; } .header_row_one { color: #465497; color: var(--dark-blue); font-size: 16px; font-weight: 700; padding: 0; margin: 0; width: 100%; clear: both; float: none; width: auto; display: flex; justify-content: flex-end; align-items: center; } /*---- Widgets ----*/ .header_row_one > * { float: right; display: flex; align-items: center; margin: 0 20px 0 0; font-family: 'Albert Sans', sans-serif; } .header_row_one > *:last-child { margin: 0 0 0 0 !important; } /* Links */ /* Hover */ #masthead.site-header .header_row_one a:is(:hover, :focus, :focus-within, :focus-visible, :active) { opacity: .5; } /* Contact Links */ .contact-links > a:first-child{ padding-right: 20px } @media screen and (max-width: 600px){ .contact-links > a span { display: none; } .contact-links > a:first-child{ padding-right: 0 } } .contact-links a { display: flex; align-items: center; color: #fff; } .contact-links a:is(:hover, :focus, :focus-within, :focus-visible, :active) { } /* Icons */ .header_row_one .contact-links a img { margin: 0 10px 0 0; } /*---------- second header row (Logo, Navigation) -----*/ .header_row_two { display: flex; justify-content: space-between; align-items: stretch; } /* Columns */ .header-col { display: flex; align-items: flex-end; margin-bottom: 0; } /* Column 1 */ .header-col.header-col-1 { margin-right: 30px; margin-bottom: 8px; } /* @media screen and (min-width: 1023px){ .header-col.header-col-1 { margin-bottom: 80px; } } */ /*---------- Logo -----*/ #logo { clear: none; float: left; margin-top: 0; } #logo a:is(:hover, :focus, :focus-within, :focus-visible, :active) { opacity: .8; cursor: pointer; } #logo img { height: 60px !important; width: auto !important; } @media screen and (min-width: 1024px){ #logo img { height: 80px !important; } } /*---------- Hauptnavigation | Top Menu -----*/ #site-navigation.main-navigation { clear: none; float: right; height: 100%; margin: 0; padding: 0; display: flex !important; align-items: flex-end; } /*----- Hamburger Menu Button -----*/ #site-navigation.main-navigation .menuToggleBtn { display: inline-block; position: relative; height: 23px; width: 25px; padding: 10px; background: transparent; border: none; border-radius: 100px; box-shadow: none; box-sizing: content-box; z-index: 2; } #site-navigation.main-navigation .menuToggleBtn > div { position: relative; top: 0; left: 0; height: 3px; width: 25px; background-color: var(--mobile-menu-button-color); border-radius: 10px; transform-origin: 0 0; transform: rotate(0deg); transition-duration: .2s; transition-timing-function: linear; transition-property: transform, top, left, width; } #site-navigation.main-navigation .menuToggleBtn > div:first-child { top: -8px; } #site-navigation.main-navigation .menuToggleBtn > div:nth-child(2) { top: -1px; } #site-navigation.main-navigation .menuToggleBtn > div:nth-child(3) { top: 6px; } /* Hover */ #site-navigation.main-navigation .menuToggleBtn:hover div { background-color: var(--mobile-menu-button-color-hover); } /* Active */ /* Close Button */ #site-navigation.main-navigation .menuToggleBtn.menuToggle div { background-color: var(--mobile-menu-button-color); } #site-navigation.main-navigation .menuToggleBtn.menuToggle div:first-child { transform: rotate(41deg); width: 33px; top: -8px; left: 2px; } #site-navigation.main-navigation .menuToggleBtn.menuToggle div:nth-child(2) { transform: rotate(-41deg); width: 33px; top: 11px; } #site-navigation.main-navigation .menuToggleBtn.menuToggle div:nth-child(3) { opacity: 0; } /*----- Menu Items -----*/ .main-navigation li.menu-item a { line-height: 1.4; display: flex; align-items: center; } /*--- First Layer ---*/ .main-navigation ul:is(.menu, .nav-menu) > li.menu-item { margin: 0 40px 0 0; } .main-navigation ul:is(.menu, .nav-menu) > li.menu-item:last-child { margin: 0 10px 0 0; } /*--- Current ---*/ #site-navigation.main-navigation :is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a { font-weight: 300; } /* Mobile Menu */ .main-navigation .menu-wrapper-mobile :is(ul:is(.menu, .nav-menu), ul:is(.menu, .nav-menu) ul.sub-menu) li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a { color: var(--current-menu-item-mobile-font-color); position: relative; } .main-navigation .menu-wrapper-mobile :is(ul:is(.menu, .nav-menu), ul:is(.menu, .nav-menu) ul.sub-menu) li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a::before { content: ''; display: block; width: 6px; height: 2px; /* border-radius: 50%; */ position: absolute; top: calc(50% - 1px); left: 0; background-color: #fff; } /* Desktop Menu */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a { /* color: var(--bordeaux); */ } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a::after { content: ''; display: block; width: 6px; height: 2px; /* border-radius: 50%; */ position: absolute; top: unset; bottom: 4px; left: calc(50% - 3px); background-color: #000; } /* Sub Menu*/ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.menu-item ul.sub-menu li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a { color: var(--current-menu-item-font-color); position: relative; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item > ul.sub-menu > li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a { padding-left: 20px; font-weight: 500 !important; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.menu-item ul.sub-menu li.menu-item:is(.current-menu-item, .current-menu-ancestor, .current_page_item, .current_page_ancestor) > a::before { content: ''; display: block; width: 6px; height: 2px; position: absolute; top: calc(50% - 1px); left: 4px; background-color: #fff; } /*--- Hover ---*/ .main-navigation li.menu-item > a { transition: padding .2s linear; } .main-navigation .menu-wrapper-desktop ul:is(.menu, .nav-menu) ul.sub-menu ul.sub-menu li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active) { padding-left: 28px; padding-right: 12px; } /* Mobile Menu */ .main-navigation .menu-wrapper-mobile :is(ul:is(.menu, .nav-menu), ul:is(.menu, .nav-menu) ul.sub-menu) li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active) { color: var(--mobile-menu-font-color-hover); padding-left: 28px; padding-right: 12px; } /*--- Menu Item Has Children ---*/ /* Submenu Trigger */ li.menu-item-has-children > .trigger { width: 45px; height: 45px; border-radius: 0; border: none; background: var(--trigger-background-color); float: right; display: inline-block; display: flex; padding: 0; justify-content: center; align-items: center; position: absolute; top: 0; left: unset; right: 0; cursor: pointer; } li.menu-item-has-children > .trigger > div { height: 100%; width: 100%; /* border: 1px solid #6a6a6a; */ border-top: none; border-left: none; background-color: transparent; background-image: url('data:image/svg+xml,'); background-size: 35%; background-repeat: no-repeat; background-position: center; transform: rotate(0deg); transition: all .2s linear; } /* Active and Hover Status */ li.menu-item-has-children.active > .trigger > div, li.menu-item-has-children > .trigger:is(:hover, :focus, :focus-within, :focus-visible, :active) > div { background-image: url('data:image/svg+xml,'); transform: rotate(180deg); } ul:is(.menu, .nav-menu) li.menu-item.menu-item-has-children:before { display: none; /* top: 5px ; right: 7px; */ } /* Hover */ li.menu-item-has-children:hover > .trigger, li.menu-item-has-children:hover > .trigger div { border-color: var(--mobile-menu-button-color-hover); } /* Sub Menu */ ul.sub-menu li.menu-item-has-children:hover > .trigger div { margin-top: 0; } /*----- Sub Menu -----*/ ul.sub-menu { display: flex; flex-direction: column; /* box-shadow: 0 0 10px rgba(255,255,255,.5); */ padding-left: 12px; } ul:is(.menu, .nav-menu) ul.sub-menu { background-color: rgba(0,0,0,.1); } .main-navigation li ul.sub-menu li { margin: 0; } .main-navigation li ul.sub-menu li a { font-size: 1em; text-align: left; color: #fff; } .menu-wrapper-mobile ul.sub-menu { padding-left: 8px; border-left: 1px solid #999 !important; } /*----------- Smartphone Menu ------------*/ #site-navigation.main-navigation .menu-wrapper-desktop { display: none; } #site-navigation.main-navigation .menu-wrapper-mobile { display: none; position: absolute; top: 100%; left: unset; right: 100vw; /* max-height: calc(100vh - 92px); */ width: 100%; /* max-width: 75%; min-width: 280px; */ /* padding-bottom: 100px; */ padding: 20px; background-color: #eee; background-color: var(--mobile-menu-color); /* box-shadow: 0px 0px 6px rgb(0 0 0 / 60%); */ overflow: scroll !important; transition: right linear .2s; z-index: 1; } #site-navigation.main-navigation .menu-wrapper-mobile.menuToggleOn { display: block; right: 0; } #site-navigation.main-navigation .menu-wrapper > *:not(:first-child) { margin-top: 20px; } /* Before Nav Menu */ .social-icons { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } /* Icons */ header .social-icons a { margin: 0 10px; display: flex; flex-direction: row; justify-content: center; align-items: center; gap: 6px; color: #fff; margin: 0; width: 25px; width: auto; } .social-icons .social-icon { /* width: 30px; */ width: 100%; width: 25px; height: auto; filter: grayscale(1); } .social-icons a:is(:hover, :focus, :focus-within, :focus-visible, :active) .social-icon { filter: grayscale(0); } @media screen and (max-width: 600px){ header .social-icons a span { display: none; } } /* After Nav Menu */ #site-navigation.main-navigation .menu-wrapper .after-nav-header > * { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; } /* Menu Items */ .main-navigation ul:is(.menu, .nav-menu) li.menu-item { position: relative; display: block; margin-right: 0; margin-top: 0; border-bottom: 1px solid #ddd; } .main-navigation ul:is(.menu, .nav-menu) li.menu-item:last-child { border-bottom: none; } /* .main-navigation ul:is(.menu, .nav-menu) > .menu-item > ul.sub-menu li > ul.sub-menu li { background: #d9d9d9; background-color: #d9d9d9; border-bottom: 1px solid #c5c5c5; } */ .main-navigation ul:is(.menu, .nav-menu) li.menu-item a, .main-navigation ul:is(.menu, .nav-menu) > li.menu-item > ul.sub-menu li a { padding: 10px 20px; height: 45px; width: 100%; text-align: left; text-transform: none; display: inline-flex; align-items: center; background: transparent; border: none; color: var(--mobile-menu-font-color); } /* .main-navigation ul:is(.menu, .nav-menu) > li.menu-item > ul.sub-menu li a { padding-left: 30px; } .main-navigation ul:is(.menu, .nav-menu) > li.menu-item > ul.sub-menu > li.menu-item > ul.sub-menu li a { padding-left: 40px; } */ /* Sub Menu */ ul:is(.menu, .nav-menu) ul.sub-menu { display: none !important; position: static; height: 0; width: auto; clip: unset; overflow: hidden; height: auto; overflow: visible; transition: height .5s linear .5s; } ul:is(.menu, .nav-menu) .menu-item-has-children.active > ul.sub-menu { display: block !important; } /*--------------- Desktop Menu ---------------*/ #site-navigation.main-navigation .menu-wrapper-desktop { position: static; width: auto; padding: 0; background-color: transparent; box-shadow: none; overflow: visible !important; } #site-navigation.main-navigation .menu-wrapper-desktop ul:is(.menu, .nav-menu) { /* Show Menu */ display: block !important; position: static; max-width: none; padding: 0; box-shadow: none; border: none; overflow: visible !important; } /* Before & After Menu */ /* #site-navigation.main-navigation .menu-wrapper-desktop :is(.before-nav-header, .after-nav-header) { display: none; } */ /* List Items */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.menu-item { border-bottom: none; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item { margin: 0; float: left; } .menu-wrapper-desktop li.menu-item-has-children > .trigger { width: 20px; height: 45px; border-left: none; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item.menu-item-has-children { padding-right: 20px; } .menu-wrapper-desktop li.menu-item:not(:last-child) { margin-right: 10px; } .menu-wrapper-desktop li.menu-item > a { padding: 10px 10px; height: 45px; white-space: nowrap; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.menu-item a { color: var(--menu-font-color); } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item.menu-item-has-children > a { padding-right: 5px; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu li a { padding: 10px 20px; color: var(--submenu-font-color); } /* 1st Layer */ /* Hover */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item.active > :is(a, .trigger), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active) + .trigger, .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item > .trigger:is(:hover, :focus, :focus-within, :focus-visible, :active), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item > a:has( + .trigger:is(:hover, :focus, :focus-within, :focus-visible, :active) ) { background-color: var(--menu-desktop-first-layer-hover); color: #fff; } /* Sub Menu */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) ul.sub-menu { position: absolute; min-width: 100%; background-color: var(--submenu-color); /* box-shadow: 0px 0px 6px rgb(0 0 0 / 60%); */ } /* 3rd Layer */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li > ul.sub-menu > li > ul.sub-menu { border-left: 2px solid #999; } /* 4th Layer */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) ul.sub-menu ul.sub-menu ul.sub-menu { position: static; /* width: calc(100% + 30px); */ background-color: var(--submenu-fourth-layer-color); } /* Hover */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu > li.menu-item.active > :is(a, .trigger), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu > li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu > li.menu-item > a:is(:hover, :focus, :focus-within, :focus-visible, :active) + .trigger, .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu > li.menu-item > .trigger:is(:hover, :focus, :focus-within, :focus-visible, :active), .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item ul.sub-menu > li.menu-item > a:has( + .trigger:is(:hover, :focus, :focus-within, :focus-visible, :active) ) { color: var(--menu-desktop-submenu-font-hover); } /* Submenu Trigger */ .menu-wrapper-desktop li.menu-item-has-children > .trigger { width: 20px; height: 45px; border-left: none; } .menu-wrapper-desktop li.menu-item-has-children > .trigger > div { background-size: 60%; } /* 1st Layer */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item-has-children > .trigger > div { background-image: url('data:image/svg+xml,'); } /* 2nd Layer */ .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li > ul.sub-menu > li.menu-item-has-children > .trigger > div { background-image: url('data:image/svg+xml,'); background-size: 35%; } /* 3d Layer and more */ .menu-wrapper-desktop ul.sub-menu ul.sub-menu > li.menu-item-has-children > .trigger > div { background-image: url('data:image/svg+xml,'); } /*--- Mega Menu ---*/ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { flex-direction: row; flex-wrap: wrap; justify-content: space-between; padding: 20px; width: 100vw; left: 0; top: 200px; position: fixed; border-bottom: 1px solid #fff; } body.admin-bar .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { transform: translateY(46px); } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu.menu-item-has-children.active > ul.sub-menu { display: flex !important; } @media screen and (min-width: 783px){ body.admin-bar .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { transform: translateY(32px); } } @media screen and (min-width: 1400px){ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { padding-left: 40px; padding-right: 40px; } } @media screen and (min-width: 1600px){ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { padding-left: 6vw; padding-right: 6vw; } } @media screen and (min-width: 1800px){ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu { padding-left: 10vw; padding-right: 10vw; } } /*--- Icons ---*/ /* .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu.menu-item-has-children.active > ul.sub-menu > li > a::before { content: ''; display: inline-block; width: 28px; height: 28px; margin: -3px 4px 0 0; background-image: url(/wp-content/uploads/2024/10/basketball.png); background-size: contain; background-position: center; background-repeat: no-repeat; } */ /*--- Headlines Mega Menu ---*/ .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu .mm-headline > a { padding-left: 0; /* padding-bottom: 8px; margin-bottom: 8px; */ font-weight: 500; text-transform: uppercase; border-bottom: 1px solid transparent; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu .mm-headline > a:is(:hover, :focus, :focus-within, :focus-visible, :active) { border-color: #fff; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu .mm-headline > button.trigger { display: none; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) li.mega-menu > ul.sub-menu .mm-headline ul.sub-menu { display: flex !important; flex-direction: column; justify-content: flex-start; align-items: flex-start; padding: 0; margin: 0; width: 100%; position: static; } @media screen and (min-width: 1024px){ /* .menu-wrapper-desktop li.menu-item-has-children > .trigger { width: 30px; } .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item.menu-item-has-children { padding-right: 30px; } */ .main-navigation .menu-wrapper-desktop li.menu-item > a { padding: 10px 20px; } } /*--------------- Break Point ---------------*/ @media screen and (min-width: 860px){ #site-navigation.main-navigation .menuToggleBtn { /* Hide Toggle Button on Desktop */ display: none; } #site-navigation.main-navigation .menu-wrapper-desktop { display: block; display: flex; flex-direction: row; flex-wrap: wrap; } #site-navigation.main-navigation .menu-wrapper-mobile { display: none; } .before-nav-header-wrap { width: 100%; display: none; } } /*----- Search Header Menu -----*/ .menu-wrapper-desktop .after-nav-header-wrap { display: none; } .after-nav-header-wrap { display: flex; flex-direction: column; padding-left: 12px; } .after-nav-header-wrap a { display: flex; flex-direction: row; align-items: center; color: #fff; } .after-nav-header-wrap a:is(:hover, :focus, :focus-within, :focus-visible, :active) { color: #fff; text-decoration: underline; } .after-nav-header-wrap a img { margin-right: 5px; } /*----- Search Header Menu -----*/ /* Search Icon Lupe */ #searchbox { background: transparent; border: none; padding: 0; } #searchbox .search-menu { clear: none; float: left; display: flex; align-items: center; justify-content: center; /* padding: 0 5px; margin-top: 5px; */ padding: 10px; line-height: 2; cursor: pointer; } /* Search Form */ .after-header { width: 100%; margin: 0 auto; padding: 10px 30px 0; background-color: #ededed; background-color: var(--light-grey); position: absolute; z-index: 9; transform: translateY(-100%); transition: all .5s linear; box-shadow: 0px 0px 6px rgb(0 0 0 / 60%); } .after-header > div { width: 100%; max-width: 1200px; max-width: none; margin: 0 auto; } @media screen and (max-width: 767px){ .header_row_one { display: flex; justify-content: center; } } @media screen and (max-width: 530px){ .header_row_one { margin-bottom: 10px; } } @media screen and (min-width: 768px){ .header_row_one > * { margin: 0 38px 0 0; } .after-header { padding-left: 50px; padding-right: 50px; } } @media screen and (min-width: 1024px){ .after-header { display: flex; justify-content: center; } } @media screen and (min-width: 1200px){ } @media screen and (min-width: 1366px){ .after-header { padding-left: 50px; padding-right: 50px; } } @media screen and (min-width: 1600px){ .after-header { padding-left: 80px; padding-right: 80px; } } /* Toggle */ .after-header { display: none; } .after-header.search-toggled-on { display: block; transform: translateY(0); } .after-header .widget-wrap { position: relative; } /* Search Form */ .after-header form { display: inline-block; float: right; } .after-header form > * { float: left; margin: 0 0 10px 10px; line-height: 1; } .after-header input.search-field[type="search"], .after-header input.search-field[type="search"]:is(:focus, :focus-within, :focus-visible, :hover, :active) { appearance: none; -webkit-appearance: none; -moz-appearance: none; font-size: .8em !important; padding: 7px 15px !important; max-width: 270px; height: auto !important; background-color: #fff; border: 1px solid #000; position: static !important; } /* Search Submit Button */ .after-header form input.search-submit[type="submit"], .after-header form input.search-submit[type="submit"]:is(:focus, :focus-within, :focus-visible, :hover, :active) { appearance: none; -webkit-appearance: none; -moz-appearance: none; /* color: #fff !important; background: #484847 !important; border: 1px solid #484847 !important; */ font-size: .9em !important; width: auto !important; height: auto !important; padding: 9px 20px !important; position: static !important; } /* .after-header form input.search-submit[type="submit"]:is(:focus, :focus-within, :focus-visible, :hover, :active) { background: #fff !important; color: #484847 !important; } */ /* Close Search Form */ .close_search { background: transparent !important; border: none; padding: 0; display: none; } .after-header .close_search { /* display: block; */ position: absolute; top: 0; left: unset; right: 0; height: 32px; margin-right: -5px; cursor: pointer; } .after-header .close_search:hover { opacity: .6; } .after-header .close_search>div { width: 30px; height: 2px; background-color: #000; } .after-header .close_search>div:first-child { transform: rotate(45deg); /* margin-top: 16px; */ } .after-header .close_search>div:nth-child(2) { transform: rotate(-45deg); margin-top: -2px; } @media screen and (min-width: 500px){ .after-header form { padding-right: 40px; } .after-header .close_search { display: block; } } /*----- Sticky Header Changes -----*/ .header-container.stickyHeader {} /* Scroll Down */ .header-container #header-info { overflow: hidden; } .scrollDown .header-container.stickyHeader #header-info { display: none; height: 0; padding: 0; } /* Scroll Up */ .scrollUp .header-container.stickyHeader { height: auto; } /* Headerwrap */ .header-container.stickyHeader #headerwrap { padding-top: 5px; } #headerwrap { transition-duration: var(--transition-duration-sticky-header); transition-timing-function: var(--transition-timing-function-sticky-header); transition-property: padding-top; } /* Logo */ .header-container.stickyHeader .header-col.header-col-1 { margin-bottom: 5px; } .header-col.header-col-1 { transition-duration: var(--transition-duration-sticky-header); transition-timing-function: var(--transition-timing-function-sticky-header); transition-property: margin-bottom; } .header-container.stickyHeader #logo img { height: 60px !important; } #logo img { transition-duration: var(--transition-duration-sticky-header); transition-timing-function: var(--transition-timing-function-sticky-header); transition-property: height; } /* Font Size */ .header-container.stickyHeader header.site-header * { /* font-size: 14px; */ } header.site-header * { /* transition-duration: var(--transition-duration-sticky-header); transition-timing-function: var(--transition-timing-function-sticky-header); transition-property: font-size; */ } /* Menu Items */ .header-container.stickyHeader .main-navigation li.menu-item a { /* line-height: 3; */ } .main-navigation li.menu-item a { transition-duration: var(--transition-duration-sticky-header); transition-timing-function: var(--transition-timing-function-sticky-header); transition-property: line-height; } /* Search */ .header-container.stickyHeader #searchbox .search-menu { line-height: 1; } /*------------ Header Image --------------*/ .header-height { height: 100vh; max-height: 700px; } /*----- Change Font Size -----*/ .change-font-size { padding: 0; /* background-color: #000; color: #fff; */ } .change-font-size .align-center { display: flex; justify-content: center; align-items: baseline; } .change-font-size * { /* color: #777; text-align: center; */ } /* Buttons */ .change-font-size button { padding: 2px 5px !important; background-image: none; background-color: transparent; font-family: 'Oswald'; border: none; color: #000; } /* Current Font Size */ .change-font-size button.current-font-size { color: #999; } .change-font-size #small { font-size: 16px; } .change-font-size #medium { font-size: 18px; } .change-font-size #big { font-size: 20px; } /*------------------------------- Buttons ------------------------------*/ .vc_row .vc_btn3-container { margin: 0; } /*----- General Button Styles -----*/ /* Button, Submit */button, input[type="submit"], input[type="button"], /* Ninja Forms */body .nf-form-content button, body .nf-form-content input[type=button], body .nf-form-content input[type=submit], /* Header Search */.after-header form input.search-submit[type="submit"], /* WP Bakery Page Builder */#page .vc_btn3-container .vc_general.vc_btn3, #page .vc_btn3-container .vc_btn3, /* Elementor */ .elementor .elementor-widget-button .elementor-button { appearance: none; -webkit-appearance: none; -moz-appearance: none; background: var(--button-color-bg); color: var(--button-color-font); font-size: 1em; font-weight: 300; height: auto; text-align: center; text-transform: uppercase; text-decoration: none; /* letter-spacing: 0.15em; */ padding: 12px 24px; background: var(--button-color-bg); border: 1px solid var(--button-color-bg); border-radius: 0; display: inline-flex; justify-content: center; align-items: center; transition: var(--transition-buttons); } /* Hover, Focus, Active */ /* Button */ button:is(:hover, :focus, :focus-within, :focus-visible, :active), /* Input Submit */ input[type="submit"]:is(:hover, :focus, :focus-within, :focus-visible, :active), /* Input Button */ input[type="button"]:is(:hover, :focus, :focus-within, :focus-visible, :active), /* Ninja Forms */ body .nf-form-content button:is(:hover, :focus, :focus-within, :focus-visible, :active), body .nf-form-content input[type=button]:is(:hover, :focus, :focus-within, :focus-visible, :active), body .nf-form-content input[type=submit]:is(:hover, :focus, :focus-within, :focus-visible, :active), /* Search Form Header */ .after-header form input.search-submit[type="submit"]:is(:hover, :focus, :active, :focus-within), /* WP Bakery Page Builder */ #page .vc_btn3-container .vc_btn3:is(:hover, :focus, :focus-within, :focus-visible, :active), #page .vc_btn3-container .vc_general.vc_btn3:is(:hover, :focus, :focus-within, :focus-visible, :active), /* Elementor */ .elementor .elementor-widget-button .elementor-button:is(:hover, :focus, :focus-within, :focus-visible, :active) { color: var(--button-color-bg); fill: var(--button-color-bg); background: var(--button-color-font); } /* Child Elements (i. e. Icons) */ /* Button */ button:is(:hover, :focus, :focus-within, :focus-visible, :active) *, /* Input Submit */ input[type="submit"]:is(:hover, :focus, :focus-within, :focus-visible, :active) *, /* Input Button */ input[type="button"]:is(:hover, :focus, :focus-within, :focus-visible, :active) *, /* Ninja Forms */ body .nf-form-content button:is(:hover, :focus, :focus-within, :focus-visible, :active) *, body .nf-form-content input[type=button]:is(:hover, :focus, :focus-within, :focus-visible, :active) *, body .nf-form-content input[type=submit]:is(:hover, :focus, :focus-within, :focus-visible, :active) *, /* Search Form Header */ .after-header form input.search-submit[type="submit"]:is(:hover, :focus, :active, :focus-within) *, /* WP Bakery Page Builder */ #page .vc_btn3-container .vc_btn3:is(:hover, :focus, :focus-within, :focus-visible, :active) *, #page .vc_btn3-container .vc_general.vc_btn3:is(:hover, :focus, :focus-within, :focus-visible, :active) *, /* Elementor */ .elementor .elementor-widget-button .elementor-button:is(:hover, :focus, :focus-within, :focus-visible, :active) * { color: var(--button-color-bg); fill: var(--button-color-bg); } /* Icon on Button */ #page .vc_btn3-container .vc_btn3 .vc_btn3-icon { color: var(--button-color-font); transition: var(--transition-buttons); } #page .vc_btn3-container .vc_general.vc_btn3.vc_btn3-icon-right { padding-right: 48px; } #page .vc_btn3-container .vc_general.vc_btn3.vc_btn3-icon-left { padding-left: 48px; } /* Hover */ /*#page .vc_btn3-container .vc_general.vc_btn3:hover *, #page .vc_btn3-container .vc_general.vc_btn3:focus *, #page .vc_btn3-container .vc_general.vc_btn3:active * { color: #fff; }*/ /*------------------------------- Breadcrumbs - Yoast SEO ------------------------------*/ #breadcrumbs { width: 100%; border-top: 10px solid #484847; border-top: 10px solid var(--grey); margin-top: 10px; margin-bottom: 20px; } #breadcrumbs * { font-size: 12px; color: #484847; color: var(--grey); } #breadcrumbs p { width: 100%; margin: 0 auto; display: none; } #breadcrumbs p span { color: #000; } @media screen and (min-width: 768px){ #breadcrumbs p { padding: 10px 30px; display: block; } } @media screen and (min-width: 1200px){ #breadcrumbs p { padding: 10px 50px; } } /*------------------------------- Homepage / Startseite ------------------------------*/ /*----- Treatment Focus / Behandlungsschwerpunkte -----*/ .treatment-focus > .elementor-element { width: 100%; padding: 0; } .treatment-focus .elementor-widget-image > .elementor-widget-container { overflow: hidden; aspect-ratio: 16 / 9; width: 100%; } .treatment-focus .elementor-widget-image > .elementor-widget-container > img { object-fit: cover; object-position: center; width: 100%; height: 100%; } .treatment-focus .elementor-widget-heading .elementor-widget-container .elementor-heading-title { margin: 0; font-size: 1.4em; } .treatment-focus .elementor-widget-text-editor > .elementor-widget-container > *:last-child { margin-bottom: 0; } /* Buttons */ .treatment-focus .elementor-button-icon .e-font-icon-svg { height: .7em; } @media screen and (min-width: 600px){ .treatment-focus > .elementor-element { width: calc(50% - 10px); } } @media screen and (min-width: 768px){ .treatment-focus .elementor-widget-image > .elementor-widget-container { aspect-ratio: 1 / 1; } } @media screen and (min-width: 1024px){ .treatment-focus > .elementor-element { width: calc(25% - 10px); } .treatment-focus .elementor-widget-image > .elementor-widget-container { aspect-ratio: 1 / 1; } } /*----- Gallerie -----*/ .elementor-image-gallery .gallery { display: flex; flex-wrap: wrap; flex-direction: row; align-items: stretch; } .elementor-image-gallery .gallery .gallery-item { height: auto; aspect-ratio: 3 / 2; width: 50%; } .elementor-image-gallery .gallery .gallery-item .gallery-icon { height: 100%; } .elementor-image-gallery .gallery .gallery-item a { height: 100%; width: 100%; } .elementor-image-gallery .gallery .gallery-item a img { width: 100%; height: 100%; object-fit: cover; object-position: center; padding: 6px; border: none !important; max-width: 100%; max-height: 100%; } @media screen and (min-width: 800px){ .elementor-image-gallery .gallery .gallery-item { width: 33.333%; } } @media screen and (min-width: 1024px){ .elementor-image-gallery .gallery .gallery-item { width: 25%; } } /*---------------- Unterseiten -------------*/ /*----- Icon Box -----*/ /* Icon */ @media screen and (max-width: 767px){ .elementor-widget-icon-box .elementor-icon-box-icon { margin-right: 15px !important; } .elementor-widget-icon-box :is(.elementor-icon-box-icon, .elementor-icon-box-content) { float: left !important; } } /* Content */ /* Title */ .elementor-widget-icon-box .elementor-icon-box-title { margin-top: 12px; font-size: 1.2em; font-weight: 500 !important; } .elementor-widget-icon-box .elementor-icon-box-content > :is(ul, ol):has(+ p) { margin-bottom: 0; } .elementor-widget-icon-box .elementor-icon-box-content > :is(ul, ol) + p:last-child { display: none; margin-bottom: 0; } /* Grid */ @media screen and (min-width: 540px) and (max-width: 767px){ .facts-grid { --e-con-grid-template-columns: repeat(2, 2fr) !important; } .facts-grid .elementor-widget-icon-box::before { content: ""; position: absolute; background-color: #666; top: 0; bottom: 0; left: -10px; width: 1px; } .facts-grid .elementor-widget-icon-box:nth-child(2n + 1)::before { display: none; } } @media screen and (max-width: 767px){ .facts-grid .elementor-icon-box-wrapper { display: flex !important; flex-direction: row !important; } .facts-grid .elementor-widget-icon-box::after { content: ""; position: absolute; background-color: #666; left: 0; right: 0; top: -10px; height: 1px; } } @media screen and (min-width: 768px){ .facts-grid .elementor-widget-icon-box::before, .facts-grid .elementor-widget-icon-box::after { content: ""; position: absolute; background-color: #666; } .facts-grid .elementor-widget-icon-box::before { top: 0; bottom: 0; left: -10px; width: 1px; } .facts-grid .elementor-widget-icon-box::after { left: 0; right: 0; top: -10px; height: 1px; } .facts-grid .elementor-widget-icon-box:first-child::before, .facts-grid .elementor-widget-icon-box:nth-child(3n + 1)::before { display: none; } .facts-grid .elementor-widget-icon-box:nth-child(-n + 3)::after { display: none; } } /*------------------------------- Kontaktformular ------------------------------*/ /*----- Ninja Forms -----*/ .nf-form-cont { max-width: 1024px; margin-left: auto; margin-right: auto; padding: 0; } /* Form Title */ .nf-form-cont .nf-form-title { max-width: 1024px; margin-left: auto; margin-right: auto; display: block; display: none; } /* line before content (required fields *) */ /*.nf-form-fields-required { display: none; }*/ /* Form Content */ .nf-form-cont form .nf-form-content { max-width: none; padding: 0; } /* Label */ .nf-field-label label { cursor: pointer; } /* Checkbox | Description Position | Label */ .checkbox-container.nf-field-container .nf-field .field-wrap { flex-direction: column; } .checkbox-container.nf-field-container .nf-field .field-wrap .nf-field-label { margin-bottom: 5px; } /* Success Message */ .nf-form-wrap.ninja-forms-form-wrap { max-width: 1024px; margin-left: auto; margin-right: auto; padding: 0; width: 100%; } /*------------------------------- Sidebar (Accessibility) ------------------------------*/ /* Container */ .sidebar { position: fixed; top: calc(40vh - 50px); left: -300px; transition: left .5s linear; z-index: 10; /* display: none; */ display: block; } .sidebar p { font-size: .8em; } .sidebar > * { float: right; } .sidebar.sidebarToggle { left: 0; } /* Accessibility Box Trigger */ .sidebar-handle { width: 46px; margin-left: -1px; padding: 10px; background-color: #000; box-shadow: 3px -3px 5px rgba(0,0,0,.5); box-shadow: none; border-radius: 0; border-width: 1px; border-style: solid; border-color: #000; border-left: none; position: relative; z-index: 1; display: flex; flex-direction: column; justify-content: space-evenly; align-items: center; cursor: pointer; } .sidebar-handle:is(:hover, :focus, :focus-within, :focus-visible, :active) { background-color: #000 !important; } .sidebar-handle:is(:hover, :focus, :focus-within, :focus-visible, :active) img { opacity: .7; } .sidebar-handle img { width: 25px; height: auto; } .sidebar-handle img:not(:last-child) { margin-bottom: 20px; } /* Accessibility Box */ .sidebar-content { width: 300px; padding: 20px; background-color: #fff; border: 1px solid var(--grey); border-bottom-right-radius: 3px; border-left: none; position: relative; z-index: 0; } .sidebar-content .textwidget > *:not(:last-child) { margin-bottom: 8px; display: block; clear: both; float: none; } .sidebar-content .widget-title { font-size: 1em; } .sidebar-content > * { display: none; animation-duration: 1s; animation-fill-mode: forwards; animation-count: 1; } /* Animationen */ .showSidebar.sidebar .sidebar-content > * { animation-name: showSidebar; display: block; } .hideSidebar.sidebar .sidebar-content > * { animation-name: hideSidebar; display: none; } @keyframes showSidebar{ 0% { display: none; } 1% { display: block; } 100% { display: block; } } @keyframes hideSidebar{ 0% { display: block; } 1% { display: block; } 100% { display: none; } } /* image */ .sidebar-content img { border-radius: 100%; max-width: 100%; } @media screen and (min-width: 1366px){ .sidebar { left: -380px; } .sidebar-content { width: 380px; } .sidebar-handle { width: 60px; } .sidebar-handle img { width: 40px; } .sidebar-handle img:not(:last-child), .sidebar-handle img:not(:last-of-type) { margin-bottom: 25px; } } /*----------- Accessibility Box Sidebar ----------*/ /* Container */ #accessibility-box-container { left: -250px; } #accessibility-box-container.sidebar.sidebarToggle { left: 0; } #accessibility-box-container .sidebar-content { width: 250px; } /*----- Scroll Toggle Handler -----*/ #accessibility-box-container.toggleVisibility { animation-iteration-count: 1; animation-duration: .35s; animation-fill-mode: forwards; animation-timing-function: ease-in; } .scrollDown #accessibility-box-container.toggleVisibility { /* display: none; opacity: 0; */ animation-name: toggleHideAcessibilitySidebar; } .scrollUp #accessibility-box-container.toggleVisibility { /* display: block; */ animation-name: toggleShowAcessibilitySidebar; } @keyframes toggleHideAcessibilitySidebar{ 0% { opacity: 1; margin-top: 0; display: block; } 99% { opacity: 0; margin-top: -40px; display: block; } 100% { opacity: 0; margin-top: -40px; display: none; } } @keyframes toggleShowAcessibilitySidebar{ 0% { opacity: 0; margin-top: -40px; display: none; } 1% { opacity: 0; margin-top: -40px; display: block; } 100% { opacity: 1; margin-top: 0; display: block; } } /*----------- Contact Box Sidebar ----------*/ /* Container */ #contact-box-container { left: unset; right: -300px; top: 40vh; transition: right .5s linear; } #contact-box-container > * { float: left; } #contact-box-container.sidebar.sidebarToggle { left: unset; right: 0; } #contact-box-container.sidebar .sidebar-content { border: 1px solid #000; border-bottom-left-radius: 3px; border-bottom-right-radius: 0; border-right: none; } /* Contact Box Trigger */ #contact-box-container .contact-handle { margin-right: -1px; border-radius: 0; border: 1px solid #000; border-right: none; } @media screen and (min-width: 1366px){ #contact-box-container { right: -380px; } } /*------------------------------- Search Results / Archives ------------------------------*/ body:is(.search-results, .archive) #content > article { max-width: 1000px; margin-left: auto; margin-right: auto; margin-bottom: 50px; } body:is(.search-results, .archive) #content > article:not(:last-child) { border-bottom: 1px solid #ededed; padding-bottom: 25px; } /* Post Title */ body:is(.search-results, .archive) #content > article .archive-post-title { font-size: 1.7em; margin-bottom: 30px; } /*----- 404 Page -----*/ .error404 article { max-width: 1400px; margin-left: auto; margin-right: auto; } .error404 .entry-content * { text-align: center; max-width: 800px; margin-left: auto; margin-right: auto; } /*--------- Search Results Page --------*/ /* No Search Results */ body.search-no-results .entry-content * { text-align: center; } /* post container */ body.search-results .post-container { width: 100%; max-width: 800px; margin: 0 auto; } body.search-results .post-container * { width: 100%; max-width: 800px; } /* post title */ body.search-results .search-post-title, body.archive .archive-post-title { font-size: 1.5em; margin: 0 0 30px; } body.search-results .search-post-title a, body.archive .archive-post-title a { color: #484847; color: var(--grey); } body:is(.search-results, .archive) .search-post-title a:is(:hover, a:focus, a:active) { color: #a6a6a6; color: var(--light-grey); } /* post excerpt */ body.search-results .search-post-excerpt, body.archive .archive-post-excerpt { font-size: 1em; margin: 0 0 30px; } /*------------------------------- Entry Meta ------------------------------*/ footer.entry-meta { margin-bottom: 40px; display: none; } /*------------------------------- Footer ------------------------------*/ /*----- Container -----*/ footer#colophon { position: relative; display: inline-block; background-color: #4c0528; background-color: var(--footer-bg); width: 100%; max-width: none; padding: 75px 25px 20px; margin: 50px 0 0; } @media screen and (min-width: 768px){ footer#colophon { padding-left: 30px; padding-right: 30px; } } @media screen and (min-width: 1200px){ footer#colophon { padding: 85px 50px 20px; } } @media screen and (min-width: 1600px){ footer#colophon { padding-left: 80px; padding-right: 80px; } } /*----- Font -----*/ footer#colophon * { color: #a6a6a6; color: var(--light-grey); line-height: 1.5; } /*----- Links -----*/ footer#colophon a, footer#colophon a:is(:any-link, :link, :visited) {} /* Hover */ footer#colophon a:is(:hover, :focus, :focus-within, :focus-visible, :active) { opacity: .5; } /*----- Widget Title -----*/ footer#colophon .widget-title { margin-bottom: 20px; position: relative; } footer#colophon .widget-title::after { content: ''; position: absolute; top: unset; bottom: -10px; left: 0; width: 40px; height: 2px; background-color: #999; } /*----- Paragraph -----*/ footer#colophon p:not(:last-child) { margin-bottom: 20px; } /*----- Lists -----*/ footer#colophon li:not(:last-child) { margin-bottom: 5px; } /*----- Widgets Wrapper -----*/ #footerwidgets { max-width: 1000px; margin: 0 auto; } /* Footer Columns */ footer#colophon #footerwidgets .footer-column { width: 100%; margin-bottom: 40px; display: flex; flex-direction: column; } @media screen and (min-width: 500px){ footer#colophon #footerwidgets .footer-column { float: left; } footer#colophon #footerwidgets #footereins { width: 60%; } footer#colophon #footerwidgets #footerzwei { width: 40%; } footer#colophon #footerwidgets #footerdrei { width: 100%; } } @media screen and (min-width: 500px) and (max-width: 767px){ footer#colophon #footerwidgets #footerdrei { flex-direction: row; } footer#colophon #footerwidgets #footerdrei > * { width: 60%; } footer#colophon #footerwidgets #footerdrei > *:nth-child(2n + 2) { width: 40%; } } @media screen and (min-width: 768px){ footer#colophon #footerwidgets .footer-column:not(:last-child) { padding-right: 25px; } footer#colophon #footerwidgets #footereins { width: 40%; } footer#colophon #footerwidgets #footerzwei { width: 30%; } footer#colophon #footerwidgets #footerdrei { width: 30%; } } @media screen and (min-width: 1024px){ footer#colophon #footerwidgets .footer-column { width: 33.333%; } } footer#colophon #footerwidgets .footer-column aside.widget:not(:last-child) { margin-bottom: 40px; } /* Google Maps iframe */ .google-maps-footer { height: 400px; } @media screen and (max-width: 1023px){ iframe { padding: 20px 0 !important; } } @media screen and (min-width: 1024px){ .google-maps-footer { height: 210px; } } /*----- Social Icons -----*/ footer#colophon .social-icons a { width: 100%; display: block; margin: 0; } footer#colophon .social-icons a img { width: 20px; margin-right: 8px; } /*------------------------------- Copyright Line ------------------------------*/ #copyrightline { padding: 50px 50px 100px; font-size: .7em; background-color: #000; } #copyrightline * { text-align: center; color: #fff; } /*---------- Links ----------*/ #copyrightline a:is(:any-link, :link, :visited) {} /* Hover */ #copyrightline a:is(:hover, :focus, :focus-within, :focus-visible, :active) { opacity: .5; } /*------------------------------- To Top Button ------------------------------*/ #totop { display: none; position: fixed; right: 20px; top: unset; left: unset; bottom: 20px; z-index: 999; height: 50px; width: 50px; border-radius: 0; border: 1px solid #fff; background-color: #000; justify-content: center; align-items: center; /* box-shadow:0 0 5px rgba(255,255,255,.7); */ } .scrollUp #totop.vsbl { display: flex; } #totop span { width: 20px; height: 20px; border: 2px solid #fff; border-bottom: none; border-right: none; margin-top: 5px; transform: rotate(45deg); } #totop img { filter: drop-shadow(0px 0px 4px rgba(0,0,0,.4)); } @media screen and (min-width: 768px){ #totop { right: 40px; bottom: 40px; } } @media screen and (min-width: 1366px){ #totop { right: 50px; bottom: 50px; } } @media screen and (min-width: 1500px){ #totop { right: 50%; margin-right: -700px; } } /*------ Leaderboard ------*/ .leaderboard { color: darkgoldenrod; cursor: pointer; display: none; } .leaderboard:hover { color: darkorange; } .leaderboard { animation-iteration-count: infinite; background-image: linear-gradient(90deg, #ff0000, #00ff00); animation-name: ColorFade; animation-duration: 3s; animation-fill-mode: both; animation-direction: alternate-reverse; } @keyframes ColorFade { 0% { background-image: linear-gradient(90deg, #ff0000, #00ff00); } 100% { background-image: linear-gradient(90deg, #0000ff, #ff0000); } } /*------ The Events Calender ------*/ .tribe-events-pro .tribe-events-pro-photo { margin: 0 -21px; overflow: hidden; position: relative; } .tribe-common--breakpoint-medium.tribe-events-pro .tribe-events-pro-photo { margin: 0; padding: 0; } .tribe-events-pro .tribe-events-pro-photo__events { flex-wrap: nowrap; margin: 0; } .tribe-common--breakpoint-medium.tribe-events-pro .tribe-events-pro-photo__events { flex-wrap: wrap; } .tribe-events-pro .tribe-events-pro-photo__event { flex: none; } .tribe-events-pro .tribe-events-pro-photo .swiper-pagination { display: flex; justify-content: center; padding: 15px 16px; } .tribe-events-pro .tribe-events-pro-photo .swiper-pagination-bullet { background-color: #bababa; border-radius: 50%; flex: none; height: 10px; margin: 0 6px; width: 10px; } .tribe-events-pro .tribe-events-pro-photo .swiper-pagination-bullet:hover, .tribe-events-pro .tribe-events-pro-photo .swiper-pagination-bullet:focus, .tribe-events-pro .tribe-events-pro-photo .swiper-pagination-bullet-active { background-color: #727272; } .tribe-events-pro .tribe-events-pro-photo .swiper-button-prev, .tribe-events-pro .tribe-events-pro-photo .swiper-button-next { position: absolute; bottom: 10px; } .tribe-events-pro .tribe-events-pro-photo .swiper-button-prev { left: 21px; } .tribe-events-pro .tribe-events-pro-photo .swiper-button-next { right: 21px; } .tribe-common--breakpoint-medium.tribe-events-pro .tribe-events-pro-photo .swiper-pagination, .tribe-common--breakpoint-medium.tribe-events-pro .tribe-events-pro-photo .swiper-button-prev, .tribe-common--breakpoint-medium.tribe-events-pro .tribe-events-pro-photo .swiper-button-next { display: none; visibility: hidden; } /*----- Typing Animation -----*/ .typing-container { font-family: inherit; font-size: inherit; border-right: 1px solid var(--light-petrol); white-space: nowrap; overflow: hidden; /* display: inline-block; */ margin: 0; animation: cursorTypingAnim 1.4s ease 0; animation-iteration-count: infinite; animation-direction: alternate; animation-fill-mode: forwards; } @keyframes cursorTypingAnim { 0% { border-right-color: var(--light-petrol); } 33.333% { border-right-color: transparent; } 66.666% { border-right-color: var(--light-petrol); } 100% { border-right-color: transparent; } } /*---- Pojo (Plugin: One Click Accessibility) -----*/ body.pojo-a11y-high-contrast #page a:visited, body.pojo-a11y-high-contrast #page a:visited abbr, body.pojo-a11y-high-contrast #page a:visited acronym, body.pojo-a11y-high-contrast #page a:visited b, body.pojo-a11y-high-contrast #page a:visited basefont, body.pojo-a11y-high-contrast #page a:visited big, body.pojo-a11y-high-contrast #page a:visited br, body.pojo-a11y-high-contrast #page a:visited code, body.pojo-a11y-high-contrast #page a:visited div, body.pojo-a11y-high-contrast #page a:visited em, body.pojo-a11y-high-contrast #page a:visited font, body.pojo-a11y-high-contrast #page a:visited h1, body.pojo-a11y-high-contrast #page a:visited h2, body.pojo-a11y-high-contrast #page a:visited h3, body.pojo-a11y-high-contrast #page a:visited h4, body.pojo-a11y-high-contrast #page a:visited h5, body.pojo-a11y-high-contrast #page a:visited h6, body.pojo-a11y-high-contrast #page a:visited i, body.pojo-a11y-high-contrast #page a:visited kbd, body.pojo-a11y-high-contrast #page a:visited rb, body.pojo-a11y-high-contrast #page a:visited rp, body.pojo-a11y-high-contrast #page a:visited rt, body.pojo-a11y-high-contrast #page a:visited ruby, body.pojo-a11y-high-contrast #page a:visited samp, body.pojo-a11y-high-contrast #page a:visited small, body.pojo-a11y-high-contrast #page a:visited span, body.pojo-a11y-high-contrast #page a:visited strong, body.pojo-a11y-high-contrast #page a:visited tt, body.pojo-a11y-high-contrast #page a:visited u, body.pojo-a11y-high-contrast #page a:visited var, body.pojo-a11y-high-contrast #page div#secondaryNav div#documentNavigation ul.navigationTabs li.tabItem.active { color: #ff00ff !important; } /*------------------------------------------ # Accessibility Toolbar ------------------------------------------*/ /*----- High Contrast -----*/ /*----- mwAccHiCo -----*/ /* Background Colors */ html.mwAccHiCo :is(#page, #masthead, footer#colophon, #header-info, #site-navigation.main-navigation .menu-wrapper, .after-header, .menu-wrapper-desktop ul:is(.menu, .nav-menu) ul.sub-menu) { background-color: #000 !important; background-image: none !important; } /* Links, Buttons */ html.mwAccHiCo :is(a, button):is(:any-link, :link, :visited) { color: #d8fa4c !important; /* background-color: #000 !important; */ } html.mwAccHiCo :is(a, button):is(:hover, :focus, :focus-within, :focus-visible, :active) { color: #00ff81 !important; outline-color: #dc00ff !important; } /*----- Buttons -----*/ html.mwAccHiCo :is( /* Button, Submit */button, input[type="submit"], input[type="button"], /* Ninja Forms */body .nf-form-content button, body .nf-form-content input[type=button], body .nf-form-content input[type=submit], /* Header Search */.after-header form input.search-submit[type="submit"], /* WP Bakery Page Builder */#page .vc_btn3-container .vc_general.vc_btn3, #page .vc_btn3-container .vc_btn3, /* Elementor */ .elementor .elementor-widget-button .elementor-button ) { border: 1px solid #fff !important; } /* Text, Headlines, Lists, ... */ html.mwAccHiCo :is(p, h1, h2, h3, h4, h5, h6, li, figcaption, blockquote, label, .widget-title) { color: #fff !important; } /* WPBakery: Rows & Columns */ html.mwAccHiCo :is(.vc_row, .vc_column-inner) { background-color: #000 !important; } /* Menu Header */ /* Menu Hamburger Menu */ html.mwAccHiCo #site-navigation.main-navigation .menuToggleBtn > div { background-color: #d8fa4c !important; } /* Sub Menus */ html.mwAccHiCo .menu-wrapper-desktop ul:is(.menu, .nav-menu) ul.sub-menu { border: 1px solid #fff; } /* Sub Menu Trigger */ html.mwAccHiCo li.menu-item-has-children > .trigger > div, html.mwAccHiCo .menu-wrapper-desktop ul:is(.menu, .nav-menu) > li.menu-item-has-children > .trigger > div { background-image: url('data:image/svg+xml,'); } /* Header Search Close Button */ html.mwAccHiCo .after-header .close_search>div { background-color: #fff !important; } /* Accessibility Handle */ /* html.mwAccHiCo .accessibility-handle > div { background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F>'); } */ /* Buttons */ /* Button, Submit */ html.mwAccHiCo button, html.mwAccHiCo input[type="submit"], html.mwAccHiCo input[type="button"], html.mwAccHiCo /* Ninja Forms */ html.mwAccHiCo body .nf-form-content button, html.mwAccHiCo body .nf-form-content input[type=button], html.mwAccHiCo body .nf-form-content input[type=submit], html.mwAccHiCo /* Header Search */ html.mwAccHiCo .after-header form input.search-submit[type="submit"], html.mwAccHiCo /* WP Bakery Page Builder */ html.mwAccHiCo #page .vc_btn3-container .vc_general.vc_btn3, html.mwAccHiCo #page .vc_btn3-container .vc_btn3 { color: #d8fa4c !important; background: #000 !important; border-color: #fff !important; border-style: solid !important; } /* Sidebars */ html.mwAccHiCo .sidebar-content { background: #000 !important; border-color: #fff !important; } html.mwAccHiCo .sidebar-handle { background: #000 !important; border-color: #fff !important; border-style: solid solid solid none !important; } html.mwAccHiCo .sidebar-handle.contact-handle { border-style: solid none solid solid !important; } /* High Contrast Toggle Elements */ .high-contrast-element { display: none; } html.mwAccHiCo .high-contrast-element { display: block; } html.mwAccHiCo *:has( + .high-contrast-element) { display: none; } /*----- Grayscale -----*/ /*----- mwAccGrSc -----*/ html.mwAccGrSc { filter: grayscale(100%); }