/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Mar 18 2026 | 13:34:38 */
/* =====================================================
	Webr Form v2 (Grid)
	Scoped: .webr-contactformulier
===================================================== */


/* =====================================================
	VARIABLES
===================================================== */

.webr-contactformulier {

	/* ===== Colors ===== */
	--zwart: #000000;
	--tekstZwart: #1a1a1a;
	--tekstGrijs: #666666;
	--groen: #2e7d32;

	/* ===== Layout ===== */
	--form-gap: 15px;
	--form-field-margin: 10px;

	/* ===== Styling ===== */
	--form-radius: 15px;

	/* ===== Typography ===== */
	--form-title-font: 'Poppins', sans-serif;
	--form-title-size: 26px;
	--form-title-weight: 600;
	--form-title-lineheight: 1.2em;

	--form-title-p-size: 24px;
	--form-title-p-weight: 700;

	--form-label-size: 16px;

	/* ===== Misc ===== */
	--checkbox-gap: 5px;

	/* ===== Grid Base ===== */
	display: grid;
	gap: var(--form-gap);
	grid-template-columns: repeat(12, 1fr);
	align-items: start;
}


/* =====================================================
	GRID COLUMNS (12-COLUMN SYSTEM)
===================================================== */

.webr-contactformulier .col-12 { grid-column: span 12; }
.webr-contactformulier .col-11 { grid-column: span 11; }
.webr-contactformulier .col-10 { grid-column: span 10; }
.webr-contactformulier .col-9  { grid-column: span 9; }
.webr-contactformulier .col-8  { grid-column: span 8; }
.webr-contactformulier .col-7  { grid-column: span 7; }
.webr-contactformulier .col-6  { grid-column: span 6; }
.webr-contactformulier .col-5  { grid-column: span 5; }
.webr-contactformulier .col-4  { grid-column: span 4; }
.webr-contactformulier .col-3  { grid-column: span 3; }
.webr-contactformulier .col-2  { grid-column: span 2; }
.webr-contactformulier .col-1  { grid-column: span 1; }


/* =====================================================
	FORM WRAPPERS
===================================================== */

.webr-contactformulier .form-input {
	margin-bottom: var(--form-field-margin);
}

.webr-contactformulier .form-input > * {
	width: 100%;
}


/* =====================================================
	TYPOGRAPHY
===================================================== */

.webr-contactformulier .titel-webr-contactformulier {
	margin: 15px 0 var(--form-field-margin);
	font-family: var(--form-title-font);
	font-size: var(--form-title-size);
	font-weight: var(--form-title-weight);
	line-height: var(--form-title-lineheight);
	color: var(--zwart);
}

.webr-contactformulier .titel-webr-contactformulier p {
	font-size: var(--form-title-p-size);
	font-weight: var(--form-title-p-weight);
}

.webr-contactformulier label {
	font-size: var(--form-label-size);
	text-transform: none;
	color: var(--tekstZwart);
}

.webr-contactformulier .wpcf7-list-item-label {
	font-family: inherit !important;
}


/* =====================================================
	FORM ELEMENTS
===================================================== */

.webr-contactformulier input[type="date"],
.webr-contactformulier input[type="email"],
.webr-contactformulier input[type="number"],
.webr-contactformulier input[type="password"],
.webr-contactformulier input[type="search"]:not(.cmsmasters-header-search-form__input),
.webr-contactformulier input[type="tel"],
.webr-contactformulier input[type="text"],
.webr-contactformulier input[type="url"],
.webr-contactformulier select,
.webr-contactformulier textarea {
	border-radius: var(--form-radius);
	color: var(--tekstGrijs);
}

.webr-contactformulier input[type="button"],
.webr-contactformulier input[type="submit"] {
	border-radius: var(--form-radius);
}


/* =====================================================
	ACCEPTANCE / CHECKBOX ROW
===================================================== */

.webr-contactformulier .acceptance-row {
	grid-column: span 12;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.webr-contactformulier .acceptance-row input[type="checkbox"] {
	width: auto !important;
	margin: 0 var(--checkbox-gap) 0 0 !important;
}

.webr-contactformulier .acceptance-input {
	flex-grow: 1;
}

.webr-contactformulier .acceptance-row .wpcf7-acceptance a {
	color: var(--zwart);
	text-decoration: underline;
	transition: text-decoration 0.2s ease;
}

.webr-contactformulier .acceptance-row .wpcf7-acceptance a:hover {
	text-decoration: none;
	color: var(--tekstGrijs);
}


/* =====================================================
	SUBMIT BUTTON
===================================================== */

.webr-contactformulier .verzenden-knop {
	grid-column: span 12;
	position: relative;
}

.webr-contactformulier .verzenden-knop input {
	width: 100%;
}

.webr-contactformulier .verzenden-knop .wpcf7-spinner {
	position: absolute;
	top: 50%;
	right: var(--checkbox-gap);
	width: auto;
	transform: translateY(-50%);
}


/* =====================================================
	RESPONSIVE
===================================================== */

@media (max-width: 767.98px) {
	.webr-contactformulier {
		grid-template-columns: 1fr;
	}

	.webr-contactformulier [class*="col-"] {
		grid-column: span 1;
	}
}

.grecaptcha-badge {
	visibility: hidden !important;
}

/* =====================================================
	Custom voor inschrijf formulier
===================================================== */


.webr-contactformulier .form-input > p {
	margin-bottom: 0px;
}