/***********************************************************

 * REKEN

 **********************************************************/

.content-rekentool {

	font-size: 15px;

}

.content-rekentool .entry-form {

	border: none;

}

.rekentool form>div,

.rekentool input[type="submit"] {

	width: 32%;

	float: left;

}

.rekentool form .rekentool-aantalKlassen,

.rekentool form .rekentool-akkoordPrivacy,

.rekentool form .rekentool-naamSchool,

.rekentool input[type="submit"] {

	margin-left: 2%;

	margin-right: 2%;

}

.rekentool form .rekentool-aantalLeerlingenKeuze,

.rekentool form .rekentool-aantalKlassen,

.rekentool form .rekentool-hoeVaakWT {

	border: 3px solid var(--mot-color);

	box-sizing: border-box;

	padding: 2%;

	min-height: 337px;

	transition: background-color .8s ease;

	background-size: 160px;

    background-repeat: no-repeat;

    background-position: bottom right;

	margin-bottom: 32px;

}

.rekentool-aantalLeerlingenKeuze {

	background-image: url(../afb/leerlingen.svg);

}

.rekentool-aantalLeerlingenKeuze label {

	line-height: 36px;

	padding-left: 36px;

}

.rekentool-aantalKlassen {

	background-image: url(../afb/klas.svg); 

}

.rekentool input#aantalKlassen {

	max-width: 140px;

	min-width: 50%;

	margin: auto;

	font-size: 16px;

}

.rekentool-hoeVaakWT {

	background-image: url(../afb/w-t-planning.svg)

}

/*.rekentool-stuurEmail {

	background: var(--mot-color);

	padding: 5px;

	font-weight: bold;

}

.rekentool form>.rekentool-stuurEmail {

	min-width: 50%;

}

.rekentool-stuurEmail input {

	width: 0;

	margin: 0 -5px 0 0;

}*/

.rekentool-stuurEmail label {

	cursor: pointer;

}

.rekentool-stuurEmail,

.rekentool input[type="submit"] {

	margin-bottom: 10px;

}

.rekentool input[type="submit"] {

	font-size: 18px;

	display: block;

}

.rekentool input[type="submit"]:hover {

	background-color: var(--mot-color);

	color: var(--mot-black);

	transition: .8s ease;

}

.rekentool [class*="-instr"] {

	font-weight: bold;

	min-height: 65px;

	margin-bottom: 12px;

}

.rekentool label[for="aantalKlassen"] {

	display: none;

}

.rekentool form label span {

	background: var(--mot-white)AF;

	transition: background .6s ease;

	transition-delay: .1s;

}

.rekentool-aantalLeerlingenKeuze:hover,

.rekentool-aantalKlassen:hover,

.rekentool-hoeVaakWT:hover {

	background: var(--mot-color);

}

.rekentool-aantalLeerlingenKeuze:hover span,

.rekentool-aantalKlassen:hover span,

.rekentool-hoeVaakWT:hover span {

	background: var(--mot-color);

}

.rekentool-akkoordPrivacy,

.rekentool-eMailadres,

.rekentool-naamContactpersoon,

.rekentool-naamSchool,

.rekentool-plaatsSchool {

	overflow: hidden;

	height: 0;

	transition: 1s ease;

}	

.rekentool input[type="submit"] {

	transition-delay: .9s;

	transition: .1s ease;

}

.berekening-overzicht {

	max-width: 900px;

	margin: 0 auto;

	display: table;

	padding: 0;

}

.berekening-overzicht li {

	display: block;

	float: left;

	width: 45%;

	margin: 0 2.5%;

	border: 3px solid var(--mot-color);

	box-sizing: border-box;

	padding: 10px;

}

.berekening-overzicht-mot {

	background: var(--mot-color);

}

.berekening-form .entry-form-rekentool {

	padding :0

}

.berekening-form .rekentool input[type="submit"] {

	display: none;

}

.content-rekentool h3 {

	margin-bottom: 0;

	margin-top: 32px;

}

.berekening-blok,

.berekening-blok~*:not(.berekening-doorsturen):not(.berekening-form):not(.berekening-outro):not(.berekening-verder) {

	border-left: 8px solid var(--mot-color);

}

.berekening-blok,

.berekening-blok~:not(ul):not(.berekening-doorsturen):not(.berekening-form):not(.berekening-outro):not(.berekening-verder) {

	padding-left: 10px;

}

.berekening-blok~ul {

	margin: 0;

	padding-top: 1em;

    padding-bottom: 1em;

}

.berekening-lees-meer,

.berekening-lees-meer-tekst,

.berekening-lees-meer-lijst {

	font-size: 0;

	transition: .2s ease;

}

.berekening-lees-meer h5 {

	font-size: 16px;

	color: var(--mot-color);

	margin: 0;

	padding: 16px 8px;

}

.berekening-verder {

	margin-top: 48px;

}

.berekening-doorsturen {

	margin-top: 16px;

	width: 50%;

	border:3px solid var(--mot-color);

	padding: 5px;

	box-sizing: border-box;

}

.berekening-doorsturen a {

	color: var(--mot-black);

}

.berekening-doorsturen+.berekening-doorsturen+.berekening-doorsturen{

	background: var(--mot-color);

}



.sidebar-berekening-contact .entry-form-contact {

	/*position: fixed;*/

}

/***********************************************************

 * REKEN - MOBILE

 **********************************************************/

@media screen and (max-width: 840px) {

	.sidebar {

		margin-top: 36px;

	}

}

@media screen and (max-width: 800px) {

	/*.rekentool-aantalLeerlingenKeuze,

	.rekentool-aantalKlassen,

	.rekentool-hoeVaakWT {

		width: 49%;

	}

	.rekentool-aantalKlassen {

		margin-right: 0;

	}

	.rekentool-hoeVaakWT {

		margin-top: 12px;

	}

	*/

	.rekentool form .rekentool-aantalLeerlingenKeuze,

	.rekentool form .rekentool-aantalKlassen,

	.rekentool form .rekentool-hoeVaakWT {

		margin-bottom: 10px;

	}

	.rekentool form>div,

	.rekentool input[type="submit"]{

		width: 49%;

		margin-right: 0;

		margin-left: 2%;

	}

	.berekening-form .rekentool form>div {

		width: 48%;

	}

	.rekentool form .rekentool-aantalLeerlingenKeuze,

	.rekentool form .rekentool-hoeVaakWT {

		margin-left: 0;

	}

	.rekentool form .rekentool-aantalKlassen,

	.rekentool form .rekentool-akkoordPrivacy,

	.rekentool form .rekentool-naamSchool {

		margin-right: unset;

	}

}

@media screen and (max-width: 640px) {

	.rekentool form .rekentool-hoeVaakWT {

		margin-bottom: 30px;

	}

	.rekentool form .rekentool-naamSchool,

	.rekentool form .rekentool-plaatsSchool,

	.rekentool form input[type="submit"] {

		float: right;

	}

	.berekening-form .rekentool form .rekentool-naamSchool,

	.berekening-form .rekentool form .rekentool-plaatsSchool {

		float: left;

	}

}

@media screen and (max-width: 500px) {

	.rekentool form>div,

	.rekentool input[type="submit"],

	.berekening-form .rekentool form>div {

		width: 100%;

		margin-left: 0;

		margin-right: 0;

	}

	.rekentool form>div:nth-child(3n-2) {

		margin-left: unset;

		margin-right: unset;

	}

	.berekening-doorsturen {

		width: 100%;

	}

	.berekening-overzicht li {

		width: 100%;

		margin: 6px 0;

	}

}