/* CSS Template for plugin 'mailform' */

@import "/vendor/bootstrap-5.3.0/css/bootstrap.min.css";
@import "vendor/Lato2OFLWeb/Lato/latofonts.css";

*,
select option {
	font-size: .9rem;
	font-family: LatoWeb;
}

.form-control::placeholder {
	color: #b7b7b7;
}

input:focus::placeholder {
	color: transparent;
}

body {
	text-align: center;
	background: #f2f2f0;
	color: #494845;
	padding: 20px;
}

#groupform {
	max-width: 800px;
	/*background: #f7f5f2;*/
	background: #eceae8;
	text-align: left;
	margin: 0 auto 0 auto;
	padding: 20px;
}

#groupform .header {
	background: #151515;
	color: #999999;
	padding: 20px 20px 10px 20px;
	overflow: hidden;
}

#groupform .header span {
	display: block;
	padding: 10px 0 0 0;
	font-size: .8rem;
	text-transform: uppercase;
}

#groupform .header div {
	float: left;
}

#groupform .header img.logo-groups {
	float: right;
	height: 83px;
}

#groupform .subheader {
	padding: 20px 0;
}

#groupform .formulier {
	padding: 20px;
	background: #ffffff;
}

#groupform .formulier .required-field {
	color: #dc3545;
}

@media only screen and (max-width: 500px) {
	#groupform .header {
		padding: 10px 20px 10px 20px;
	}

	#groupform .header span {
		display: none;
	}

	#groupform .header img.logo-groups {
		height: 55px;
	}
}

@media only screen and (max-width: 400px) {
	#groupform .header img.logo-groups {
		display: none;
	}
}