/* Theme Name: Pagecraft Child Description: Custom WordPress Child theme for theme "PageCraft" Author: Pagecraft Author URI: https://pagecraft.nl Tested up to: 6.2 Requires PHP: 8.2 Template: pagecraft Text Domain: pagecraft-child Version: 1.0.1 */ /****************************************** GLOBAL ******************************************/ /* Variables */ :root { --pc-black: #000; --pc-white: #fff; --pc-transparent: #FFFFFF00; --light-gray: #F5F5F5; --spacing-desktop: 40px; --spacing-laptop: 30px; --spacing-tablet: 20px; --spacing-mobile: 20px; --gform-asterix-color: #3f3f3f; --gform-error-color: #ff0000; --gform-placeholder-color: #3f3f3f; --gform-border-color: #c5c5c5; --gform-active-border-color: #000; --gform-font-size: var(--e-global-typography-text-font-size); } /* Variable COLORS - globals form Elementor page builder var(--e-global-color-primary); var(--e-global-color-secondary); var(--e-global-color-accent); var(--e-global-color-text); var(--e-global-color-584f52f) // Globale kleur 'Zwart' var(--e-global-color-43f9ea8) // Globale kleur 'Wit' */ /* Variable Fonts - globals form Elementor page builder var(--e-global-typography-primary-font-family); var(--e-global-typography-secondary-font-family); */ /* Default Elementor colors from plugin var(--e-a-color-black); var(--e-a-color-white); */ /********** Disable default styling ***************/ ol, ul { padding-left: 20px; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } table { border-collapse: collapse; border-spacing: 0; } .elementor-widget-text-editor p:first-of-type { margin-top: 0; } img { object-fit: cover; } .grecaptcha-badge { visibility: hidden; } /****************************************** Spacing classes *****************************************/ .padding-section { padding-top: var(--spacing-desktop); padding-bottom: var(--spacing-desktop); } .padding-top { padding-top: var(--spacing-desktop); } .padding-bottom { padding-bottom: var(--spacing-desktop); } @media screen and (min-width: 1160px) { .padding-left { padding-left: calc((100vw - var(--content-width)) / 2); } .padding-right { padding-right: calc((100vw - var(--content-width)) / 2); } } @media screen and (max-width: 1024px) { .padding-section { padding-top: var(--spacing-laptop); padding-bottom: var(--spacing-laptop); } .padding-top { padding-top: var(--spacing-laptop); } .padding-bottom { padding-bottom: var(--spacing-laptop); } } @media screen and (max-width: 767px) { .padding-section { padding-top: var(--spacing-tablet); padding-bottom: var(--spacing-tablet); } .padding-top { padding-top: var(--spacing-tablet); } .padding-bottom { padding-bottom: var(--spacing-tablet); } } @media screen and (max-width: 500px) { .padding-section { padding-top: var(--spacing-mobile); padding-bottom: var(--spacing-mobile); } .padding-top { padding-top: var(--spacing-mobile); } .padding-bottom { padding-bottom: var(--spacing-mobile); } } /* Header */ header .elementor-element.elementor-sticky.elementor-sticky--active { background-color: rgba(6, 59, 85, 0.8); backdrop-filter: blur(8px); } .elementor-sticky.elementor-sticky--active:not(.elementor-sticky--effects) { background-color: #063248 !important; } @media screen and (max-width: 1024px) { header .elementor-element.elementor-sticky { background-color: #063248 !important; min-height: 121px; } } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item { position: relative; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active { position: absolute; right: -100px !important; left: unset; top: 60px; max-width: 320px; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item:last-child { border-bottom: 1px solid #CADFE2; padding-bottom: 20px; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item .elementor-icon-list-icon { height: 30px; width: 30px; border-radius: 30px; background-color: var(--e-global-color-accent); padding: 9px 8px 5px 10px; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item a { display: flex; flex-direction: row-reverse; justify-content: space-between; padding-left: 8px; padding-right: 8px; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item a:hover .elementor-icon-list-icon { background-color: #00aeef; transition: all ease 0.3s; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item a .elementor-icon-list-icon svg { width: 12px !important; height: 12px !important; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active .elementor-element.elementor-widget.elementor-widget-icon-list .elementor-widget-container .elementor-icon-list-items .elementor-icon-list-item a:hover .elementor-icon-list-icon svg { transform: rotate(45deg); transition: all ease 0.3s; } nav.e-n-menu .e-n-menu-wrapper .e-n-menu-heading .e-n-menu-item .e-n-menu-content.e-active::before { content: url("../../uploads/2025/03/Polygon-1.png"); display: inline-block; position: absolute; top: -15px; left: 45%; } /* Breadcrumbs */ #breadcrumbs span span::after { display: inline-block; content: url("../../uploads/2025/03/arrow-breadcrumb.png"); width: 12px; height: 9px; margin: 0px 6.5px 0px 9.5px; font-size: 15px !important; } #breadcrumbs span.breadcrumb_last::after { display: none; } #breadcrumbs .breadcrumb_last, #breadcrumbs a, #breadcrumbs span a { font-size: 15px !important; } /* Cards - hero */ .card-link-container.card-link-container-image::after { content: ""; display: inline-block; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: #063B5540; border-radius: 12px; } .card-link-container:hover ~ .card-link-container.card-link-container-image::after { background-color: transparent; } .card-link-container:hover ~ .card-link-container.card-link-container-image, .card-link-container:hover ~ .card-link-container.card-link-container-content { background-color: #CADFE2 !important; } .card-link-container:hover ~ .card-link-container.card-link-container-content .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link { background-color: #00aeef; transition: all ease 0.3s; } .card-link-container:hover ~ .card-link-container.card-link-container-content .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-icon { transform: rotate(45deg); transition: all ease 0.3s; } .hero-card-main-container-link:hover + .hero-card-main-container-con .hero-card-main-container-icon { background-color: #00aeef !important; transition: all ease 0.3s; max-width: 48px !important; } /* Card button */ .card-link-btn-container:hover .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link { background-color: #00aeef; transition: all ease 0.3s; } .card-link-btn-container:hover .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-icon { transform: rotate(45deg); transition: all ease 0.3s; } /* Carousel loop card link container */ .card-link-main-container { max-width: 392px !important; } .container-40x40 { max-height: 40px !important; max-width: 40px !important; height: 40px; width: 40px; } /* Projecten loop carousel container */ .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container { position: relative; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .swiper.elementor-loop-container { margin-right: -26%; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .swiper-pagination { position: absolute; top: unset; bottom: 0px; left: 140px; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .elementor-swiper-button.elementor-swiper-button-next { position: absolute; top: unset; bottom: -18px; right: 104px; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .elementor-swiper-button.elementor-swiper-button-prev { position: absolute; left: unset; top: unset; right: 164px; bottom: -18px; } @media screen and (max-width: 1365px) { .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .swiper-pagination { left: 36px; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .elementor-swiper-button.elementor-swiper-button-next { right: 0px; } .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .elementor-swiper-button.elementor-swiper-button-prev { right: 60px; } } @media screen and (max-width: 1024px) { .projecten-loop-carousel-container.elementor-widget.elementor-widget-loop-carousel .elementor-widget-container .swiper.elementor-loop-container { margin-right: 0; } } .projecten-template-default.single.single-projecten main .elementor-element .elementor-widget-container h2:not(.elementor-heading-title) { color: #3F3F3F; font-weight: 600; margin-bottom: 24px; } /* All galleries */ .elementor-gallery__container.e-gallery-container a.e-gallery-item.elementor-gallery-item.elementor-animated-content .elementor-gallery-item__content .elementor-gallery-item__title { display: none; } .elementor-gallery__container.e-gallery-container a.e-gallery-item.elementor-gallery-item.elementor-animated-content .elementor-gallery-item__content::after { display: inline-block; content: url("../../uploads/2025/04/loop.png"); height: 20px; width: 20px; transition: all ease 0.3s; opacity: 0; margin-top: -20px; margin-left: -20px; } .elementor-gallery__container.e-gallery-container a.e-gallery-item.elementor-gallery-item.elementor-animated-content:hover .elementor-gallery-item__content::after { height: 44px; width: 44px; opacity: 1; margin-top: 0px; margin-left: 0px; } /* Nieuws styles */ .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link { display: flex; justify-content: flex-end; margin-right: 28px; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link { display: flex; margin-left: 28px; } /* Nieuws navigation */ .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-prev i::before { display: none; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link a { gap: 16px; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-prev { width: 40px; height: 40px; border-radius: 40px; background-color: #063B554D; transition: all ease 0.3s; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-prev:hover { background-color: #063B55; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__prev.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-prev::before { display: inline-block; content: url("../../uploads/2025/01/white-arrow-prev.svg"); height: 14px; width: 15px; margin-top: 4px; margin-left: 13px; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-next i::before { display: none; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link a { gap: 16px; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-next { width: 40px; height: 40px; border-radius: 40px; background-color: #063B554D; transition: all ease-out 0.3s; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-next:hover { background-color: #063B55; } .elementor-element.elementor-widget.elementor-widget-post-navigation .elementor-post-navigation .elementor-post-navigation__next.elementor-post-navigation__link .post-navigation__arrow-wrapper.post-navigation__arrow-next::after { display: inline-block; content: url("../../uploads/2025/01/white-arrow-next.svg"); height: 14px; width: 15px; margin-top: 4px; margin-right: 12px; margin-left: -2px; } /* Button styles - red */ .red-button-style a.elementor-button.elementor-button-link:hover .elementor-button-content-wrapper .elementor-button-icon svg { display: none; } .red-button-style a.elementor-button.elementor-button-link:hover .elementor-button-content-wrapper .elementor-button-icon::after { content: url("../../uploads/2025/03/red-button-arrow.svg"); display: inline-block; width: 19px; } /* Button styles - white */ .white-button-style a.elementor-button.elementor-button-link:hover .elementor-button-content-wrapper .elementor-button-icon svg { display: none; } .white-button-style a.elementor-button.elementor-button-link:hover .elementor-button-content-wrapper .elementor-button-icon::after { content: url("../../uploads/2025/04/arrow-white-btn.svg"); display: inline-block; width: 16px; height: 21px; } .white-button-style-homepage a.elementor-button.elementor-button-link:hover .elementor-button-content-wrapper .elementor-button-icon::after { width: 18px; } /* Projecten styles */ .projecten-card-container:hover .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-icon { transform: rotate(45deg); transition: all ease 0.3s; } .projecten-card-container .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-icon svg path { fill: #063B55; } .projecten-card-container:hover .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-icon svg path { fill: white; } .projecten-card-container:hover .elementor-widget.elementor-widget-button .elementor-button.elementor-button-link { background-color: #00aeef; transition: all ease 0.3s; } .projecten-card-container .elementor-element.elementor-widget.elementor-widget-theme-post-excerpt { margin-bottom: -55px; opacity: 0; transition: all ease 0.3s; } .projecten-card-container:hover .elementor-element.elementor-widget.elementor-widget-theme-post-excerpt { margin-bottom: 0; opacity: 1; transition: all ease 0.3s; } /* Projecten pagination */ .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination { display: flex; justify-content: center; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination .page-numbers { padding: 10px; height: 40px; width: 40px; display: inline-block; border-radius: 40px; font-weight: 400 !important; font-size: 18px; background-color: #063b554d; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination .page-numbers.current { padding: 8px; background-color: #00AEEF; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination .page-numbers:hover { background-color: #063b55; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination span.page-numbers.prev, .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination span.page-numbers.next { display: none; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination a.page-numbers.prev { position: relative; padding: 9px } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination a.page-numbers.prev::after { position: absolute; content: url("../../uploads/2025/03/white-arrow.svg"); display: inline-block; transform: rotate(180deg); margin-left: -8px; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination a.page-numbers.next { position: relative; } .projecten-loop-grid.elementor-element.elementor-widget.elementor-widget-loop-grid nav.elementor-pagination a.page-numbers.next::after { position: absolute; content: url("../../uploads/2025/03/white-arrow.svg"); display: inline-block; margin-left: -8px; } /* Contact form */ .elementor-element.elementor-widget-form .elementor-form .elementor-form-fields-wrapper .elementor-field-group.elementor-field-type-submit.e-form__buttons { margin-top: 17px; } .elementor-element.elementor-widget-form .elementor-form .elementor-form-fields-wrapper .elementor-field-type-acceptance.elementor-field-group .elementor-field-subgroup .elementor-field-option { display: flex; align-items: center; gap: 5px; } .elementor-element.elementor-widget-form .elementor-form .elementor-form-fields-wrapper .elementor-field-type-acceptance.elementor-field-group .elementor-field-subgroup .elementor-field-option input.elementor-field.elementor-acceptance-field { height: 18px; width: 18px; } .elementor-element.elementor-widget-form .elementor-form .elementor-form-fields-wrapper textarea.elementor-field-textual.elementor-field { height: 180px; } .elementor-element.elementor-widget-form .elementor-form .elementor-form-fields-wrapper .elementor-field-type-acceptance.elementor-field-group .elementor-field-subgroup .elementor-field-option { align-items: flex-start; } /****************************************** Gravity form style ******************************************/ /*** https://docs.gravityforms.com/css-targeting-examples/ ***/ /* body .gform_heading .gform_required_legend, body .gform_footer.top_label .gform-loader { display: none; } body .gform_wrapper .gform_body .gform_fields .gfield .gfield_required.gfield_required_asterisk { color: var(--gform-asterix-color); } body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input::placeholder, body .gform_wrapper .gform_body .gfield .ginput_container textarea::placeholder { font-family: var(--e-global-typography-primary-font-family); color: var(--gform-placeholder-color); font-size: var(--gform-font-size); } body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']), body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select { box-shadow: none; border: solid 1px var(--gform-border-color); } body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):focus, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea:focus, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select:focus, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):active, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea:active, body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select:active { box-shadow: none; border: solid 1px var(--gform-active-border-color); outline: none; } body .gform_wrapper .gform_footer input[type=submit] { font-family: var(--e-global-typography-primary-font-family); background-color: var(--e-global-color-secondary) !important; } body .gform_wrapper .gform_footer input[type=submit]:hover { background-color: var(--e-global-color-primary) !important; } body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container label.error { color: var(--gform-error-color); } */ /* Swiper center align*/ .swiper-slide { display: flex !important; justify-content: center !important; } /* Elementor Cart Button*/ .elementor-menu-cart__toggle_button { background-color: var(--pc-transparent) !important; padding: 0 !important; } /* WooCommerce Buttons */ /* .woocommerce .button { color: var(--pc-white) !important; background-color: var(--e-global-color-primary) !important; transition: all ease .2s; } .woocommerce .button:hover { color: var(--pc-white) !important; background-color: var(--e-global-color-accent) !important; } */ /* WooCommerce My Account */ /* .woocommerce-MyAccount-content { font-family: var(--e-global-typography-text-font-family); } .woocommerce-MyAccount-content p { font-size: var(--e-global-typography-text-font-size); } .woocommerce-MyAccount-navigation ul, .woocommerce-MyAccount-content-wrapper > p:first-of-type { margin-block-start: 0 !important; } .woocommerce-MyAccount-content-wrapper p a, p.woocommerce-LostPassword.lost_password a { color: var(--e-global-color-accent) !important; } .woocommerce-MyAccount-content-wrapper p a:hover, p.woocommerce-LostPassword.lost_password a:hover { color: var(--e-global-color-primary) !important; } */