.elementor-kit-6{--e-global-color-primary:#F39100;--e-global-color-secondary:#000000;--e-global-color-text:#000000;--e-global-color-accent:#F39100;--e-global-color-cc6ade9:#F39100;--e-global-color-3e6c402:#000000;--e-global-color-1872cfd:#FFFFFF;--e-global-color-f60551a:#9D9C9C;--e-global-typography-primary-font-family:"Museo Sans";--e-global-typography-primary-font-weight:400;--e-global-typography-primary-line-height:1.5em;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Museo Sans";--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.5em;--e-global-typography-text-letter-spacing:0.025em;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;color:var( --e-global-color-text );font-size:15px;}.elementor-kit-6 button,.elementor-kit-6 input[type="button"],.elementor-kit-6 input[type="submit"],.elementor-kit-6 .elementor-button{background-color:var( --e-global-color-3e6c402 );font-family:"Museo Sans", Sans-serif;font-size:15px;font-weight:300;line-height:1em;color:var( --e-global-color-1872cfd );border-radius:100px 100px 100px 100px;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{color:var( --e-global-color-cc6ade9 );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1400px;}.e-con{--container-max-width:1400px;--container-default-padding-top:064px;--container-default-padding-right:32px;--container-default-padding-bottom:064px;--container-default-padding-left:32px;}.elementor-widget:not(:last-child){--kit-widget-spacing:48px;}.elementor-element{--widgets-spacing:48px 48px;--widgets-spacing-row:48px;--widgets-spacing-column:48px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;--container-default-padding-top:032px;--container-default-padding-right:16px;--container-default-padding-bottom:32px;--container-default-padding-left:16px;}}/* Start custom CSS *//* === Blog inhoudsblokken === Alle maten en uitlijning staan in de widgets zelf: Elementor > Templates > Theme Builder > listing "Blog inhoudsblok". Alleen deze twee regels blijven hier, omdat Elementor er geen native besturing voor heeft. */ /* een blok zonder afbeeldingen laat anders een lege rij met tussenruimte staan */ .gc-blok__beelden:not(:has(img)), .gc-blok__tekst:has(.elementor-widget-container:empty) { display: none; } /* een video in een blok vervangt de afbeeldingen van datzelfde blok */ .gc-blok:has(.gc-blok__video video) .gc-blok__beelden { display: none; } /* links in artikeltekst onderlijnen: Elementor heeft hier geen scoped control voor. De kleuren staan wel native op de Text Editor-widget (Style > Link Color / Hover). */ .gc-blok__tekst a { text-decoration: underline; text-underline-offset: 0.15em; } /* Beeldbreedte per blok, ingesteld met het veld "Beeldbreedte" in de repeater. Standaard, klein en smal tonen een afbeelding op zijn eigen formaat, zoals op de oude site: nooit opgerekt, nooit breder dan de tekstkolom. Zo blijven kleine afbeeldingen scherp en grote niet onnodig klein. Breed en vol blijven een vaste breedte. De maat staat op de widget en niet op de afbeelding, zodat een rij gecentreerd blijft. De dubbele .elementor is nodig om Elementor's eigen max-width:100% te overrulen. */ .elementor.elementor .gc-blok .gc-blok__beelden:not(.gc-breedte-breed):not(.gc-breedte-vol) > .elementor-widget-image { flex: 0 1 auto; width: auto; max-width: 100%; } .elementor.elementor .gc-blok .gc-blok__beelden:not(.gc-breedte-breed):not(.gc-breedte-vol) > .elementor-widget-image img { width: auto; max-width: 100%; height: auto; } .elementor.elementor .gc-blok .gc-blok__beelden.gc-breedte-breed > .elementor-widget-image { max-width: 600px; } .elementor.elementor .gc-blok .gc-blok__beelden.gc-breedte-vol > .elementor-widget-image { max-width: none; } /* === gcon-geen-horizontale-scroll (2026-08-20) === De decoratieve kubussen steken bewust buiten de sectie (offset -56px) en het mobiele menupaneel van HAI Toolkit staat buiten beeld geparkeerd. Allebei duwen ze de scrollbreedte voorbij de viewport. 'clip' knipt dat weg zonder een scrollcontainer te maken, dus position:sticky blijft werken. */ html, body { overflow-x: clip; } /* === gcon-kop-ritme (2026-08-20) === Koppen binnen een Text Editor stonden op 8px boven en 16px onder, dus de ruimte erboven was kleiner dan eronder. Een kop hoort visueel bij de tekst eronder, dus de ruimte erboven moet duidelijk groter zijn. Elementor heeft geen control voor de marges van koppen binnen een tekstblok, vandaar CSS. */ .elementor-widget-text-editor h2, .elementor-widget-text-editor h3, .elementor-widget-text-editor h4{ margin-top: 48px; margin-bottom: 12px; } /* geen gat bovenaan een tekstblok dat met een kop begint */ .elementor-widget-text-editor h2:first-child, .elementor-widget-text-editor h3:first-child, .elementor-widget-text-editor h4:first-child{ margin-top: 0; } @media (max-width: 767px){ .elementor-widget-text-editor h2, .elementor-widget-text-editor h3, .elementor-widget-text-editor h4{ margin-top: 32px; } } /* === gcon-lege-lijstitems (2026-08-21) === De vinkjeslijstjes op de productpagina's komen uit JetEngine-velden. Is zo'n veld leeg, dan rendert Elementor het lijstitem toch en blijft er een los oranje vinkje staan zonder tekst. Zichtbaar op /railsystemen/ nadat de drie pijlers daar leeggemaakt zijn, en al langer op de andere productpagina's bij een tweede lijst. Elementor heeft geen control om een lijstitem te verbergen bij een lege waarde. */ .elementor-icon-list-item:has(> .elementor-icon-list-text:empty), .elementor-icon-list-item:has(> a > .elementor-icon-list-text:empty){ display: none; } /* === gc-oranje (2026-10-12) === Eén woord in een titel oranje maken, zoals op de oude site. In de titeltekst van een Elementor-kop (tabblad Code of Tekst) zet je: woord Enkel de kleur verandert (#F39200), lettertype en gewicht blijven die van de titel. Elementor heeft geen control voor een kleur op één woord binnen een kop. */ .gc-oranje.gc-oranje { color: #F39200; } /* Verzendknop formulieren gelijk aan de pijlknoppen */ .gform_wrapper .gform_button { font-family: "Roboto", sans-serif !important; font-weight: 500 !important; font-size: 15px !important; } /* === gc-blog-kubus-opsomming (2026-10-13) === Opsommingstekens in de blogtekst zijn het oranje kubusje van de oude site, zoals op de snelrolpoort-blog. Geldt voor elke ul in een blogtekstblok. Elementor heeft geen control voor een afbeelding als opsommingsteken in een tekstblok. */ .elementor.elementor .gc-blok__tekst ul { list-style: none; margin: 0 0 16px 0; padding: 0; } .elementor.elementor .gc-blok__tekst ul > li { list-style: none; margin: 0 0 12px 0; padding: 2px 0 0 36px; background: url(https://www.gconstructions.be/wp-content/uploads/snelrolpoort-check.webp) no-repeat 0 4px; } /* === gc-blog-hero-focus (2026-10-13) === Twee blogs hebben een hero-foto die met 'cover' en gecentreerd verkeerd bijgesneden wordt. Enkel deze posts (postid), andere blogs blijven zoals ze waren. 694 wat-is-een-gc-industrial-sectionaalpoort: de poorten staan onderaan in de foto, dus focus onderaan. 677 heeft-mijn-poort-een-onderhoud: bronbeeld is maar 322x252, dus op natuurlijke grootte tonen. */ body.postid-694 .elementor .elementor-element.elementor-element-a1b2c32 { background-position: 50% 100%; } body.postid-677 .elementor .elementor-element.elementor-element-a1b2c32 { background-size: auto; background-position: 50% 50%; } /* === gc-veer-gebroken-foto (2026-10-13) === Blog veer-gebroken (postid 221): de uitlegfoto's staan links, in lijn met de tekst, met dezelfde ruimte erboven en eronder. Voor- en nafoto staan op gelijke hoogte. Enkel deze post. */ body.postid-221 .elementor .gc-blok .gc-blok__beelden { justify-content: flex-start; margin: 0; } body.postid-221 .elementor .gc-blok .gc-blok__beelden img[src*="/Voor1."], body.postid-221 .elementor .gc-blok .gc-blok__beelden img[src*="/Na."] { height: 170px; width: auto; } @media (max-width: 767px) { body.postid-221 .elementor .gc-blok .gc-blok__beelden img[src*="/Voor1."], body.postid-221 .elementor .gc-blok .gc-blok__beelden img[src*="/Na."] { height: auto; max-width: 100%; } } body.postid-221 .elementor .gc-blok .gc-blok__bijschrift, body.postid-221 .elementor .gc-blok .gc-blok__bijschrift .elementor-heading-title { text-align: left; } @media (max-width: 767px) { body.postid-221 .elementor .gc-blok .gc-blok__beelden { flex-direction: row; flex-wrap: wrap; align-items: flex-start; justify-content: flex-start; gap: 16px; } } /* === gc-icoonlijst (2026-10-13) === Icoonlijsten in blogtekst (ul.gc-icoonlijst, eigen icoon per li) krijgen niet het kubus-vinkje van de gewone opsomming. */ .elementor.elementor .gc-blok__tekst ul.gc-icoonlijst > li { background: none; padding-left: 0; }/* End custom CSS */ /* Start Custom Fonts CSS */@font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: 100; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_100.woff2') format('woff2'); } @font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: 300; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_300.woff2') format('woff2'); } @font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: 500; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_500.woff2') format('woff2'); } @font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: 700; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_700.woff2') format('woff2'); } @font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: 900; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_900.woff2') format('woff2'); } @font-face { font-family: 'Museo Sans'; font-style: normal; font-weight: normal; font-display: auto; src: url('https://www.gconstructions.be/wp-content/uploads/fonnts.com-Museo_Sans_500.woff2') format('woff2'); } /* End Custom Fonts CSS */