/* ========================================================================== * Content-blokken, assortiment en merkpagina's * * The Fire Station - child theme. Overgezet uit Customizer > Extra CSS * op 2026-09-17. Inhoud van dit bestand: * - Content-blokken uit WPBakery (rows en secties) (71 regels) * - Assortiment, merk- en modelpagina's (42 regels) * * LET OP: deze bestanden laden laat in de , op exact de plek waar de * oude "Extra CSS" stond. Ze overschrijven daarom zowel het Total-thema als * style.css en de andere stylesheets van dit child theme. Zet nieuwe regels * bij voorkeur in style.css; gebruik dit bestand alleen om te overschrijven. * ========================================================================== */ /* -------------------------------------------------------------------------- * Content-blokken uit WPBakery (rows en secties) * -------------------------------------------------------------------------- */ .partner-blok img { width: 45%; display: block; margin: 0 auto; border-radius: 100px; border: 2px solid #585858; } .partner-blok .pill { text-align: center; display: block; background: #CE9B4A; border-radius: 20px; width: fit-content; margin: 0 auto; padding: 2px 12px 7px 12px; font-size: 16px; color: #272727; font-weight: 600; font-family: 'manufaktur-bold'; text-transform: uppercase; line-height: normal; margin-bottom: 12px; } .partner-blok { background: #181818; padding: 20px; border: 3px solid #CE9B4A; position: relative; margin: 0; } .custom-list-item .templatera_shortcode {height: 100%;} .custom-list-item .templatera_shortcode .vc_row {height: 100%;} .custom-list-item .templatera_shortcode .vc_row .vc_col-sm-9 {position: absolute; bottom: 24px; left: 12px;} .custom-list-item .templatera_shortcode .vc_row .vc_col-sm-3 {position: absolute; bottom: 24px; right: 12px;} .custom-list-item .templatera_shortcode .vcex-heading, .custom-list-item .templatera_shortcode .vcex-custom-field {color: #FFF;} .custom-cta { display: flex; align-items: center; justify-content: center; text-align: center; color: white; padding: 20px; border-radius: 0px; height: 100%; } .custom-cta .cta-button { color: white; font-weight: bold; text-decoration: none; padding: 15px 20px; background: #fff; color: #ff6600; border-radius: 5px; } .custom-cta .cta-button:hover {background: #e65c00; color: white;} .title-separator-row .title-separator {top: 25px;} .wpb-content-wrapper .title-separator-row:first-child {margin-top: 24px;} .wpb-content-wrapper .title-separator-row .vcex-animated-text {color: #CE9B4A;} .tekst-afb-row {margin-top: 48px; margin-bottom: 48px;} .tekst-afb-row:first-child {margin-top: 24px !important;} .tekst-afb-row:last-child {margin-bottom: 24px !important;} .tekst-afb-row.logo .vcex-image::before {display: none !important;} .tekst-afb-row .vcex-image {padding: 24px;} .tekst-afb-row.wpb_fadeInRight .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; left: -20px; right: 20px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInLeft .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; right: -20px; left: 20px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInRight .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; left: -20px; right: 20px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInLeft .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; right: -20px; left: 20px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row .vcex-animated-text {margin-bottom: 12px; font-size: 1.6em;} .tekst-afb-row strong {color: #fff;} .buitenkeuken-row {padding: 48px;} .waarom-tfs h4.vcex-animated-text { color: #CE9B4A; margin: 0; display: flex; align-items: center; justify-content: start; gap: 12px; line-height: normal; } .waarom-tfs h4.vcex-animated-text:after { content: ""; height: 3px; background: #CE9B4A; display: block; flex-grow: 1; } .waarom-tfs .vc_col-sm-8 p a { text-decoration: none; color: #CE9B4A !important; font-weight: 600; transition: .3s; border-bottom: 2px solid transparent; } .waarom-tfs .vc_col-sm-8 p a:hover {border-color: #CE9B4A; color: #fff;} .waarom-tfs > .vc_column_container > .vc_column-inner::before { position: absolute; content: ''; display: none; top: 24px; bottom: 24px; left: 0; right: 0; border: solid 4px #ce9b4a; } .product-description_waarom-tfs .vc_column_container>.vc_column-inner {padding: 24px; border: 2px solid #CE9B4A;} .product-description_waarom-tfs .vc_column_container>.vc_column-inner ul.manufaktur li:before {top: 10px;} .product-description_waarom-tfs .vc_column_container>.vc_column-inner ul.manufaktur li {color: #fff;} .offerte_waarom-tfs >.vc_column-inner>.wpb_wrapper {padding: 24px; border: 2px solid #CE9B4A;} .offerte_waarom-tfs ul.manufaktur li {color: #fff; font-size: 0.9em;} .waarom-tfs {padding-top: 12px; padding-bottom: 12px; margin-bottom: 48px;} .waarom-tfs .manufaktur {color: #fff;} .mogelijkheden-row .mogelijkheden-col > .vc_column-inner {padding: 24px; margin-left: 15px; margin-right: 15px; background: #0B0B0B;} .mogelijkheden-row-alt .mogelijkheden-col > .vc_column-inner {padding: 24px; margin-left: 15px; margin-right: 15px; background: #3e3e3e;} @media only screen and (min-width: 769px) { .title-separator-row .flexwrapper.vc_column_container>.vc_column-inner>.wpb_wrapper .vcex-multi-buttons {background: #272727; padding: 16px;} .waarom-tfs {padding-top: 48px; padding-bottom: 48px; margin-top: 48px;} .wpb-content-wrapper .title-separator-row:first-child {margin-top: 32px;} .buitenkeuken-row .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; left: 20px; right: -20px; border: solid 4px #ce9b4a; z-index: 999; } .buitenkeuken-row .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -20px; bottom: 20px; left: 20px; right: -20px; border: solid 4px #ce9b4a; z-index: 999; } } @media only screen and (max-width: 768px) { .buitenkeuken-row {padding: 12px 12px 48px 12px; gap: 12px;} .waarom-tfs .tfs-logo {margin-top: 12px; margin-bottom: 12px;} .tekst-afb-row {margin-top: 12px; margin-bottom: 12px;} .tekst-afb-row .wpb_column.vc_col-sm-4, .tekst-afb-row .wpb_column.vc_col-sm-2\/5 {order: 1;} .tekst-afb-row .wpb_column.vc_col-sm-8, .tekst-afb-row .wpb_column.vc_col-sm-3\/5 {order: 2;} .waarom-tfs {margin: 0 !important; padding: 0;} .waarom-tfs > .vc_column_container > .vc_column-inner::before { position: absolute; content: ''; display: none; top: 12px; bottom: 12px; left: 12px; right: 12px; border: solid 4px #ce9b4a; } .waarom-tfs .vc_col-sm-12 .vc_row {gap: 22px;} .waarom-tfs-usps {overflow: hidden; display: flex; flex-direction: column;} .waarom-tfs-usps h3 {line-height: 1.2;} .waarom-tfs h4.vcex-animated-text {line-height: 1.2; display: block; text-align: center;} .waarom-tfs h4.vcex-animated-text:after {display: none;} .waarom-tfs p {text-align: center;} .waarom-tfs .theme-button {left: 50%; transform: translatex(-50%);} .tekst-afb-row .vcex-image {padding: 12px !important;} .tekst-afb-row.wpb_fadeInRight .vcex-video {margin: 12px;} .tekst-afb-row.wpb_fadeInLeft .vcex-video {margin: 12px;} .tekst-afb-row.wpb_fadeInRight .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInLeft .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInRight .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } .tekst-afb-row.wpb_fadeInLeft .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } /* * */ .tekst-afb-row .vcex-image {padding: 12px !important;} .buitenkeuken-row .vcex-image {padding: 12px !important;} .buitenkeuken-row .vcex-image-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } .buitenkeuken-row .vcex-video {padding: 12px !important; background: transparent;} .buitenkeuken-row .vcex-video-inner::before { position: absolute; content: ''; display: block; top: -10px; bottom: 20px; left: -10px; right: -10px; border: solid 4px #ce9b4a; z-index: 999; } } /* -------------------------------------------------------------------------- * Assortiment, merk- en modelpagina's * -------------------------------------------------------------------------- */ .megamenu_cta-blok-l.monolith-buggy {display: none;} .base-models-row .vc_col-sm-3 h2 {margin-top: 0 !important;} .base-models-row h3 {margin: 0; line-height: 1.1em; color: #CE9B4A;} /* ************************************************************ */ .modellen-row-25 .vcex-flex-container {flex-wrap: wrap; gap: 24px;} .modellen-row-25 .vcex-teaser { padding: 24px; flex: 0 0 23%; background: #181818; border: 2px solid #CE9B4A; box-shadow: 0 11px 34px 0 #181818; } .modellen-row-25 .vcex-teaser .vcex-teaser-content {text-align: center;} .modellen-row-25 .vcex-teaser h3.vcex-teaser-heading {font-size: 1.5em; transition: .3s; line-height: 1;} .modellen-row-25 .vcex-teaser:hover h3.vcex-teaser-heading {color: #CE9B4A;} .modellen-row-25 .vcex-teaser h3:not(.vcex-teaser-heading) {font-size: 1.1em;} .modellen-row-25 .vcex-teaser .vcex-teaser-text {margin-top: 12px;} .modellen-row-25 .hidden {visibility: hidden;} .modellen-row-25 .vcex-teaser h3.vcex-teaser-heading:after { content: '' !important; background: url(/wp-content/uploads/2025/01/The-Fire-Station-Logo-onderkant-01.svg) no-repeat center center; background-size: contain; display: block; width: auto; height: 25px; margin-top: 6px; } .modellen-row-25 .vcex-teaser .vcex-teaser-button:hover {background-color: transparent !important; color: #fff;} .modellen-row-25 .vcex-teaser .vcex-teaser-button::after { content: ''; display: block; height: 100%; width: 100%; position: absolute; left: 0; top: 0; -webkit-transform: translate(-100%, 0) rotate(10deg); transform: translate(-100%, 0) rotate(10deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-transition: 0.2s -webkit-transform ease-out; transition: 0.2s -webkit-transform ease-out; transition: 0.2s transform ease-out; transition: 0.2s transform ease-out, 0.2s -webkit-transform ease-out; will-change: transform; z-index: -1; background: #ce9b4a; } .modellen-row-25 .vcex-teaser .vcex-teaser-button:hover::after {-webkit-transform: translate(0, 0); transform: translate(0, 0);} /* ************************************************************ */ .modellen-row-2025 .wpb_column .vc_column-inner {padding: 24px; background: #181818; border: 2px solid #CE9B4A; box-shadow: 0 11px 34px 0 #181818;} .modellen-row-2025 {flex-wrap: nowrap !important; column-gap: 24px; margin: 0 0 24px 0;} .modellen-row-2025:before {display: none;} .modellen-row-2025 .wpb_column .vc_column-inner h3.vcex-heading {text-align: center; font-size: 1.5em;} .modellen-row-2025 .wpb_column .vc_column-inner h3:not(.vcex-heading) {font-size: 1.1em;} .modellen-row-2025 .wpb_column .vc_column-inner h3.vcex-heading span {margin: 0 0 2px 0;} .modellen-row-2025 .hidden {visibility: hidden;} .modellen-row-2025 .wpb_column .vc_column-inner h3.vcex-heading a:after { content: '' !important; background: url(/wp-content/uploads/2025/01/The-Fire-Station-Logo-onderkant-01.svg) no-repeat center center; background-size: contain; display: block; width: auto; height: 25px; } .modellen-row-2025 .wpb_column .vc_column-inner .vcex-button:hover {background-color: transparent !important; color: #fff;} .modellen-row-2025 .wpb_column .vc_column-inner .vcex-button::after { content: ''; display: block; height: 100%; width: 100%; position: absolute; left: 0; top: 0; -webkit-transform: translate(-100%, 0) rotate(10deg); transform: translate(-100%, 0) rotate(10deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-transition: 0.2s -webkit-transform ease-out; transition: 0.2s -webkit-transform ease-out; transition: 0.2s transform ease-out; transition: 0.2s transform ease-out, 0.2s -webkit-transform ease-out; will-change: transform; z-index: -1; background: #ce9b4a; } .modellen-row-2025 .wpb_column .vc_column-inner .vcex-button:hover::after {-webkit-transform: translate(0, 0); transform: translate(0, 0);} .merk-carousel .wpex-carousel-entry-media {margin-block-end: 0;} @media only screen and (min-width: 769px) { .modellen-row-2025 .wpb_column .vc_column-inner {position: relative; height: 100%;} .modellen-row-2025 .wpb_column .vc_column-inner .wpb_text_column {margin-bottom: 24px;} .modellen-row-2025 .wpb_column .vc_column-inner .vcex-button { position: absolute; bottom: 24px; width: -moz-available; width: -webkit-fill-available; width: fill-available; margin-right: 24px; } } @media only screen and (max-width: 768px) { .modellen-row-25 .wpex-carousel__nav.owl-nav {justify-content: center !important;} .modellen-row-25 .vcex-flex-container {flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory;} .modellen-row-25 .vcex-teaser {flex: 0 0 82%; scroll-snap-align: start;} .mogelijkheden-row .vcex-flex-container, .mogelijkheden-row-alt .vcex-flex-container, .mogelijkheden-row.five-col .vcex-flex-container {flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory;} .mogelijkheden-row .vcex-teaser, .mogelijkheden-row-alt .vcex-teaser {flex: 0 0 82%; scroll-snap-align: start;} .modellen-row-2025 { flex-direction: row; column-gap: 24px; margin: 0px; flex-wrap: nowrap !important; overflow-x: auto; scroll-snap-type: x mandatory; } .modellen-row-2025 .vc_col-sm-3 {width: 100%; flex: 0 0 82%; scroll-snap-align: start;} .merk-carousel .owl-prev {inset-inline-start: -5px !important; background-color: transparent !important;} .merk-carousel .owl-next {inset-inline-end: -5px !important; background-color: transparent !important;} .waarom-tfs > .vc_column_container > .vc_column-inner {padding: 48px;} } .merken-row {text-align: center;} .buitenkeukens-slider .sp-nc-thumbnails-container {display: none;}