/* Meldingen en veldfouten voor de formulieren */
.formulier-melding{margin:0 0 20px;padding:14px 18px;border-radius:4px;font-size:15px;line-height:1.5}
.formulier-melding.is-gelukt{background:rgba(46,125,50,.15);border-left:4px solid #4caf50;color:#cde9ce}
.formulier-melding.is-fout{background:rgba(183,28,28,.15);border-left:4px solid #e53935;color:#f3cccc}
.veld-fout{display:block;margin-top:6px;font-size:13px;color:#ef9a9a}
.control-group.heeft-fout input,
.control-group.heeft-fout textarea,
.control-group.heeft-fout select{border-color:#e53935 !important;box-shadow:0 0 0 1px rgba(229,57,53,.4)}
.formulier-honeypot{position:absolute !important;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- Leesbare invoervelden ---------------------------------------------
   remnant-joomla_139.css zette de formuliervelden op zwarte tekst met een
   zwarte achtergrond, waardoor je niet kon zien wat je typte.            */
.fox-form input[type=text],
.fox-form input[type=email],
.fox-form input[type=tel],
.fox-form input[type=number],
.fox-form input[type=datetime-local],
.fox-form textarea,
.fox-form select{background-color:#fff;color:#222;border:1px solid #d8d8d8}
.fox-form input::placeholder,
.fox-form textarea::placeholder{color:#8a8a8a}
.fox-form input:focus,
.fox-form textarea:focus,
.fox-form select:focus{border-color:#efbd66;outline:none}

/* --- Alle invoervelden even hoog (40px) --------------------------------
   De foxcontact-stylesheet zet height:28px via een ID-selector
   (div#fox-container-cXXX input[type="text"]). Die weegt zwaarder dan een
   klasse-selector, dus is !important hier nodig om er overheen te gaan.  */
.fox-form input[type=text],
.fox-form input[type=email],
.fox-form input[type=tel],
.fox-form input[type=number],
.fox-form input[type=datetime-local],
.fox-form select{
	height:40px !important;
	line-height:normal !important;
	box-sizing:border-box !important;
	padding:6px 10px !important;
}

/* Datum+tijd: zelfde breedte als de velden ernaast */
.fox-form input[type=datetime-local],
.fox-form .fox-item-calendar-input{
	display:block;
	width:100%;
	max-width:100%;
	cursor:auto;
}
.fox-form input[type=datetime-local]::-webkit-datetime-edit{padding:0}
.fox-form input[type=datetime-local]::-webkit-datetime-edit-fields-wrapper{padding:0}

/* Tekstvak houdt zijn eigen hoogte, wel dezelfde binnenruimte */
.fox-form textarea{padding:6px 10px !important;box-sizing:border-box}

/* Het verborgen honeypot-veld moet klein blijven */
.formulier-honeypot input[type=text]{height:1px !important;padding:0 !important}