/** item/evenement pagina **/
main { padding-bottom:7rem; }

.itembox {
width:100%;
height:auto;
background-color:transparent;
margin:0;
padding:0 0 1rem 0;
display:flex;
align-items:flex-start;
align-content:flex-end;
justify-content:space-between;
gap:2rem;
	@media screen and (max-width:900px) { display:block; }
}
.itemlijst {
}

.itemfilesbox {
position:relative;
width:auto;
max-width:33%;
height:auto;
margin:0.5rem 0 0 0;
flex:1 1 0;
	@media screen and (max-width:900px) {
	width:100%;
	max-width:100%;
	margin:0 0 1rem 0;
	}
}

.itemfilesbox .filesbox {
position:relative;
width:100%;
height:auto;
margin:0 0 1rem 0;
display:flex;
flex-direction:column;
gap:1rem;
	@media screen and (max-width:900px) {
	flex-direction:row;
	flex-wrap:wrap;
	align-items:stretch;
	align-content:flex-start;
	justify-content:space-between;
	gap:0.5rem;
	}
}
.itemfilesbox .filesbox {
flex-direction:row;
}

.itemfilesbox .filesbox .filebox {
width:100%;
height:auto;
margin:0;
display:block;
overflow:hidden;
	@media screen and (max-width:900px) { width:calc(50% - 0.25rem); }
}

.itemfilesbox .filesbox .filebox:first-child {
	@media screen and (max-width:900px) { width:100%; }
}
.itemfilesbox .filesbox .filebox img {
object-fit:cover;
transition:all .5s ease 0s;
display:block;
	@media screen and (max-width:900px) { height:10rem; }
}
.itemfilesbox .filesbox .filebox img:hover {
transform:scale(1.05);
}
.itemfilesbox .filesbox .filebox:first-child img {
	@media screen and (max-width:900px) { height:auto; }
}

.iteminfobox {
position:relative;
width:auto;
height:auto;
flex:1 1 0;
	@media screen and (max-width:900px) { width:100%; }
}

.itemkopbox {
width:100%;
height:auto;
}
.itemkopbox h1 {
width:100%;
height:auto;
overflow:hidden;
}

.itemkopbox h2 {
width:100%;
height:auto;
overflow:hidden;
}

.databox {
width:100%;
height:auto;
margin:1rem 0 0 0;
background-color:transparent;
display:flex;
gap:0;
	@media screen and (max-width:900px) {
	flex-wrap:wrap-reverse;
	margin:0;
	}
}

.itemtext {
width:55%;
height:auto;
text-align:left;
margin-right:5%;
	@media screen and (max-width:900px) {
	width:100%;
	padding-top:1rem;
	margin:0;
	}
}

.datum-bestel {
width:40%;
height:auto;
text-align:left;
	@media screen and (max-width:900px) {
	width:100%;
	padding-bottom:1rem;
	}
}

.prijzen-info {
font-size:1.5em;
margin:0;
}
.prijzen-promotie {
font-size:1.25em;
margin:0;
}

.varianten {
position:relative;
width:100%;
height:auto;
margin-bottom:1rem;
display:block;
}
.variant {
position:relative;
width:100%;
height:auto;
font-size:1em;
padding:0.5rem 1rem;
margin:1rem 0 0 0;
border:1px solid var(--mainbordercolor);
border-radius:6px;
}
.variant:hover, .variantselect {
color:var(--maincolorhover);
}
.halftransparant {
opacity:0.5;
}
.uitverkocht {
}
.variantitel {
line-height:1.5;
margin:0 0 0.5rem 0;
display:flex;
align-items:baseline;
flex-wrap:wrap;
gap:0 1ch;
}
.variantitel p {
margin-bottom:0;
}
.variantitel .titel {
font-size:1.3em;
}
.variantitel .datum {
font-size:1.3em;
}
.variantitel .locatie {
font-size:1.3em;
}
.variantitel .info {
font-size:1em;
text-align:left;
}

.prijs {
font-size:1.5em;
}
.info-gewicht {
display:none;
}
.uitverkocht {
font-size:0.8em;
text-align:right;
}

.select-aantal {
margin-top:0.75rem;
}

/** item associaties info pagina **/
.assosbox {
position:relative;
width:100%;
height:auto;
margin:1rem 0;
display:grid;
grid-template-columns:auto auto auto auto auto;
gap:1rem;
	@media screen and (max-width:900px) { grid-template-columns:auto auto; }
}

.asso-item {
position:relative;
width:auto;
height:300px;
text-align:center;
line-height:1.3;
overflow:hidden;
}

.asso-foto {
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
width:auto;
height:60%;
background:rgb(255 255 255 / .2);
background-repeat:no-repeat;
background-position:center top;
background-size:100% auto;
transition:all .3s ease 0s;
overflow:hidden;
}
.asso-item:hover .asso-foto {
background-size:110% auto;
}

.asso-tekst {
position:absolute;
bottom:0;
left:0;
right:0;
width:100%;
height:auto;
min-height:40%;
margin:0.5rem auto 0 auto;
z-index:1;
}
.asso-tekst h1 {
width:90%;
height:auto;
min-height:2.5em;
font-size:1.2em;
margin:0.5em auto;
}
.asso-tekst h2 {
width:100%;
height:auto;
min-height:2.5em;
font-size:1em;
margin:0 0 0.5rem 0;
}
.asso-prijs {
width:auto;
height:auto;
font-size:1.5em;
}