:root {
  --groen:#667166;
  --middengroen:#87c381;
  --lichtgroen:#e6ece3;
  --felroze:#e7805c;
  --donkerroze:#f1b49f;
  --roze:#f7dad0;
  --middenroze:#eadbcc;
  --lichtroze:#fdf7f2;
 }

.dancing{font-family:Dancing Script;}
.nunito{font-family:Nunito Sans;}
.garamond{font-family:Comorant Garamond;}

.groen{color:var(--groen)!important;}
.middengroen{color:var(--middengroen)!important;}
.lichtgroen{color:var(--lichtgroen)!important;}
.felroze{color:var(--felroze)!important;}
.donkerroze{color:var(--donkerroze)!important;}
.roze{color:var(--roze)!important;}
.middenroze{color:var(--middenroze)!important;}
.lichtroze{color:var(--lichtroze)!important;}

.agroen{background-color:var(--groen)!important;color:#ffffff!important;}
.amiddengroen{background-color:var(--middengroen)!important;color:#ffffff!important;}
.alichtgroen{background-color:var(--lichtgroen)!important;}
.adonkerroze{background-color:var(--donkerroze)!important;color:#ffffff!important;}
.afelroze{background-color:var(--felroze)!important;color:#ffffff!important;}
.aroze{background-color:var(--roze)!important;}
.amiddenroze{background-color:var(--middenroze)!important;}
.alichtroze{background-color:var(--lichtroze)!important;}


	.kleur-t1{color:#003102;}
	.kleur-t2{color:#cc9736;}
	.kleur-a1{background-color:#003102;}
	.kleur-a2{background-color:#f42838;}
	.geenpadding{padding:0px;}
	.schaduw{box-shadow: 2px 2px 5px black;}
	body,html{font-family:Nunito Sans;background-color:var(--lichtroze)!important;overflow-y: scroll;font-size: 18px; font-family:Nunito Sans;scroll-behavior: smooth;}
@media (orientation: landscape) {
	body {
    background-image: url('jpg/zmm-13.webp');
    background-size: cover;          /* Zorgt dat de afbeelding het hele scherm vult */
    background-position: center;     /* Centreert de afbeelding */
    background-repeat: no-repeat;    /* Voorkomt dat de afbeelding gaat herhalen */
    background-attachment: fixed;    /* De achtergrond blijft staan terwijl je scrollt */
}
}
@media (orientation: portrait) {
	body {
    background-image: url('jpg/zmm-13p.webp');
    background-size: cover;          /* Zorgt dat de afbeelding het hele scherm vult */
    background-position: center;     /* Centreert de afbeelding */
    background-repeat: no-repeat;    /* Voorkomt dat de afbeelding gaat herhalen */
    background-attachment: fixed;    /* De achtergrond blijft staan terwijl je scrollt */
}
}
h1,h2,h3,h4,h5{font-family:Cormorant Garamond;color:var(--groen);font-weight:bold;}
	h1{font-size: 28px;font-size: 1.555rem;}
	h2{font-size: 24px;font-size: 1.333rem;}
	h3{font-size: 20px;font-size: 1.111rem;}
	h4{font-size: 18px;font-size: 1rem;}
	h5 {font-size:16px;font-size: 0.888rem;}
	a,a:active,a:visited {text-decoration:none;}
	p,ul,li,button {font-family:Nunito Sans;font-size:18px;font-size: 1rem;color:var(--groen);}
	img{box-shadow: 3px 3px 5px #cccccc;border-radius:6px;}
	.main{padding:0; margin:auto;position:relative;width:95%;max-width:1400px;display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-flex-flow:row wrap;-ms-flex-flow:row wrap;justify-content:space-around;flex-flow:row wrap;}
	.meen{border-radius:6px;padding:20px; margin:auto;width:95%;max-width:1400px;}
	.geen{box-shadow: 0px 0px 0px transparent;border-radius:0px;}fieldset{border:0px;}
	.inpoet{font-size:16px;font-size:1rem;width:100%;}
	.inpoettekst{font-size:16px;font-size:1rem;color:#003300;font-weight:bold;}
	.knop{background-color:transparent;border-style:solid;border-width:1px;border-color:#f8ddae;color:#f8ddae;width:240px;}
	.knop2{background-color:#325a34;border-style:solid;border-width:1px;border-color:#cc9736;color:#cc9736;}
	@media only screen and (max-width: 600px){
	    .letters{font-size:28px;font-family:Arial}
		.ruimte{padding:12px;}
		.ruimtel{margin-left:20px;}
		.ruimter{margin-right:20px;}
		.hf-500{display:block;}
		.hf-1000{display:none;}
		.hf-2000{display:none;}
	.menubalk{text-align:center;width: auto;}
	.mainitem {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:5px;margin-top:5px;}
	.mainitem111 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:10px;}
.mainitem221 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:5px;margin-top:5px;}
.mainitem321 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:5px;margin-top:5px;}
.mainitem331 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:5px;margin-top:5px;}
.mainitem422 {max-width:246px;-webkit-flex-basis: 48%;-ms-flex-basis:48%;flex-basis:48%;margin-bottom:15px;margin-top:15px;}
.mainitem631 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:5px;margin-top:5px;}
	}
	@media only screen and (min-width:601px) and (max-width:1200px){
	    .letters{font-size:50px;font-family:Schoolbell,Arial}
		.ruimte{padding:12px;}
		.ruimtel{margin-left:30px;}
		.ruimter{margin-right:30px;}
		.nietklein{display:block;}
		.hf-500{display:none;}
		.hf-1000{display:block;}
		.hf-2000{display:none;}
	.menubalk{float: right;text-align: right;width: auto;}
	.mainitem {-webkit-flex-basis:98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:15px ;margin-top:15px;}
	.mainitem111 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:15px;}
.mainitem221 {-webkit-flex-basis:48%;-ms-flex-basis:48%;flex-basis:48%;margin-bottom:10px ;margin-top:10px;}
.mainitem321 {-webkit-flex-basis:48%;-ms-flex-basis:48%;flex-basis:48%;margin-bottom:10px ;margin-top:10px;}
.mainitem331 {-webkit-flex-basis:30%;-ms-flex-basis:30%;flex-basis:30%;margin-bottom:10px ;margin-top:10px;}
.mainitem422 {max-width:246px;-webkit-flex-basis:24%;-ms-flex-basis:24%;flex-basis:24%;margin-bottom:25px ;margin-top:25px;}
.mainitem631 {-webkit-flex-basis:33%;-ms-flex-basis:33%;flex-basis:33%;margin-bottom:10px ;margin-top:10px;}
	}

	@media only screen and (min-width:1201px){
	    .letters{font-size:50px;font-family:Schoolbell,Arial}
		.ruimte{padding:12px;}
		.ruimtel{margin-left:30px;}
		.ruimter{margin-right:30px;}
		.nietklein{display:block;}
		.hf-500{display:none;}
		.hf-1000{display:none;}
		.hf-2000{display:block;}
		.menubalk{float: right;text-align: right;width: auto;}
	.mainitem {-webkit-flex-basis:98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:15px ;margin-top:15px;}
	.mainitem111 {-webkit-flex-basis: 98%;-ms-flex-basis:98%;flex-basis:98%;margin-bottom:15px;}
.mainitem221 {-webkit-flex-basis:48%;-ms-flex-basis:48%;flex-basis:48%;margin-bottom:10px ;margin-top:10px;}
.mainitem321 {-webkit-flex-basis:30%;-ms-flex-basis:30%;flex-basis:30%;margin-bottom:10px ;margin-top:10px;}
.mainitem331 {-webkit-flex-basis:30%;-ms-flex-basis:30%;flex-basis:30%;margin-bottom:10px ;margin-top:10px;}
.mainitem422 {max-width:246px;-webkit-flex-basis:24%;-ms-flex-basis:24%;flex-basis:24%;margin-bottom:25px ;margin-top:25px;}
.mainitem631 {-webkit-flex-basis:33%;-ms-flex-basis:33%;flex-basis:33%;margin-bottom:10px ;margin-top:10px;}
	}

.diff{
margin:auto;
width:100%;
max-width:500px;
}

#return-to-top {padding:0px;z-index:9999;position: fixed;bottom: 20px;right: 20px;background: rgb(241,180,159);background: rgba(241,180,159,0.9);width: 50px;    height: 50px;display: block;text-decoration: none;-webkit-border-radius: 35px;-moz-border-radius: 35px;border-radius: 35px;display: none;-webkit-transition: all 0.3s linear;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
#return-to-top i {padding:0px;color: var(--lichtgroen);margin: 0;position: relative;left: 13px;top: 13px;font-size: 19px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;
}
#return-to-top:hover {background: rgb(230,236,227);background: rgba(230,236,227, 0.9);}
#return-to-top:hover i {color: var(--donkerroze);top: 5px;}

.rij{
margin-top:10px;
}

@media only screen and (max-width: 600px){
.rij{
margin-top:5px;
}
}

.rij:nth-child(odd) {
      background: rgba(0, 0, 0, 0.02);
}
.rij:nth-child(even) {
      background: rgba(0, 0, 0, 0.04);
}
.tekst{
      text-align:right;
}
@media only screen and (max-width: 600px){
.tekst{
      text-align:center;
}
}
.invoer{
      text-align:left;
}
@media only screen and (max-width: 600px){
.invoer{
      text-align:center;
}
}
hr{
  border-top: 3px solid var(--donkerroze);
}
.lijntje{
  border-top: 1px solid var(--donkerroze);
}

.lijn-container {
    display: flex;
    align-items: center; /* Zorgt dat de lijnen en afbeelding verticaal uitlijnen */
    gap: 2%; /* De afstand tussen de lijnen en de afbeelding */
    width: 95%;
    margin:0;
}

.lijn-container hr {
    flex-grow: 1; /* Zorgt dat de lijnen de overige ruimte opvullen */
    border: none;
    border-top: 2px solid var(--donkerroze); /* Dikte en kleur van de lijn */
    margin-bottom: 10;
    max-width:45%;
}

.lijn-container img {
    display: block;
}