/* /////////////////////////////////////////////// 
RESPONSIVE
/////////////////////////////////////////////// */


/* schriftgrössen */
@media only screen and (max-width: 1560px) {
	:root {
		font-size:1.665vw;/* fallback */
		font-size:clamp(14px, 1.44vw, 21px);
	}
}

/* container bb-basis = html */

@container bb-basis (inline-size < 1560px){/* 80px + 1400px + 80px */
	.teasercontainer,
	.blogteasercontainer,
	.seitennavigation {
		width:calc(100% - 160px);
	}
	
	.fusszeile-1-txt,
	.fusszeile-2-txt {
		margin:0 auto 0 auto;
		width:calc(100% - 160px);
	}	
}


@container bb-basis (inline-size < 1390px){/* 145px + 1100px + 145px */
	.haupttitel,
	.blogbeitragkopf,
	.site-content,
	body.home .bannerbildstart .startlinks {
		width:calc(100% - 290px);
	}
}



@media only screen and (max-width: 1100px) {
	.konsole {
		padding-top:125px;
	}
	.kopfzeile {
		height:125px;
	}
	.kopfzeile a.logo {
		width:200px;
		height:65px;
		margin-left:30px;
		margin-top:30px;
	}
	.menuebutton {/* rest unten (nav) */
		top:35px;
		right:20px;
	}
	.hauptnav-mobile .navcontainer {
		width:calc(70vw - 30px);
		margin:40px 80px 0px 30vw;
	}


	.teasercontainer,
	.blogteasercontainer,
	.seitennavigation {
		width:calc(100% - 60px);
	}
	
	.teaser a {
  		font-size: clamp(1.5rem, 4vw, 2.5rem);
  		line-height:clamp(1.6rem, 4.4vw, 2.6rem);
  	}
	
	.site-content p.zitat,
	.site-content p.zitat-byline {
		padding:0px 10% 0px 10%;
	}
	

	.fusszeile-1-txt,
	.fusszeile-2-txt {
		width:calc(100% - 60px);
	}	
	.fusszeile-2 {
		padding:30px 0px calc(90px + 30px) 0px;/* hoehe fuss-1 + 20px */
	}
}



@media only screen and (max-width: 820px) {
	.haupttitel,
	.blogbeitragkopf,
	.site-content {
		width:calc(100% - (2 * 74px));
	}
	.blogteasercontainer {
		grid-template-columns:1fr 1fr;
	}
	body.home .bannerbildstart .startlinks {
		display:block;
		width:250px;
	}
	.startlinks a {
		margin-bottom:0.714rem;
	}
}


@media only screen and (max-width: 720px) {
.notfallicons {
	margin:2.85rem 10% 0rem 10%;
	width:80%;
	aspect-ratio:110 / 28;
	grid-template-columns:1fr 1fr;
	grid-column-gap:4rem;
	grid-row-gap:2rem;
}


/* kleinste */
@media only screen and (max-width: 540px) {

	.konsole {
		padding-top:110px;
	}
	.kopfzeile {
		height:110px;
	}
	.kopfzeile a.logo {
		margin-left:20px;
		margin-top:20px;
	}
	.menuebutton {/* rest unten (nav) */
		top:25px;
		right:10px;
	}
	.hauptnav-mobile .navcontainer {
		width:calc(100vw - 60px);
		margin:30px 20px 0px 20px;
	}
	.hauptnav-mobile ul li {
		padding: 0px 0px 8px 0px;
	}
	.hauptnav-mobile ul li ul li {
		padding: 0px 0px 8px 0px;
	}
	.hauptnav-mobile ul li ul li:first-of-type {
		padding: 8px 0px 8px 0px;
	}
	
	.haupttitel,
	.blogbeitragkopf,
	.site-content,
	.teasercontainer,
	.blogteasercontainer,
	.fusszeile-2-txt {
		width:calc(100% - (2 * 20px));
	}
	

	.teasercontainer {
		display:block;
	}
	.teaserwrapper {
		margin-bottom:1.428rem;/* ex row-gap */
	}
	.teaser a {
  		font-size: clamp(2rem, 7vw, 4rem);
  		line-height:clamp(2.3rem, 7.4vw, 4.4rem);
  	}
	
	.blogteasercontainer {
		display:block;
	}
	.blogteaserwrapper {
		margin-bottom:1.428rem;/* ex gap */
	}



	.fusszeile-1-txt {
		display:block;
		width:12rem;
	}
	.fusszeile-1-txt .links {
		display:none;
	}
	
	.fusszeile-1-txt .emergencybuttons {/*rest unten bei links */
		grid-column-gap:2rem;
	}

	.fusszeile-2-txt {
		width:calc(100% - (2 * 74px));
		display:grid;
		grid-template-columns:2fr 1fr 2fr;
	}
	.fusszeile-2-txt .spalte {
		padding-right:0px;
	}
	.fusszeile-2-txt .spalte-2 {
		text-align:center;
	}
	.fusszeile-2-txt .spalte-3 {
		text-align:right;
	}



}