.profileImage{
	--size: 40px;
	height: var(--size);
	width: var(--size);
	background-size:cover;
	background-position:center;
	position: relative;
	border-radius: 50%;
}
.profileImage span{
	height:20px;
	position:absolute;
	font-size: 12px;
	top:100%;
	left:0;
	right:0;
	text-align:center;
	color:var(--themeTextDark);
}
.profileImage.hasName{
	margin-bottom:20px;
}

.accountItemHolder{
	margin: 0px auto;
	width:100%;
	max-width:1000px;
}

.gridItemHolder.accountItemHolder{
    --columns: 1;
	--gap: 10px 20px;
}

table.gegevensView{
	width:100%;
	margin:0;
}
table.gegevensView tr.head{
	/* border-bottom: 2px solid #c9c9c9 !important; */
	background-color:rgba(35, 67, 128, 0.6) !important;	
}
table.gegevensView tr:not(.head) td{
	font-size:13px;
}

table.gegevensView tr td:first-of-type{
    width: 180px !important;
}
table.gegevensView tr td:last-of-type .button{	
    float: right;
}

.window .incassoMail:not(.shown),
.window .normalMail:not(.shown){
	display:none;
}
.window label{
	font-weight:bold;
}
.window label input,
.window label select,
.window label textarea{
	font-weight:normal;	
	margin-top:4px;
}
.window tr.options b{
	font-style:italic;
	padding-right:10px;
}
.window tr.options:last-of-type{
	margin-bottom:10px;
}

.loginItemHolder{
	max-height:200px;
	overflow:auto;
}
.loginItem{
	font-weight:lighter;
    padding: 5px !important;
}
.loginItem b{
	margin-right:15px;
}

.passwordBar{
    margin-top: 20px;
    width: 100%;
    height: 18px;
    border-radius: 9px;
	background-color:#eee;
}
.passwordBar .passwordIndicator{
	position:relative;
	border-radius:9px;
	height:100%;
	width:0%;
	background-color:#ddd;
	transition: all .2s ease-in-out;
}
.passwordBar .passwordIndicator .notify{
	position:Absolute;
	bottom:-20px;
	height:18px;
	width:auto;
	text-align:center;
	color:#000;
	font-size:11px;
}

.account #pageForm hr{
	border-color: var(--themeColorBackgroundTint);
}

.passwordBar{
    margin: 0 0 15px;
    width: 100%;
    height: 18px;
    border-radius: 9px;
    background-color:#eee;
}
.passwordBar .passwordIndicator{
	position:relative;
	border-radius:9px;
	height:100%;
	width:0%;
	background-color:#ddd;
	transition: all .2s ease-in-out;
}
.passwordBar .passwordIndicator .notify{
	position:Absolute;
	bottom:-20px;
	height:18px;
	width:auto;
	text-align:center;
	color:#000;
	font-size:11px;
}

.optiesItemHolder,
.reserveringenItemHolder,
.voertuigenItemHolder{
	--columns: 1;
	background-color: rgb(252,252,252);
}
.reserveringenItemHolder .gridItem .gridItem-image,
.voertuigenItemHolder .gridItem .gridItem-image{
	gap:15px;
}
.gridItemHolder .gridItem .gridItem-image > div{
	max-width: calc(100% - 110px);
}
.gridItemHolder .gridItem .gridItem-image div.imageHolder{
	height: 70px;
	width:auto !important;
	aspect-ratio:4/3;
	flex: none;
    border-radius: 6px;
}

.reserveringenItemHolder .gridItemHeader span:first-of-type,
.voertuigenItemHolder .gridItemHeader span:first-of-type{
	flex: inherit;
	width: calc(33% + 55px);
}

.reserveringenItemHolder .gridItem-image .gridItem-subImage{
	display:flex;
	gap:10px;
}
.reserveringenItemHolder .gridItem-image .gridItem-name{
	display:flex;
    align-items: center;
}
.reserveringenItemHolder .gridItem-image img.mainImage{
	height: auto;
    width: auto;
    max-height: 67px;
    max-width: 90px;
    border-radius: 6px;
}
.reserveringenItemHolder .gridItemHeader.verhuur{
	gap: 15px;
}
.optiesItemHolder .gridItemHeader span,
.reserveringenItemHolder .gridItemHeader.verhuur span,
.reserveringenItemHolder .reserveringItem.verhuur .gridItem-sub{
	width: 20%;
}

.optiesItemHolder .gridItemHeader span:first-of-type{
	width: 50%;
	max-width: inherit;
	flex: none;
}
.reserveringenItemHolder .gridItemHeader.verhuur span:first-of-type,
.reserveringenItemHolder .reserveringItem.verhuur .gridItem-sub:first-of-type{
	width: 30%;
	max-width: inherit;
	flex: none;
}

.gridItemHolder .gridItem h2 {
    margin: 0;
    font-size: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

body .optiesItemHolder .optieItem,
body .reserveringenItemHolder .reserveringItem,
body .voertuigenItemHolder .voertuigItem{
	border-bottom: 1px solid var(--themeTextLightGrey3)!important;
	border-radius: 0;
}

.optiesItemHolder .gridItem:hover,
.reserveringenItemHolder .gridItem:hover,
.voertuigenItemHolder .gridItem:hover{
	background-color: rgb(243 243 243 / 57%);
	border-radius: 7px;
}
.optiesItemHolder .gridItem:hover .optieItem,
.reserveringenItemHolder .gridItem:hover .reserveringItem,
.voertuigenItemHolder .gridItem:hover .voertuigItem{
	border-color: transparent !important;
}
.optiesItemHolder .gridItem .gridItem-image > div{	
	max-width:100%;
}
.optiesItemHolder .gridItem-sub{	
	width: 50% !important;
	max-width: inherit;
	flex: none;
}

span.accountVerified {
    display: inline-flex;
    height: 30px;
    gap: 6px;
    justify-content: flex-start;
    flex-direction: row;
    align-items: center;
    color: #475467;
}

span.accountVerified svg{
    height:20px;
    width: 20px;
}

.gridItem-sub.vertical{
	flex-direction: column !important;
}

@media (max-width: 1024px){
	table.gegevensView tr.head{
		font-size:13px;
	}
}
@media (max-width: 880px){
	.gridItemHolder.accountItemHolder {
		--columns: 1;
		--gap: 10px 14px;
	}

	#pageForm h2 {
		margin: 0;
		font-size:18px;
	}
	hr{
		margin:15px 0;
	}


	.infoBoxHolder{
		padding:0;
	}
}