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



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

.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; }

/* Haalt ruimte onder tekst weg */
p:last-child { margin-bottom:0em; }

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

.elementor-message:before {
	display: none;
}

.elementor-field-subgroup .elementor-field-option {
	display:flex;
	align-items:center;
}

.elementor-field-type-acceptance .elementor-field-option{
	align-items:flex-start;
}

/* Radio */
.elementor-form input[type="radio"], .elementor-form input[type="radio"]:before {
	border-radius:50%;
}

/* Select */
/* Zorgt ervoor dat de Select net zo hoog blijft als andere velden */
.elementor-field-group .elementor-select-wrapper select {
	line-height: 1em;
}

.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;
}

/*------------------------------------*\
	COOKIEYES
\*------------------------------------*/

.cky-footer-wrapper div:last-child,
[data-cky-tag="powered-by"],
[data-cky-tag="detail-powered-by"] {
  display: none !important;
}

div[data-cky-tag="powered-by"] {
  display: none !important;
}

.cky-modal button:hover {
	background:none;
}

/* CookieYes Midden */
.cky-consent-container {
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	bottom:1em !important;
	transform: translate(-50%, -50%) !important;
	z-index: 99999 !important;
	max-width: 90%;
		max-height: max-content;
}

.cky-consent-container::after {
	content: "";
	width: 200vw;
	height: 200vh;
	display: block;
	background: rgba(0, 0, 0, .4);
	left: 0px !important;
	position: absolute;
	margin-left: -100vw;
	margin-top: -100vh;
	z-index: -1;
}

.cky-consent-container.cky-hide::after {
  content: "";
	display:none;
}

.cky-consent-container {
	max-width:calc(100% - 1em)!important;
}

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

.cky-btn-accept {
	background: var(--e-global-color-primary)!important;
	color: #fff!important;
	border: 2px solid var(--e-global-color-primary)!important;
}

.cky-btn-reject {
	background: var(--e-global-color-text)!important;
	color: #fff!important;
	border: 2px solid var(--e-global-color-text)!important;
}

.cky-btn-customize {
	background: transparent!important;
	color: var(--e-global-color-text)!important;
	border: 2px solid var(--e-global-color-text)!important;
}

.cky-btn-preferences {
	background: transparent!important;
	color: var(--e-global-color-text)!important;
	border: 2px solid var(--e-global-color-text)!important;
}
/*------------------------------------*\
	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
}