/* KLANT LOGIN */
.klantlogin {
position:relative;
width:auto;
height:auto;
padding-top:4rem;
padding-bottom:1rem;
background-color:var(--mainbgcolor);
background-image:var(--mainbgimage);
}

.klantmenu {
position:sticky;
top:4rem;
font-size:1em;
list-style-type:none;
list-style-position:inside;
background-color:var(--mainbgcolor);
display:flex;
flex-direction:row;
align-items:center;
justify-content:flex-start;
gap:0.5rem;
	@media screen and (max-width:900px) {
	font-size:0.8em;
	margin-bottom:2rem;
	justify-content:space-between;
	gap:0;
	}
}
.klantmenu .menu-item {
position:relative;
color:var(--navitemcolor);
text-align:center;
text-shadow:none;
line-height:2.5;
white-space:nowrap;
margin:0;
}
.klantmenu .menu-item:first-child {
margin-left:auto;
	@media screen and (max-width:900px) { margin-left:0; }
}
.klantmenu .menu-item:before {
content:'';
}
.klantmenu a.menu-itemlink, .klantmenu .menu-itemlink {
position:relative;
color:var(--navitemcolor);
text-align:center;
text-shadow:none;
line-height:2.5;
white-space:nowrap;
text-decoration:none !important;
padding:0 1.5rem;
background-color:var(--navitembgcolor);
background-image:var(--navitembgimage);
display:block;
}
.klantmenu a.menu-itemlink:hover, .klantmenu .menu-itemlink:hover {
color:var(--navitemcolorhover);
background-color:var(--navitembgcolorhover);
background-image:var(--navitembgimagehover);
text-decoration:none !important;
}
.klantmenu a.on, .klantmenu .on {
color:var(--navitemcolorhover);
background-color:var(--navitembgcolorhover);
}

.klantlogin .loginemail {
width:30%;
display:inline-block;
	@media screen and (max-width:900px) { width:100%; }
}
.klantlogin .loginpw {
width:30%;
letter-spacing:1px;
margin-left:1%;
display:inline-block;
	@media screen and (max-width:900px) {
	width:calc(100% - 40px);
	margin-left:0;
	}
}
.klantlogin .loginbutton {
width:auto;
margin-left:1%;
display:inline-block;
float:none;
	@media screen and (max-width:900px) {
	width:100%;
	margin:0.5em 0;
	}
}
.klantlogin .loginbutton:hover {
}

#showpassword, #shownewpassword {
display:none;
}
.showpasswordlabel {
position:relative;
top:10px;
left:5px;
width:30px;
height:30px;
margin-right:10px;
background-image:url('../../graphics/show.png');
background-position:center 0;
background-size:auto 100%;
background-repeat:no-repeat;
display:inline-block;
}
.showpasswordlabel-on {
position:relative;
top:10px;
left:5px;
width:30px;
height:30px;
margin-right:10px;
background-image:url('../../graphics/show-on.png');
background-position:center 0;
background-size:auto 100%;
background-repeat:no-repeat;
display:inline-block;
}

.klantlogin-bestelling {
width:100%;
height:auto;
margin:1rem 0;
border:none;
}

.klantlogin-bestelling table {
width:100%;
height:auto;
margin:0;
border:none;
}
.klantlogin-bestelling th {
font-size:0.9em;
font-weight:400;
text-align:right;
opacity:0.5;
}