/*
Theme Name:     Wouters zuig- en blaastechniek (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;
	--light-gray: #F5F5F5;
}

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

::selection {
	background: var(--e-global-color-primary);
}


/**********    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-button-content-wrapper {
	align-items: center;
}

div p:first-of-type {
	margin-top: 0;
}

.elementor-widget-text-editor a {
	text-decoration: underline !important;
}

.elementor-widget-text-editor ul li:not(:last-of-type) {
	margin-bottom: 1em;
}

.elementor-heading-title a {
	font-weight: inherit !important;
}

/****************************************** Mobile menu pop-up **************************************/
.dialog-widget-content .elementor-widget-nav-menu ul li a {
	text-align: center;
}

/****************************************** Spacing *************************************************/
.padding-section {
	padding-top: 110px !important;
	padding-bottom: 110px !important;
}

.padding-top {
	padding-top: 110px !important;
}

.padding-bottom {
	padding-bottom: 110px !important;
}

@media screen and (max-width: 1024px) {
	.padding-section {
		padding-top: 70px !important;
		padding-bottom: 70px !important;
	}

	.padding-top {
		padding-top: 70px !important;
	}

	.padding-bottom {
		padding-bottom: 70px !important;
	}
}

@media screen and (max-width: 767px) {
	.padding-section {
		padding-top: 40px !important;
		padding-bottom: 40px !important;
	}

	.padding-top {
		padding-top: 40px !important;
	}

	.padding-bottom {
		padding-bottom: 40px !important;
	}
}

@media screen and (min-width: 1200px) {
	.half-width-right {
		padding-right: calc((100vw - 1150px) / 2);
	}	
}

/****************************************** Header ****************************************************/
header .elementor-nav-menu > li > .elementor-nav-menu--dropdown {
	background: linear-gradient(270deg, var( --e-global-color-primary ) 0%, var( --e-global-color-secondary ) 100%);
	padding-top: 10px;
	padding-bottom: 10px;
}

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

/****************************************** 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 ******************************************/
.gform_required_legend {
    position: absolute;
    bottom: 90px;
	font-size: 13px;
	color: #585e6a;
}

.gfield input:not([type='submit']),
.gfield textarea,
.gform-theme--foundation .gfield select {
    background-color: #fff !important;
    border: solid 0px #000 !important;
	border-bottom-width: 2px !important;
    border-radius: 0px !important;
	box-shadow: none !important;
	padding: 20px 10px;
}

.gfield input:not([type='submit']):focus,
.gfield textarea:focus,
.gform-theme--foundation .gfield select:focus {
    box-shadow: none !important;
	border-bottom-color: var(--e-global-color-primary) !important;
}

.gform-field-label {
    color: #000 !important;
	font-weight: 700 !important;
}

body .gform-theme--framework .gform-field-label>.gfield_required  {
    font-size: 18px;
    line-height: 1;
}

input[type="submit"] {
	line-height: 1 !important;
    padding: 20px 30px !important;
    border-radius: 0 !important;
    background: #000 !important;
	margin-top: 35px !important;
}

input[type="submit"]:hover {
	background: var(--e-global-color-primary) !important;
}