h1 {
	text-align: left;
	font-size: var(--bigger); 
}
h2 {
	text-align: left;
	font-size: var(--smaller);
}
.big {
	font-size: var(--biggest);
	font-weight: 900;
	padding: 0px 3px 0px 3px;
}
#bloginhalt {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}





.day {
	clear: both;
	display: none;
	margin-bottom: 40px;
	
}

.daycontent {
	display: flex;
	flex-wrap: wrap;
}


.bildContainer {
	order: 1;
	flex-grow: 2;
	display: flex; /* if this is a flex container */
    
    /* flex-grow: 0; prevent it from growing to match textContainer */
    align-self: flex-start; /* make sure it aligns with the content */
    height: auto; /* ensure the height adjusts to the content */
    overflow: visible; /* optional: ensures content isn't cut off */
	
}
.textContainer {
	order: 2;
	
}

.bildContainer img {
	
	object-fit: contain;
}
.bildContainer figcaption {
	font-size: var(--smaller);
	text-align: left;
}

.bildContainer:empty {
    display: none; /* Collapse bildContainer when it's empty */
}
/* When bildContainer is hidden, center the textContainer */
.daycontent:has(.bildContainer:empty) {
    justify-content: center; /* Center the textContainer if bildContainer is empty */
}

img:hover {
	cursor: pointer;
}