/******* Do not edit this file ******* Simple Custom CSS and JS - by Silkypress.com Saved: Aug 20 2026 | 13:24:57 */ /* * ShirtFrame combined custom CSS * Laden in de , na de thema-CSS en na shirtframe-critical.css. * Samengevoegd en opgeschoond uit de Custom CSS-export van 20-08-2026. */ /* Homepage */ .home .content { padding: 100px 0 0 !important; } .home .content h2 { font-size: 40px !important; } .home .quality { margin: 100px 0; } /* Productintro */ .product-intro { margin: 30px 0; padding: 28px 30px; border-left: 4px solid #16a34a; border-radius: 10px; background-color: #f9f9f9; } .product-intro__title { margin: 0 0 12px; color: #16a34a; font-size: 24px; font-weight: 700; line-height: 1.2; } .product-intro__content { max-width: 780px; } .product-intro__content p { margin: 0; color: #333; font-size: 16px; line-height: 1.65; } @media screen and (max-width: 767px) { .product-intro { margin-bottom: 24px; padding: 22px 20px; } .product-intro__title { font-size: 21px; } .product-intro__content p { font-size: 15px; line-height: 1.6; } } /* Productbetaalblok */ .single-product .cart-payment-mode { display: block !important; margin-top: 16px; padding-right: 55px; text-align: left; } .cart-payment-mode__trust { display: block; margin: 0 0 12px; padding: 0; list-style: none; color: #323232; font-size: 13px; line-height: 1.5; } .cart-payment-mode__trust li { position: relative; margin-bottom: 3px; padding-left: 17px; } .cart-payment-mode__trust li::before { content: "✓"; position: absolute; left: 0; color: #409b75; font-weight: 700; } .cart-payment-mode .wc-payment-mode-title { display: inline-block; margin: 0 6px 0 0; color: #666; font-size: 12px; line-height: 22px; white-space: nowrap; vertical-align: middle; } .cart-payment-mode img { display: inline-block; width: auto; max-height: 22px; margin: 0 3px; vertical-align: middle; } /* Product-FAQ: omgezet van ongeldige SCSS-nesting naar geldige CSS */ .faq--product { width: 100%; margin-top: 60px; padding: 40px; border: 1px solid #ede8db; border-radius: 10px; } .faq--product .faq__heading { margin-bottom: 30px; } .faq--product .faq__heading h2 { margin: 0; font-size: 24px; } .faq--product .faq__holder { display: block; } .faq--product .faq__column, .faq--product .faq__box { width: 100%; } .faq { padding-bottom: 0 !important; } .faq__column h5 { font-weight: 700; } .faq__title { font-size: 16px !important; } /* Productkaarten */ .woocommerce ul.products li.product .woocommerce-loop-product__title { padding: 0 30px; font-weight: 700; } .product-card__subtitle { padding: 20px 30px; font-size: 18px; } .product-card__button { display: flex; align-items: center; justify-content: center; width: calc(100% - 32px); min-height: 48px; margin: 16px; padding: 12px 20px; border-radius: 999px; background: #ede8db; color: #000; font-weight: 600; text-align: center; transition: background-color 0.2s ease; } .woocommerce ul.products li.product .woocommerce-loop-product__link { padding: 20px !important; } .woocommerce ul.products li.product .woocommerce-loop-product__link:hover { background: #fff; box-shadow: 0 0 20px rgba(0, 0, 0, 0.1) !important; transform: scale(1.02); } .woocommerce ul.products li.product .woocommerce-loop-product__link:hover img { transform: none !important; } .woocommerce ul.products li.product .woocommerce-loop-product__link .onsale { top: 15px !important; right: 15px !important; } /* Taalpopup */ .has-language-popup { overflow: hidden; } .language-popup { --popup-green: #253f35; --popup-cream: #f5f1e8; --popup-border: rgba(37, 63, 53, 0.16); position: fixed; z-index: 99999; inset: 0; display: grid; place-items: center; padding: 20px; opacity: 0; transition: opacity 0.2s ease; } .language-popup[hidden] { display: none; } .language-popup.is-visible { opacity: 1; } .language-popup__backdrop { position: absolute; inset: 0; background: rgba(15, 23, 20, 0.68); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); } .language-popup__dialog { position: relative; box-sizing: border-box; width: min(100%, 620px); max-height: calc(100vh - 40px); overflow-y: auto; padding: clamp(28px, 5vw, 48px); border-radius: 4px; background: var(--popup-cream); box-shadow: 0 24px 80px rgba(0, 0, 0, 0.28); color: var(--popup-green); transform: translateY(12px); transition: transform 0.2s ease; } .language-popup.is-visible .language-popup__dialog { transform: translateY(0); } .language-popup__close { position: absolute; top: 14px; right: 16px; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 0; background: transparent; color: currentColor; font-size: 30px; line-height: 1; cursor: pointer; } .language-popup__eyebrow { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; } .language-popup__dialog h2 { margin: 0 36px 12px 0; font-size: clamp(28px, 5vw, 42px); line-height: 1.05; } .language-popup__dialog > p:not(.language-popup__eyebrow) { max-width: 500px; margin: 0 0 28px; line-height: 1.6; } .language-popup__languages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .language-popup__language { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 12px; align-items: center; box-sizing: border-box; min-height: 58px; padding: 12px 14px; border: 1px solid var(--popup-border); background: rgba(255, 255, 255, 0.52); color: inherit; text-decoration: none; transition: border-color 0.15s ease, background-color 0.15s ease, transform 0.15s ease; } .language-popup__language:hover, .language-popup__language:focus-visible { border-color: var(--popup-green); background: #fff; color: var(--popup-green); outline: none; transform: translateY(-1px); } .language-popup__language.is-current, .language-popup__language.is-current:hover, .language-popup__language.is-current:focus-visible { background: var(--popup-green); color: #fff; } .language-popup__language img { display: block; width: 24px; height: 16px; object-fit: cover; } .language-popup__language small { opacity: 0.72; font-size: 11px; text-transform: uppercase; } @media screen and (max-width: 560px) { .language-popup { align-items: end; padding: 0; } .language-popup__dialog { width: 100%; max-height: 90vh; padding: 30px 20px 24px; border-radius: 12px 12px 0 0; } .language-popup__languages { grid-template-columns: 1fr; } } @media (prefers-reduced-motion: reduce) { .language-popup, .language-popup__dialog, .language-popup__language { transition: none; } } /* Inhoudsblokken */ .image-text, .interior { position: relative !important; z-index: 1 !important; isolation: isolate !important; margin: 0 !important; padding-top: 80px !important; padding-bottom: 80px !important; overflow: hidden !important; } .image-text__holder, .interior__holder { position: relative !important; z-index: 2 !important; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: clamp(32px, 5vw, 72px) !important; align-items: center !important; max-width: 1200px !important; margin: 0 auto !important; } .image-text__bg { z-index: 0 !important; top: 0 !important; height: 100% !important; } .image-text__text, .image-text__image, .interior__image, .interior__content { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; } .image-text__image, .interior__image { aspect-ratio: 1 / 1 !important; overflow: hidden !important; border-radius: 10px !important; } .image-text__image img, .interior__image img { display: block !important; width: 100% !important; height: 100% !important; border-radius: 10px !important; object-fit: cover !important; } .image-text__text h2, .image-text__text h3, .interior__content h2, .interior__content h3 { margin-bottom: 22px !important; font-size: clamp(28px, 3vw, 42px) !important; font-weight: 600 !important; line-height: 1.18 !important; } .image-text__text p, .interior__content p { margin-bottom: 20px !important; font-size: 18px !important; line-height: 1.85 !important; } .image-text__text ul, .interior__content ul { margin: 24px 0 0 !important; padding-left: 22px !important; } .image-text__text li, .interior__content li { margin-bottom: 10px !important; line-height: 1.7 !important; list-style: disc !important; } main .image-text ul { margin-bottom: 30px !important; padding-left: 75px !important; } main .image-text ul li, .interior__content ul li { margin-bottom: 0 !important; } @media screen and (max-width: 820px) { .image-text, .interior { padding-top: 48px !important; padding-bottom: 48px !important; } .image-text__holder, .interior__holder { display: flex !important; flex-direction: column !important; gap: 24px !important; } .image-text__image, .interior__image { aspect-ratio: 16 / 11 !important; } } @media screen and (max-width: 768px) { main .image-text ul { margin-bottom: 30px !important; padding-left: 0 !important; } } /* Externe reviews */ .customer__holder--external { display: flex; flex-wrap: wrap; gap: 30px; } .customer__holder--external .customer__column { width: calc(33.333% - 20px); } .customer-review { display: flex; flex-direction: column; gap: 18px; height: 100%; padding: 40px; border-radius: 18px; background: #fff; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06); text-align: center; } .customer-review__stars { color: #d0d0d0; font-size: 20px; line-height: 1; } .customer-review__stars .is-active { color: #c89b3c; } .customer-review__text { color: #111; line-height: 1.7; } .customer-review__text.no-photo { margin: 40% 0; } .customer-review__gallery { display: flex; flex-wrap: wrap; gap: 10px; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; background: #f3f3f3; } .customer-review__image-link { display: block; width: 100%; } .customer-review__image { display: block; width: 100%; height: 100%; border-radius: 12px; object-fit: cover; } .customer-review__meta { display: flex; flex-direction: column; gap: 8px; margin-top: auto; } .customer-review__name { color: #111; font-size: 16px; } .customer-review__badge { display: inline-flex; align-items: center; width: fit-content; margin: 0 auto; padding: 6px 12px; border-radius: 999px; background: #f3f5ef; color: #111; font-size: 13px; } @media screen and (max-width: 991px) { .customer__holder--external .customer__column { width: calc(50% - 15px); } } @media screen and (max-width: 767px) { .customer__holder--external .customer__column { width: 100%; } } /* Formulieren */ .gform_button button { display: inline-block; width: 100%; margin-bottom: 0; padding: 18px 30px; border: 0; border-radius: 50px; background: #000; color: #fff; font-family: "Euclid Circular A", sans-serif; font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; touch-action: manipulation; user-select: none; transition: color 0.25s ease-in-out, border-color 0.25s ease-in-out, background-color 0.25s ease-in-out; } legend { padding: 0; border: 0; border-radius: 0; background: #fff; color: #000; } label { display: inline-block; } /* Artikelen */ article { padding-top: 60px; } article h1 { margin: 40px 0; font-size: 60px; } article h2 { margin: 30px 0; font-size: 40px; } article h3 { margin: 20px 0; font-size: 20px; } article hr { display: block; flex-basis: 100%; width: 100%; margin: 60px 0; border: 0; border-top: 1px solid #ccc; } article ul, article ol { margin-bottom: 30px; padding: 0 30px; } article li { list-style: disc; } article img { border-radius: 30px; } img.alignnone { display: block; max-width: 100%; height: auto; margin: 0 0 3rem; } img.alignleft { float: left; max-width: 40%; height: auto; margin: 0 3rem 3rem 0; } img.alignright { float: right; max-width: 40%; height: auto; margin: 0 0 3rem 3rem; } img.aligncenter { display: block; max-width: 100%; height: auto; margin: 0 auto 1.5rem; } .entry-content::after, .editor-styles-wrapper::after { content: ""; display: block; clear: both; } @media screen and (max-width: 768px) { img.alignleft, img.alignright, img.aligncenter, .wp-block-image .alignleft, .wp-block-image .alignright, .wp-block-image.aligncenter { float: none !important; display: block; width: 100%; max-width: 100%; margin: 0 0 1.5rem; } .wp-caption, .wp-caption img { width: 100% !important; } article { padding-top: 30px; } article h1 { margin: 20px 0; font-size: 40px; } article h2 { margin: 15px 0; font-size: 30px; } article h3 { margin: 10px 0; font-size: 20px; } article p, article ul, article ol, article .button { font-size: 20px; } article .button { width: 100%; } } /* Partners */ .partners__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 30px; } .partners__item { display: flex; align-items: center; justify-content: center; height: 110px; padding: 20px; border-radius: 12px; background: #fff; } .partners__item img { width: auto; max-width: 100%; height: auto; max-height: 70px; margin: 40px; opacity: 0.5 !important; object-fit: contain; } .partners__item img:hover { opacity: 1 !important; filter: grayscale(0) !important; } .partners h2 { margin-bottom: 0 !important; } .partners { padding-bottom: 0 !important; } @media screen and (min-width: 768px) { .partners__grid { grid-template-columns: repeat(3, 1fr); } } @media screen and (min-width: 1024px) { .partners__grid { grid-template-columns: repeat(4, 1fr); } } @media screen and (max-width: 768px) { .partners__item img { margin: 0 !important; } } /* Mobiele elementen */ .mobile-items, .only-on-mobile { display: none; } @media screen and (max-width: 768px) { .mobile-items { display: block; } } @media screen and (max-width: 600px) { .only-on-mobile { display: inline-block !important; } } /* Productlabels en foto's */ .woocommerce div.product div.images { position: relative; } .product-labels-wrap { position: absolute; z-index: 1; top: 30px; right: 30px; display: flex; flex-flow: row wrap; justify-content: flex-end; gap: 6px; max-width: 80%; } .text-label { position: relative; display: inline-block; padding: 3px 20px; border-radius: 75px; background-color: #16a34a !important; color: #fff; font-size: 14px; } .text-tag { top: 32px; left: -43px; clip-path: polygon(150px 0, 100% 100%, 0 100%, 43px 0); } .label-icon-svg { display: block; width: 25px; height: 25px; } .woocommerce ul.products .woocommerce-loop-product__link .label-icon-svg { width: 25px !important; } .photos__zoom i { top: auto; bottom: 20px !important; } @media screen and (min-width: 769px) { .photos__zoom i { bottom: 35px !important; } } .photos p { margin-top: 20px; margin-bottom: 0; font-size: 14px; text-align: center; } /* WooCommerce */ .timer-container, .product_meta, .wc-category-filter { display: none !important; } .single_add_to_cart_button, .woocommerce a.button.alt, .checkout-button, .woocommerce .woocommerce-checkout .woocommerce-checkout-review-order #payment #place_order { background-color: #16a34a !important; transition: transform 0.2s ease-out, background-color 0.2s ease-out !important; } .single_add_to_cart_button:hover, .woocommerce a.button.alt:hover, .checkout-button:hover, .woocommerce .woocommerce-checkout .woocommerce-checkout-review-order #payment #place_order:hover { background-color: #16a34a !important; transform: scale(1.05) !important; } .woocommerce div.product div.summary form.cart .single_add_to_cart_button { flex: 1; padding-right: 30px !important; padding-left: 30px !important; } .woocommerce div.product div.summary p.price, .woocommerce-variation-price { margin-bottom: 30px !important; } .button, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { width: auto !important; } .woocommerce table.shop_table.cart tbody .product-name .variation dt { text-transform: none !important; } .woocommerce table.shop_table.cart tbody .product-name .variation dt.variation-Clubnaam, .woocommerce table.shop_table.cart tbody .product-name .variation dt.variation-Onderschrift, .woocommerce table.shop_table.cart tbody .product-name .variation dd.variation-Clubnaam, .woocommerce table.shop_table.cart tbody .product-name .variation dd.variation-Onderschrift { display: block !important; } .woocommerce .cart-collaterals .cart_totals .wc-proceed-to-checkout a.checkout-button:hover, .woocommerce .woocommerce-checkout .woocommerce-checkout-review-order #payment #place_order:hover, .woocommerce div.product div.summary form.cart .single_add_to_cart_button:hover { background: #16a34a; } .woocommerce-accordion-content ul { margin: 30px auto; } .woocommerce-accordion-content ul li { line-height: 2.5; } .woocommerce-accordion-content ul li::before { content: "\f14a"; display: inline-block; padding-right: 10px; font-family: "Font Awesome 6 Pro"; font-weight: 300; } .woocommerce-info::before { color: #000 !important; } .woocommerce-error, .woocommerce-info, .woocommerce-message { border-radius: 40px; } .wc-custom-text-fields, .pdf-link { width: 100% !important; } .pdf-link { display: block !important; } /* Configurator */ .counter { position: absolute; top: 0; right: 30px; color: #999; font-size: 12px; } #show_example { display: block; width: 100%; margin: 20px 0; border-radius: 10px; background-color: #ede8db; color: #000; font-size: 14px; font-weight: 700; line-height: 55px; text-align: center; text-decoration: none; text-transform: uppercase; transition: all 0.2s; } p.condition { margin-top: 20px; color: rgba(0, 0, 0, 0.5); font-size: 12px; font-weight: 400; line-height: normal; } .mfp-iframe-holder .mfp-content { width: 600px !important; height: 945px !important; } /* Algemene componentcorrecties */ .content { padding-bottom: 60px !important; } .content .content__bg { display: none !important; } .content p { margin-bottom: 20px !important; line-height: 2 !important; } .content p .button { color: #fff !important; text-decoration: none !important; transition: transform 0.25s; } .content p .button:hover { transform: scale(1.1); } .hero__content { max-width: 940px !important; } .steps .button { margin-top: 60px; } .steps__column:hover .steps__image img { filter: invert(1) !important; } .steps__image img { width: 100% !important; max-width: 60px !important; } .popular { position: relative; overflow: hidden; } .popular__holder, .popular__products, .popular__view-shop { position: relative; z-index: 2 !important; } .popular__bg { position: absolute; z-index: 1; inset: 0; pointer-events: none; } .popular__bg img { display: block; width: 100%; height: 100%; object-fit: cover !important; } .header__nav { padding-top: 32px !important; padding-bottom: 20px !important; } .header__language-dropdown { padding-bottom: 0 !important; } .header__cart span { transition: background-color 0.25s; } .header__cart:hover span { background-color: #16a34a; } .header__toggle { bottom: 32px !important; } .usp__slide a, .usp__slide a:hover { text-decoration: none !important; } .usp__slide a { transition: transform 0.25s; } .usp__slide a:hover { transform: scale(1.1); } .customer { padding-top: 50px !important; padding-bottom: 70px !important; } .reviews__social h2 { font-weight: 400 !important; } .help__bg img, .popular__bg img, .feature__bg img, .image-text__bg img, .know__bg img, .customer__bg img, .shopping__bg img, .content__bg img { object-fit: fill !important; }