/** * Theme Name: Blocksy Child * Description: Blocksy Child theme * Author: Creative Themes * Template: blocksy * Text Domain: blocksy */ /** var(--theme-palette-color-1); you can use this as your primary brand colour. var(--theme-palette-color-2); alternative colour, used usually for the hover action var(--theme-palette-color-3); colour used for general text paragraphs var(--theme-palette-color-4); colour used for headings, subheadings and titles var(--theme-palette-color-5); colour used for borders var(--theme-palette-color-6); colour used for subtle backgrounds (page hero, footer) var(--theme-palette-color-7); colour used for the site’s background var(--theme-palette-color-8); lighter alternative colour, to be used in header backgrounds Blocksy Querys: @media (max-width: 767px) {} @media (min-width: 768px) {} @media (max-width: 999px) {} Aufteilung (Stand 09/2026): - style.css (diese Datei): projektübergreifende Basics + Design-Helfer, die zu scripte.js gehören - Customizer > Zusätzliches CSS: alles Seiten-/Block-spezifische (gsbp-IDs, page-id-*, Formular-Feinschliff) */ /* Variablen __________________________________________________________________________________*/ :root { --step--2: clamp(0.75rem, 0.7rem + 0.2vw, 0.8125rem); /* 12–13px */ --step--1: clamp(0.84375rem, 0.8125rem + 0.25vw, 0.9375rem); /* 13.5–15px */ --step-0: clamp(1rem, 0.9375rem + 0.5vw, 1.125rem); /* 16–18px Fließtext */ --step-1: clamp(1.1875rem, 1.0625rem + 0.7vw, 1.375rem); /* 19–22px Lead */ --step-2: clamp(1.625rem, 1.375rem + 1.4vw, 2.25rem); /* 26–36px */ --step-3: clamp(1.875rem, 1.5rem + 2vw, 2.75rem); /* 30–44px H2 */ --step-4: clamp(2.375rem, 1.8rem + 3vw, 3.625rem); /* 38–58px H1 */ --step-5: clamp(2.875rem, 2.1rem + 4vw, 4.375rem); /* 46–70px Display */ /* Seitenbreite (Sync mit Blocksy-Customizer) */ --maxw: 1490px; /* https://www.joshwcomeau.com/shadow-palette/ */ --shadow-color: 0deg 0% 0%; --shadow-elevation-low: 0px 0.5px 0.8px hsl(var(--shadow-color) / 0), 0px 1.5px 2.3px hsl(var(--shadow-color) / 0.08); --shadow-elevation-medium: 0px 0.5px 0.8px hsl(var(--shadow-color) / 0), 0px 7.4px 11.1px hsl(var(--shadow-color) / 0.11); --shadow-elevation-high: 0px 0.5px 0.8px hsl(var(--shadow-color) / 0), 0px 8.1px 12.1px hsl(var(--shadow-color) / 0.09), -0.1px 24.7px 37.1px hsl(var(--shadow-color) / 0.17); } /* Typografie __________________________________________________________________________________*/ h1, h2, h3, h4, h5, h6 { margin-bottom: calc(var(--has-theme-content-spacing, 1)*(.5em + 8px)) !important; font-stretch: condensed !important; } h1, h2, h3, h4 { letter-spacing: -0.01em; line-height: 1.1; } p { margin-bottom: 0.75em !important; } /* Letztes

im Container: kein Abstand nach unten */ p:last-child { margin-bottom: 0 !important; } /* Erstes Überschriften-Element im Container: kein Abstand nach oben */ h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { margin-top: 0 !important; } b, strong { font-weight: 700 !important; } hr { margin: 80px auto !important; } /* Hilfsklassen __________________________________________________________________________________*/ .schatten-small { box-shadow: var(--shadow-elevation-low); } .schatten { box-shadow: var(--shadow-elevation-medium); } .schatten-large { box-shadow: var(--shadow-elevation-high); } .small { font-size: var(--step--1); } .xsmall { font-size: var(--step--2); } .large { font-size: var(--step-4); } .xlarge { font-size: var(--step-5); } .blocksatz { text-align: justify; hyphens: auto; } .hyphen p { overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; } .keine-linkmarkierung a { text-decoration: none; } .margin-bottom-0 { margin-bottom: 0 !important; } .max-w-46ch { max-width: 46ch; } .max-w-400 { max-width: 400px; } .box { background-color: rgba(255,255,255,0.75); border: 1px solid #ffffff !important; border-radius: 3px; padding: 4vw; box-shadow: var(--shadow-elevation-medium); } .box.klein { padding: 1vw; } .box:hover { background-color: rgba(255,255,255,0.9); box-shadow: var(--shadow-elevation-high); } .blur { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } .abgerundet, .abgerundet video { border-radius: 3px; } /* Bilder */ .wp-block-image img, .blocks-gallery-item img { border-radius: 3px !important; } .entry-content figcaption { text-align: right !important; color: #787878; font-size: var(--step--2) !important; font-weight: 300; } /* Menü __________________________________________________________________________________*/ @media (min-width: 1000px) { .sub-menu { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); } } #offcanvas .ct-panel-inner { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } #offcanvas .sub-menu .ct-menu-link:not(:empty) { padding: 0.5em 0; font-size: 0.875em; } /* Blocksy __________________________________________________________________________________*/ .ct-icon-container { margin-bottom: 2px; } #main-container { padding-bottom: 0 !important; } [class*=ct-contact-info] li { grid-column-gap: 5px !important; } .ct-shortcuts-container { z-index: 99 !important; } .ct-shortcuts-bar-items, [data-header*="type-1"] #offcanvas { -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); } /* Complianz __________________________________________________________________________________*/ #cmplz-cookies-overview .cmplz-dropdown p, #cmplz-document .cmplz-dropdown p, #cmplz-document li, #cmplz-document p, #cmplz-document td { font-size: 1rem; } #cmplz-document.impressum h2, #cmplz-document.impressum h3 { font-size: 1.5rem; margin-top: 1.5em; margin-bottom: 0 !important; color: var(--theme-palette-color-3) !important; opacity: 1; } #cmplz-document a { text-decoration: none; } #cmplz-document b { font-weight: 700; } #cmplz-document h2, #cmplz-document h3 { margin-top: 2em !important; margin-bottom: 0 !important; } /* JetFormBuilder – Grundlayout: Label über dem Feld (echtes