/*
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 {

/* 	Color variables */
	--do-black: #000;
	--do-white: #fff;
	--do-transparent: #FFFFFF00;
	--light-gray: #F5F5F5;
	
	--spacing-desktop: 40px;
	--spacing-laptop: 30px;
	--spacing-tablet: 20px;
	--spacing-mobile: 20px;
	
	--gform-asterix-color: #3f3f3f;
	--gform-error-color: #CC405C;
	--gform-placeholder-color: #3f3f3f;
	--gform-border-color: #D6D6D6;
	--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(--do-black;
	var(--do-white);
	var(--light-gray);
*/

/*  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);
*/

/* Text selection */
::selection {
    background-color: var(--e-global-color-secondary);
    color: var(--do-white);
}

/* Text selection for Firefox */
::-moz-selection {
    background-color: var(--e-global-color-secondary);
    color: var(--do-white);
}

/* Align button icon */
.elementor-button-icon {
	display: flex;
	align-items: center;
}

/* Different link color */
.rev-link a {
	color: var(--e-global-color-primary) !important;
}

.rev-link a:hover {
	color: var(--e-global-color-secondary) !important;
}


/**********    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;
}

/****************************************** 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 header.elementor-sticky,
.elementor-25 .elementor-element.elementor-element-468de535:not(.elementor-motion-effects-element-type-background),
main .hero {
	background: linear-gradient(90deg, var(--do-white) 11.53%, var(--e-global-color-f4cf16c) 31.02%, var(--e-global-color-3c0f30f) 118.99%) !important;
}



header .elementor-nav-menu > li > .elementor-nav-menu--dropdown {
	background: linear-gradient(118deg, var(--do-white) 11.53%, var(--e-global-color-f4cf16c) 31.02%, var(--e-global-color-3c0f30f) 118.99%);
}

header .elementor-nav-menu > li > .elementor-nav-menu--dropdown > li > .elementor-nav-menu--dropdown {
	background: linear-gradient(118deg, var(--do-white) 11.53%, var(--e-global-color-f4cf16c) 31.02%, var(--e-global-color-3c0f30f) 118.99%);
}

header .elementor-sub-item.has-submenu {
	justify-content: space-between;
}


/****************************************** Hero home ************************************************/
.hero-home .elementor-widget-image img {
	max-height: 60vh;
}

.hero-home .widget-image-caption {
	max-width: 550px;
}

/****************************************** Hero section *********************************************/
.hero-section .elementor-icon-list-item a {
	text-decoration-color: #fff !important;
	transition: all ease .3s !important;
}

.hero-section .elementor-icon-list-item a:hover {
	text-decoration-color: #000 !important;
}

@media screen and (max-height: 1000px) and (min-width: 767px) {
	.under-hero-img {
		margin-top: -100px !important;
	}
}

@media screen and (max-height: 750px) and (max-width: 767px) {
	.under-hero-img {
		margin-top: -100px !important;
	}
}


/****************************************** Diensten loop ********************************************/
@media screen and (min-width: 767px) {
	.diensten-loop .sub-section {
		height: 100%;
	}
}

/*** Contact block ***/
.contact-loop-blok .elementor-widget-button {
	margin-top: auto;
}

@media screen and (max-width: 767px) {
	.contact-loop-blok .e-con-full {
		height: 100%;
	}
}

/****************************************** Nieuws/Blog loop item ***********************************************/

.nieuwsitem .meerlezen-knop {
	transition: all ease .3s;
}

.nieuwsitem:hover .meerlezen-knop .elementor-widget-container {
	background-color: var(--e-global-color-secondary) !important;
}

/****************************************** Split list ***********************************************/
@media screen and (min-width: 767px) {
	.split-list ul.elementor-icon-list-items {
		display: flex;
		flex-wrap: wrap;
	}

	.split-list ul.elementor-icon-list-items li {
		flex-basis: 50%;
	}
}

/******************************************** Project vertical slider ********************************/
.bx-wrapper .e-loop-item {
    width: 100% !important;
}

.custom-project-slider .elementor-loop-container {
	max-width: 1000px;
}

.custom-project-slider .bx-controls .bx-controls-direction a.bx-prev {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3C!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--%3E%3Cpath fill='%23000000' d='M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2 160 448c0 17.7 14.3 32 32 32s32-14.3 32-32l0-306.7L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z'/%3E%3C/svg%3E");
}

.custom-project-slider .bx-controls .bx-controls-direction a.bx-next {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3C!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--%3E%3Cpath fill='%23000' d='M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z'/%3E%3C/svg%3E");
}

#custom-bx-prev {
    top: calc(50% - 73px);
}

@media screen and (min-width: 1200px) {
	#custom-bx-next,
	#custom-bx-prev {
		right: calc((100vw - 1170px) / 2);	
	}
}
/****************************************** Project single/detail page ******************************/
/*** Slider ***/
.project-gallery-slider .elementor-widget-image-carousel .swiper {
	width: 100vw;
}

.project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button {
	background: #fff;
	padding: 20px;
	transition: all ease .3s;
	width: fit-content;
}

.project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button:hover {
	background: var(--e-global-color-primary);
}

.project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button-prev {
	right: 74px;
    left: auto !important;
}

.project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button-next {
	right: 0;
}

@media screen and (max-width: 1440px) {
	.project-gallery-slider .elementor-widget-image-carousel .swiper {
		width: 125vw;
	}
}

@media screen and (max-width: 767px) {
	.project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button {
		padding: 10px;
	}
	
    .project-gallery-slider .elementor-widget-image-carousel .elementor-swiper-button-prev {
        right: 38px;
    }

}

/*** Quote ***/
.elementor-widget-testimonial .elementor-testimonial-details {
	display: flex !important;
}

.elementor-widget-testimonial .elementor-testimonial-name::after {
    content: "/";
    display: inline-block;
    margin: 0 10px;
    font-weight: 400;
}

.elementor-widget-testimonial .elementor-testimonial-wrapper {
	padding-left: 120px;
}

.elementor-widget-testimonial .elementor-testimonial-wrapper::before {
    content: no-open-quote no-open-quote close-quote close-quote;
    font-size: 96px;
	line-height: 80px;
    font-weight: 700;
    font-family: 'Poppins';
    position: absolute;
	left: 0;
	transform: scaleX(-1);
}

@media screen and (max-width: 500px) {
	.elementor-widget-testimonial .elementor-testimonial-wrapper::before {
	    font-size: 76px;
    	line-height: 70px;
	}
	
	.elementor-widget-testimonial .elementor-testimonial-wrapper {
		padding-left: 60px
	}
}

/****************************************** FOOTER styles  ******************************************/
footer .elementor-widget-text-editor p:not(:first-of-type) {
	margin-top: 10px;
}

.elementor-location-footer .tel-container a,
.elementor-location-footer .mail-container a {
	color: var( --e-global-color-accent);
}

/****************************************** Search and filter *******************************************/
.searchandfilter select.sf-input-select {
	padding: 10px;
    border-radius: 0;
    border: solid 1px #000;
    color: #5C5C5B;
    font-weight: 700;
    font-family: 'Poppins';
	line-height: 1;
}

.searchandfilter ul {
	padding: 0;
}

/*** Project filter ***/
.cat-filter select option {
	font-weight: 700;
    color: #000;
    font-family: 'Poppins';
    font-size: 16px;
    line-height: 24px;
	background: #fff;
	transition: all ease .3s;
}

.cat-filter select option:hover,
.cat-filter select option:checked, 
.cat-filter select:focus > option:checked,
.cat-filter select:focus > option:hover {
	background: rgba(219, 212, 202, 1);
	box-shadow: 0 0 10px 100px rgba(219, 212, 202, 1) inset;
}

/****************************************** Gravity form style ******************************************/
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-theme--framework .gform-field-label>.gfield_required  {
    font-size: 18px;
    line-height: 1;
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):not([type='radio']):not([type='checkbox']),
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container textarea,
body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container select {
	font-family: var(--e-global-typography-accent-font-family) !important;
	font-size: 14px;
	box-shadow: none;
	border-radius: 0px;
	border-top-width: 0px;
	border-left-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: var(--gform-border-color);
	background-color: var(--pc-transparent);
}

body .gform_wrapper .gform_body .gform_fields .gfield .ginput_container input:not([type='submit']):not([type='radio']):not([type='checkbox']):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']):not([type='radio']):not([type='checkbox']):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-radius: 0px;
	border-top-width: 0px;
	border-left-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 2px;
	border-bottom-style: solid;
	border-bottom-color: var(--e-global-color-accent);
	outline: none;
}

body .gform_wrapper .gform_footer input[type=submit] {
	font-family: var(--e-global-typography-primary-font-family) !important;
	background-color: var(--e-global-color-secondary) !important;
	padding: 20px 28px !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 {
	font-family: var(--e-global-typography-text-font-family) !important;
	font-size: 14px;
	font-weight: 300;
	color: var(--gform-error-color);
}

body .gform_wrapper .gform_body .gform_fields .gfield input[type=text],
body .gform_wrapper .gform_body .gform_fields .gfield input[type=email] {
	font-family: var(--e-global-typography-accent-font-family) !important;
	font-size: 14px;
}

.gform_wrapper .gform_page_footer .gform-loader {
	display: none;
}

body .gform_wrapper .gform_body .gform_fields .gfield legend.gform-field-label,
body .gform_wrapper .gform_body .gform_fields .gfield label.gform-field-label {
    font-family: var(--e-global-typography-text-font-family);
    font-size: 14px;
	font-weight: var(--e-global-typography-text-font-weight);
	color: var(--pc-black);
    line-height: 20px;
}

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 .charleft.ginput_counter.gfield_description {
	font-family: var(--e-global-typography-primary-font-family);
	color: #585E6A;
	font-size: 13px;
}

.gform_confirmation_message,
.gform_confirmation_wrapper .gform_confirmation_message {
 	font-family: var(--e-global-typography-primary-font-family) !important;
	font-size: 18px !important;
}

/* Elementor Cart Button*/
.elementor-menu-cart__toggle_button {
	background-color: var(--do-transparent) !important;
	padding: 0 !important;
}

/* WooCommerce Buttons */

.woocommerce .button {
	color: var(--do-white) !important;
	background-color: var(--e-global-color-primary) !important;
	transition: all ease .2s;
}

.woocommerce .button:hover {
	color: var(--do-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;
}

/* Language Switcher */

.gt_container-cun8mm .gt_switcher .gt_selected {
	background: var(--do-transparent) !important;
}

.gt_container-cun8mm .gt_switcher .gt_selected a {
	border: none !important;
	color: var(--e-global-color-4d8ce0a) !important;
}

.gtranslate_wrapper .gt-lang-code {
	display: none;
}

.gtranslate_wrapper a.nturl {
	font-size: 0px;
}

.gtranslate_wrapper .gt_float_switcher,
.gtranslate_wrapper .gt_float_switcher .gt-selected {
	background: #ffffff00 !important;
}

.gtranslate_wrapper .gt_float_switcher {
	box-shadow: none;
}

.gtranslate_wrapper .gt_float_switcher .gt_options a,
.gtranslate_wrapper .gt_float_switcher .gt-selected .gt-current-lang {
	padding: 5px 15px !important;
}

.gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow {
	transform: rotate(0deg) !important;
}

.gt_float_switcher .gt-selected .gt-current-lang span.gt_float_switcher-arrow.gt_arrow_rotate {
	transform: rotate(-180deg) !important;
}


/* Icon box */
.elementor-icon-box-title {
    margin-top: 0px;
	margin-bottom: 0px;
}

/* Nieuws single page Gutenberg */
.single .wp-block-group {
    margin-bottom: 30px;
}

/* Underline text decoration */
.elementor-icon-list-item a{
	text-decoration-color: var(--do-black) !important;
}