@charset "UTF-8";

@media (min-width:576px){}
@media (min-width:768px){}
@media (min-width:992px){}
@media (min-width:1200px){}
@media (min-width:1400px){}



main, aside {
    display: flow-root;
}

main + aside {
	--bs-gutter-x: 0;
    --bs-gutter-y: 0;
	border-top:2px solid var(--border-color-light);
	padding-top:3rem;
	margin-top:3rem;
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(-.5 * var(--bs-gutter-x));
    margin-left: calc(-.5 * var(--bs-gutter-x));
}
@media (min-width:576px){
	main + aside {
		--bs-gutter-x: 1.5rem;
	}
}

main + aside > h2 + *:first-child h2{
    margin-top:2rem;
}
@media (min-width:768px){
	main + aside > section,
	main + aside > article {
		flex: 0 0 auto;
		width: 30%;
		/* max-width: 720px; */
		/*
			sm: 540px,
			md: 720px,
			lg: 960px,
			xl: 1140px
		*/
		margin: 0 1.66% 2rem 1.66%; /* 100 / 3 = 33 -> 30 width, 3.33% margin -> 3.33 / 2 -> 1.66 */
		/* flex-shrink: 0;
		flex-grow: 1; */
		padding-right: calc(var(--bs-gutter-x) * .5);
		padding-left: calc(var(--bs-gutter-x) * .5);
		margin-top: var(--bs-gutter-y);
	}
	main + aside h2{
		margin-top:0;
	}

	/* one item */
	main + aside > section:first-child:nth-last-child(1),
	main + aside > article:first-child:nth-last-child(1) {
	/* -or- li:only-child { */
		margin-left: 16.66666667%;
		width: 66.66666667%;
		margin-left: 16.66666667%;
    flex: 0 0 auto;
    width: 66.66666667%;
	}

	/* two items */
	main + aside > section:first-child:nth-last-child(2),
	main + aside > section:first-child:nth-last-child(2) ~ section,
	main + aside > article:first-child:nth-last-child(2),
	main + aside > article:first-child:nth-last-child(2) ~ article {
		width: 46%;
	}

	/* three items */
	main + aside > section:first-child:nth-last-child(3),
	main + aside > section:first-child:nth-last-child(3) ~ section,
	main + aside > article:first-child:nth-last-child(3),
	main + aside > article:first-child:nth-last-child(3) ~ article {
		width: 30%;
	}

	/* four items */
	main + aside > section:first-child:nth-last-child(4),
	main + aside > section:first-child:nth-last-child(4) ~ section,
	main + aside > article:first-child:nth-last-child(4),
	main + aside > article:first-child:nth-last-child(4) ~ article {
		width: 25%;
	}


}

.moderncss main + aside {
	display: flex;
    align-content: flex-start;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
}


/* breakout *//*
@media (min-width: 768px) {
	.text-mit-bild-inner{
	margin-left: 8.33333333%;
		flex: 0 0 auto;
		width: 83.33333333%;
	}
	.text-mit-bild {

	width: 100vw;
	position: relative;
	background-color: lightgreen;
	left: calc(-1 * (100vw - 100%) / 2);
	color: rgba(0,0,0,.6);
	}
}*/

.section-break, .section-break-dark{border-top:2px solid var(--border-color-light); padding-top: 3rem; margin-top: 3rem;}
.section-break-light{border-top:2px solid var(--border-color-light); padding-top: 3rem; margin-top: 3rem;}