/* 
Theme Name: The Studio Child
Theme URI: https://github.com/elementor/hello-theme/
Description: Studio Child is a child theme of The Studio
Author: The Studio
Author URI: https://www.the-studio.be
Template: thestudio
Version: 1.0.1
Text Domain: thestudio-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
*/

body {
	background:var( --e-global-color-ef49f8f )!important;
}

.elementor-message.elementor-message-danger {
	background:rgba(218, 38, 38,.1);
	color:rgba(218, 38, 38,.8);
	box-shadow:0 0 0 .1em rgba(218, 38, 38,.8);
	padding:.5em;
	font-size:.6em;
	display: inline-block;
	border-radius:.2em;
}

/*------------------------------------*\
	MASTER SETTINGS
\*------------------------------------*/

:root {
--container-max-width: calc(var(--max-width-site) * 1px);
--fs-slope: calc((var(--max-font-size) - var(--min-font-size)) / (var(--max-width-site) - var(--min-width-site)));
--fs-intercept: calc(var(--min-font-size) - var(--fs-slope) * var(--min-width-site));
}

body { overflow-x:hidden; }
html { font-size: clamp(calc(var(--min-font-size) * 1px),calc(var(--fs-slope) * 100vw + var(--fs-intercept) * 1px),calc(var(--max-font-size) * 1px)); scrollbar-gutter:stable;}

.e-con { --content-width: min(100%, var(--container-max-width)); }
.e-con > .e-con-inner { max-width: var(--content-width);}

.elementor img { width: 100%; }

.verberg, .hide { position: absolute; overflow: hidden; width: 0; height: 0; pointer-events: none; }

/* Geen extra ruimte rond SVGs */
.elementor-icon-wrapper { line-height: 0px; }

/* Verbergt Captcha badge */
.grecaptcha-badge { visibility: hidden; }

/* CookieYes revisit */
.cky-btn-revisit-wrapper { display: none!important;}

/* Haalt blauwe focus van buttons weg */
*:focus { outline:none; }

/*------------------------------------*\
	FORMULIEREN
\*------------------------------------*/

/* Achtergrond kleur bij de "bestand uploaden" */
.elementor-field:not(.elementor-select-wrapper) { background-color:rgba(255,255,255,0)!important; }

.elementor-form input[type="checkbox"], .elementor-form input[type="radio"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; display: inline-block!important; position: relative; }

.elementor-form input[type="checkbox"]:before, .elementor-form input[type="radio"]:before { content:""; opacity: 0; position: absolute; }

.elementor-form input[type="checkbox"]:checked:before, .elementor-form input[type="radio"]:checked:before { opacity: 1; }

/*------------------------------------*\
	BETERE ANIMATIES
\*------------------------------------*/

@keyframes fadeDown {
	from {
		opacity: 0;
		transform: translate3d(0,-25%,0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.elementor-element.fadeInDown {
	animation-name: fadeDown
}

@keyframes fadeLeft {
	from {
		opacity: 0;
		transform: translate3d(-25%,0,0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.elementor-element.fadeInLeft {
	animation-name: fadeLeft
}

@keyframes fadeRight {
	from {
		opacity: 0;
		transform: translate3d(25%,0,0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.elementor-element.fadeInRight {
	animation-name: fadeRight
}

@keyframes fadeUp {
	from {
		opacity: 0;
		transform: translate3d(0,25%,0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.elementor-element.fadeInUp {
	animation-name: fadeUp
}

@keyframes slideDown {
	from {
		opacity: 0;
		transform: translate3d(0,-25%,0)
	}

	to {
		opacity: 1;
		transform: none
	}
}

.elementor-element.slideInDown {
	animation-name: slideDown
}

@keyframes slideLeft {
	from {
		transform: translate3d(-25%,0,0)
	}

	to {
		transform: none
	}
}

.elementor-element.slideInLeft {
	animation-name: slideLeft
}

@keyframes slideRight {
	from {
		transform: translate3d(25%,0,0)
	}

	to {
		transform: none
	}
}

.elementor-element.slideInRight {
	animation-name: slideRight
}

@keyframes slideUp {
	from {
		transform: translate3d(0,25%,0)
	}

	to {
		transform: none
	}
}

.elementor-element.slideInUp {
	animation-name: slideUp
}