/**
Theme Name: Astra Child
Author: Monkey Vision
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* VOEG JE CSS TOE EN SCHEIDT DEZE DMV DE COMMENT RIJEN ZOALS HIERDONDER,
 * PER ONDERDEEL VAN JE SITE EEN APARTE SECTIE, BV EEN SOORT STYLING VAN EEN ROW, EEN PLUGIN, ETC ETC
 * HOUDT HET OVERZICHTELIJK VOOR DE VOLGENDE LEZER
 * HOOFD ITEM? LANGE COMMENT ROW
 * SUB ITEM? KORTERE VERSIE ZOALS HIERONDER MET DE MEDIA QUERIES
*/

html {
	overflow-x: hidden;
	overflow-y: visible;
}

body {
	overflow-x: hidden;
	overflow-y: hidden;
}

/****************************************** HEADER ******************************************/

.elementor-location-header .elementor-sticky--effects {
	/* Schrijf hier je CSS als je de header een andere size wilt geven op scroll*/
	/* De laatste class zit op het header element */
}
.elementor-location-header .mobile-switch .elementor-icon-wrapper{
    display: flex;
    justify-content: center;
    align-items: center;
}

@media only screen and (max-width: 480px) {
	.elementor-location-header .navbar .elementor-widget-button {
		display: none;
	}
}

/****************************************** FOOTER ******************************************/
.elementor-location-footer a {
	color: #fff;
	transition: all .2s linear;
}

.elementor-location-footer a:hover, .elementor-location-footer a:hover span {
	color: #FF8500 !important;
	transition: all .2s linear;
}

@media only screen and (max-width: 920px) {
	.elementor-location-footer .footer .elementor-container {
		flex-wrap: wrap;
		gap: 20px;
		justify-content: center;
		max-width: 600px;
	}
	
	.elementor-location-footer .footer .elementor-container .elementor-column {
		width: calc(50% - 20px);
	}
}

@media only screen and (max-width: 450px) {
	.elementor-location-footer .footer .elementor-container {
		max-width: 182px;
		gap: 34px;
	}
	
	.elementor-location-footer .footer .elementor-container .elementor-column {
		width: 100%;
	}
}

/****************************************** HIER JOUW CUSTOM CSS ******************************************/
/************** Algemene elementen **************/
h1, h2, h3, h4, h5 {
	font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
	color: inherit !important;
	margin: 0 !important;
}

p {
	margin: 0 !important;
}

.eicon-spacer {
	height: 0;
	padding: 0 !important;
}

.eicon-spacer::before {
	content: none;
}

/*** list items ***/
.elementor-icon-list-item .elementor-icon-list-icon {
	align-self: flex-start;
	margin-top: 7px;
}

/************** Einde algemene elementen **************/



/******************** Home ********************/
.home-hero-gradient .elementor-background-overlay {
	background: linear-gradient(90deg, rgba(0,0,0,0) 20%, rgba(0,0,0,0.40) 50%, rgba(0,0,0,0.40) 80%) !important;
}

@media only screen and (max-width: 767px) {
	.home-hero-gradient {
		background-position: 100% 50% !important;
	}
	
	.home-hero-gradient .elementor-background-overlay {
		background: black !important;
		opacity: 0.4 !important;
	}
}
/******************** Einde home ********************/



/******************** Buttons ********************/
.primary-btn .elementor-button-wrapper a {
	color: #ffffff !important;
	background-color: #FF8500 !important; 
	border-radius: 10px !important;
	border: 2px solid #FF8500;
	padding: 11px 22px !important;
}

.primary-btn .elementor-button-wrapper a:hover {
	color: #FF8500 !important;
	background-color: transparent !important;
	border: 2px solid #FF8500;
}

.underline-btn .elementor-button-wrapper a {
	text-decoration: underline !important;
	padding: 0 !important;
	background-color: transparent !important;
}

.underline-btn .elementor-button-wrapper a:hover {
	transform: scale(1.1);
	transition: transform 0.3s ease;
}
/******************** Einde buttons ********************/


/************************ Drie boxes met uitleg ************************/
.row-drie-boxes .elementor-container {
	gap: 22px;
	align-items: flex-start;
	justify-content: center;
}

.row-drie-boxes .elementor-column {
	width: calc(33.33% - 20px);
	min-height: 368px;
}

.row-drie-boxes .elementor-column > .elementor-widget-wrap {
	border-radius: 20px !important;
	padding: 7% !important;
	flex-direction: column;
	align-items: center;
}

.row-drie-boxes .elementor-column .grow-available-space {
	flex-grow: 1;
}

@media only screen and (max-width: 1350px) {
	.row-drie-boxes .elementor-container {
		align-items: flex-start;
	}
	
	.row-drie-boxes .elementor-column > .elementor-widget-wrap {
		padding: 10% !important;
	}
}

@media only screen and (max-width: 1350px) and (min-width: 1150px) {
	.row-drie-boxes .elementor-column > .elementor-widget-wrap * {
		width: auto;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 1150px) {
	.row-drie-boxes .elementor-container {
		flex-wrap: wrap;
		align-items: stretch;
	}
	
	.row-drie-boxes .elementor-column {
		width: calc(50% - 20px)!important;
	}
	
	.row-drie-boxes .elementor-column > .elementor-widget-wrap {
		justify-content: flex-start !important;
	}
}

@media only screen and (max-width: 970px) and (min-width: 767px) {
	.row-drie-boxes .elementor-column > .elementor-widget-wrap * {
		width: auto;
		margin: 0 auto;
	}
}

@media only screen and (max-width: 767px) {
	.row-drie-boxes .elementor-container {
		max-width: 530px !important;
	}
	
	.row-drie-boxes .elementor-column {
		width: 100%!important;
	}
}

@media only screen and (max-width: 480px) {
	.row-drie-boxes .elementor-column > .elementor-widget-wrap {
		padding: 14% 8% !important;
	}
	
	.row-drie-boxes .elementor-column > .elementor-widget-wrap * {
		width: auto;
		margin: 0 auto;
	}
}

/************************ Einde drie boxes met uitleg ************************/



/************************ column images en columns teksten ************************/
@media only screen and (min-width: 1024px) {
	.column-text-left-derde-deel {
		max-width: 500px;
		margin-left: auto;
	}
	
	.column-text-left {
		max-width: 750px;
		margin-left: auto;
	}

	.column-text-right {
		max-width: 750px;
		margin-right: auto;
	}
	
	.column-image-left > .elementor-widget-wrap {
		border-radius: 0 20px 20px 0;
	}

	.column-image-right > .elementor-widget-wrap {
		border-radius: 20px 0 0 20px;
	}
}

@media only screen and (max-width: 1024px) {
	.column-image-left, .column-image-right {
		max-width: 820px;
		margin: 0 auto;
	}
	
	.column-image-left .elementor-widget-wrap, .column-image-right .elementor-widget-wrap {
		border-radius: 20px;
	}
}

@media only screen and (max-width: 767px) {
	.column-image-left .elementor-widget-wrap, .column-image-right .elementor-widget-wrap {
		border-radius: 15px;
	}
}
/************************ Einde column images en columns teksten ************************/



/************************ Review blok ************************/
@media only screen and (max-width: 767px) {
	.row-review .elementor-column > .elementor-widget-wrap {
		background-size: 0 !important;
	}	
}
/************************ Einde review blok ************************/



/************************ Video slider ************************/
.row-video-slider .elementor-custom-embed-play i::before {
	content: none !important;
}

.row-video-slider .elementor-custom-embed-play i {
	background-image: url(/wp-content/uploads/2022/10/playbutton.svg);
	background-size: contain;
    background-repeat: no-repeat;
	width: 52px;
    height: 60px;
	opacity: 1 !important;
}


/* pagination */
.row-video-slider .swiper-pagination {
	margin-bottom: -12px;
    display: flex;
	align-items: center;
    gap: 6px;
}

.row-video-slider .swiper-pagination .swiper-pagination-bullet {
	width: 14px;
    height: 14px;
    background: #fff;
	opacity: 1;
	margin: 0;
	transition: all 0.3s ease;
}

.row-video-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
	width: 19px;
    height: 19px;
    background: #FF8500;
	transition: all 0.3s ease;
}

@media only screen and (max-width: 767px) {
	.row-video-slider .swiper-pagination {
		justify-content: center;
	}
}
/************************ Einde video slider ************************/



/************************ usps boxes ************************/
.inner-row-usps-boxes .elementor-container {
	justify-content: center;
	gap: 67px;
}

.inner-row-usps-boxes .elementor-container .elementor-column {
	width: min-content;
}

.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container {
	width: 195px;
	height: 195px;
}

.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container .elementor-icon-wrapper {
	display: flex;
    justify-content: center;
    align-items: center;
}

.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container .elementor-icon-wrapper .elementor-icon {
	font-size: 80px !important;
}

@media only screen and (max-width: 1024px) {
	.inner-row-usps-boxes .elementor-container {
		max-width: 650px !important;
		gap: 60px;
	}
	
	.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container {
		width: 180px;
		height: 180px;
	}
	
	.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container .elementor-icon-wrapper .elementor-icon {
		font-size: 74px !important;
	}
}

@media only screen and (max-width: 480px) {
	.inner-row-usps-boxes .elementor-container {
		gap: 38px;
	}
	
	.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container {
		width: 160px;
		height: 160px;
	}
	
	.inner-row-usps-boxes .elementor-column .elementor-widget-icon .elementor-widget-container .elementor-icon-wrapper .elementor-icon {
		font-size: 60px !important;
	}
}
/************************ Einde usps boxes ************************/



/************************ Blog single page ************************/
.blog-content h1, .blog-content h2, .blog-content h3, .blog-content h4, .blog-content h5 {
	color: #000 !important;
	font-family: "Fredoka" !important;
	line-height: 1.3 !important;
	font-weight: 500 !important;
}

.blog-content h1 {
	font-size: 47px !important;
}

.blog-content strong, .blog-content b {
	font-weight: 500;
}

@media only screen and (max-width: 1024px) {
	.blog-content h1 {
		font-size: 40px !important;
	}
}

@media only screen and (max-width: 767px) {
	.blog-content h1 {
		font-size: 34px !important;
	}
}
/************************ Einde blog single page ************************/



/************************ Row alle video's / filmpjes ************************/
.row-alle-filmpjes .swiper-slide {
	border-radius: 20px;
}

.row-alle-filmpjes .swiper-slide::after {
	display: none;
}

/* arrows en play btn */
/* Arrows */
.row-alle-filmpjes .elementor-swiper-button i {
	width: 30px;
    height: 30px;
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1 !important;
	background-image: url(/wp-content/uploads/2022/10/arrow-left.svg);
}

.row-alle-filmpjes .elementor-swiper-button i::before {
	display: none
}

.row-alle-filmpjes .elementor-swiper-button-prev {
	left: 40px !important;
}

.row-alle-filmpjes .elementor-swiper-button-next {
	right: 40px !important;
}

.row-alle-filmpjes .elementor-swiper-button-next i {
	background-image: url(/wp-content/uploads/2022/10/arrow-right.svg);
}


/* Play btn */
.row-alle-filmpjes .swiper-slide .elementor-custom-embed-play i {
	width: 40px;
    height: 50px;
    background-image: url(/wp-content/uploads/2022/10/playbutton.svg);
    background-size: contain;
    background-repeat: no-repeat;
    opacity: 1 !important;
}

.row-alle-filmpjes .swiper-slide .elementor-custom-embed-play i::before {
	display: none;
}

@media only screen and (max-width: 767px) {
	.row-alle-filmpjes .swiper-slide .elementor-custom-embed-play i {
		width: 37px;
		height: 40px;
	}
	
	.row-alle-filmpjes .elementor-swiper-button-prev {
		left: 20px !important;
	}

	.row-alle-filmpjes .elementor-swiper-button-next {
		right: 20px !important;
	}
}
/************************ Einde row alle video's / filmpjes ************************/




/****************************************** BLOG THUMB LOOP ******************************************/
/* zodat hoogte van blogs gelijk blijft */
.row-blogs article > .post, .row-blogs article .post > .elementor-section, .row-blogs article .elementor-section > .elementor-container  {
	height: 100%;
}

.elementor-post {
	transition: all 0.3s ease !important;
}

.elementor-post:hover {
	transform: translateY(-15px);
	transition: all 0.3s ease;
}

.column-url,
.column-url *{
	position:absolute;
	height:100%;
	width:100%;
	z-index:2;
	opacity:0;
	left: 0;
	top: 0;
}
/****************************************** OWL CAROUSEL ******************************************/
.owl-carousel {
	display:block!important;
}
.owl-carousel .owl-nav button{
	height:25px;
	width:25px;
	background-repeat:no-repeat!important;
	background-size:contain!important;
	background-position:center!important;
}
.owl-carousel .owl-nav button span{
	display:none;
}
.owl-carousel .owl-nav .owl-prev{
	background-image:url('/wp-content/uploads/2022/01/Icon-ionic-ios-arrow-back.svg')!important;
}
.owl-carousel .owl-nav .owl-next{
	background-image:url('/wp-content/uploads/2022/01/Icon-ionic-ios-arrow-forward.svg')!important
}
.owl-carousel .owl-dots {
	margin: auto;
}
.owl-carousel .owl-dots .owl-dot{
	background-color:black;
	height:7px;
	width:7px;
	margin: 5px;
}
.owl-carousel .owl-dots .owl-dot.active {
	background-color:grey;
}
/****************************************** GRAVITY FORMS **************************************************/
.gform_body input,
.gform_body select {
	padding: 10px 15px !important;
}
.woocommerce select {
	padding:0 10px!important;
}

/********************************** KLEINE VELDEN EN INPUTS *******************/
.gform_body input[type=text],
.gform_body input[type=tel] {
    border: none !important;
    border-radius: 0 !important;
    border: 1px solid #000000b0 !important;
    background-color: white !important;
    line-height: 24px !important;
}
/********************************** KLEINE VELDEN FOCUS ********************/
.gform_body input[type=text]:focus,
.gform_body input[type=tel]:focus {
    border: 1px solid #CBCBCB !important;
	box-shadow: none !important;
}
					/*bericht*/
.gform_body textarea {
    border: none;
    border-radius: 0px!important;
    border: 1px solid #000000b0 !important;
    background-color: white !important;
}
					/*selectie bericht*/
.gform_body textarea:focus {
    border: 1px solid #CBCBCB !important;
	box-shadow: none !important;
}

/******************** VALIDATIE **************************/




/********************* Gravity form / formulier code *********************/

.gform_wrapper * {
	font-family: "Fredoka";
}

.gform_wrapper .gform_body .spacer {
	display: none !important;
}

.gform_wrapper .gform_body input, .gform_wrapper .gform_body textarea {
	background-color: #F5F5F5 !important;
	border-radius: 15px !important;
	resize: none;
	padding: 10px 22px !important;
	max-height: 130px;
	border: 1px solid transparent !important;
	font-size: 16px !important;
}

.gform_wrapper .gform_body input::placeholder, .gform_wrapper .gform_body textarea::placeholder {
	color: #000;
	font-size: 16px !important;
}

/* .gform_wrapper .gform_body textarea {
	border-radius: 20px !important;
} */

.gform_wrapper .gform_body .gfield_required {
	display: none;
}

.gform_wrapper .gform_body .gform_fields {
	grid-column-gap: 12px !important;
	grid-row-gap: 16px !important;
}

.gform_wrapper .gform_footer {
	justify-content: flex-end;
	margin: 0 !important;
	padding: 0 !important;
}

.gform_wrapper .gform_footer .gform_button {
    font-size: 17px;
    color: #fff;
    background-color: #FF8500;
    border-radius: 10px;
	font-weight: 500;
	margin: 3px 0 0 0;
	line-height: 1.2 !important;
	border: 2px solid #FF8500;
	padding: 11px 22px !important;
	
	transition: all .3s;

}

.gform_wrapper .gform_footer .gform_button:hover {
	color: #FF8500;
    background-color: transparent;
	transition: all .3s;
}


@media only screen and (max-width: 900px) {
/* 	.elementor-column {
		width: 100% !important;
	} */
}

@media only screen and (max-width: 640px) {
	.gform_wrapper .name_first {
		margin-bottom: 16px !important;
	}
	
	.gform_wrapper .name_last {
		margin-bottom: 0px !important;
	}
}



					/* VALID */

/* border van kleine velden validatie */
    .gform_wrapper input[type=text].valid,
	.woocommerce-input-wrapper input[type=text].valid,
	.woocommerce-input-wrapper input[type=tel].valid,
	.woocommerce-input-wrapper input[type=email].valid {
        border: 1px solid #56c92a !important;
        position: relative;
    }

/* checkmark van kleine velden validatie */
    .gform_wrapper input[type=text].valid,
	.woocommerce-input-wrapper input[type=text].valid,
	.woocommerce-input-wrapper input[type=tel].valid,
	.woocommerce-input-wrapper input[type=email].valid {
        background-image: url("/wp-content/uploads/2021/07/checkmark.svg")!important;
        background-size: 15px!important;
        background-position: right!important;
        background-position-x: 98%!important;
        background-repeat: no-repeat!important;
    }
/* border van bericht validatie */
    .gform_wrapper textarea.valid, 
	.woocommerce-input-wrapper textarea.valid{
        border: 1px solid #56c92a !important;
        position: relative;
    }
/* checkmark van bericht validatie */
    .gform_wrapper textarea.valid,
    .woocommerce-input-wrapper textarea.valid{
        background-image: url("/wp-content/uploads/2021/07/checkmark.svg")!important;
        background-size: 15px!important;
        background-position: right!important;
        background-position-x: 98%!important;
        background-repeat: no-repeat!important;
    }


					/* ERROR */
/* border van kleine velden error */
    .gform_wrapper input[type=text].error,
	.woocommerce-input-wrapper input[type=text].error,
	.woocommerce-input-wrapper input[type=tel].error,
	.woocommerce-input-wrapper input[type=email].error {
        border: 1px solid #EE2B2B !important;
    }
/*error tekst onder het bericht*/
	.gform_wrapper label.error,
	html .woocommerce-input-wrapper label.errror {
		color: #cf361f!important;	
	}
/* kruisje van bericht error */
    .gform_wrapper input[type=text].error,
	.woocommerce-input-wrapper input[type=text].error,
	.woocommerce-input-wrapper input[type=tel].error,
	.woocommerce-input-wrapper input[type=email].error {
        background-image: url("/wp-content/uploads/2021/07/cross.svg")!important;
        background-size: 15px!important;
        background-position: right!important;
        background-position-x: 98%!important;
        background-repeat: no-repeat!important;
    }
/* border van tekstveld error */
	.gform_wrapper textarea.error,
	.woocommerce-input-wrapper  textarea.error{
	    border: 1px solid #EE2B2B !important;
        position: relative;
}
/* checkmark van bericht validatie */
    .gform_wrapper textarea.error,
	.woocommerce-input-wrapper textarea.error {
        background-image: url("/wp-content/uploads/2021/07/cross.svg")!important;
        background-size: 15px!important;
        background-position: right!important;
        background-position-x: 98%!important;
        background-repeat: no-repeat!important;
    }