/* Mobile Category Button (Menu)*/

.header__burger {
	margin: 0;
	margin-bottom: 1rem;
	color: #808080;

	display: none;

}

.archive .header__burger,
.home .header__burger {
	display: block;
}


.menu-mobile {
	display: none;
	position: fixed;
	height: 100vh;
	width: 100%;
	background: #f5f5f5d6;
	top: 0;
	left: 0;
	z-index: 999;
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);

}

.header--open-menu .menu-mobile {
	display: block;
}


.term-liste-mobile {
	all: unset;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;

	font-size: 36px;
	height: 100vh;
}

.term-liste-mobile a {
	padding: 6px;
	display: block;
	color: #808080;

}

.term-liste-mobile__item {
	all: unset;
}


@media (max-width: 850px) {


	.mobile {
		display: block!important;
	}

	.desktop {
		display: none!important;
	}

	.desktop-only {
		display: none!important;
		pointer-events: none;
	}

	.mobile-only {
		display: block;
	}

	.post--no-mobile-content {
		display: none !important;
	}

	.project-media {
		height: auto !important;
	}

	.project-media::before {
		display: none;
	}

	.project-media .slideshow-mobile {
		height: auto;
	}

	.header {}


	.term-liste li:not(li:last-child)::after {
		all: unset;
	}


	.header__seitentitel {
		margin-bottom: 0.5rem;
	}

	.single .header__seitentitel {
		margin-bottom: 0;
	}

	.header {
		padding: 10px;

	}

	.header__nav {
		display: block;
	}

	.term-liste--mobile {
		text-align: center;
		width: 100%;
		font-size: 25px;
	}

	.single .term-liste--mobile {
		display: none
	}

	footer {
		margin: 10px;
		display: block;
	}

	.footer__btn {
		display: block;
	}

	.mobile footer .header__burger {
		width: 100%;
	}

	.footer__mail {
		width: 100%;
		margin-bottom: 1rem;
	}

	.footer__tel {
		width: 100%;
		margin-bottom: 1rem;
	}

	.home footer .load-more-posts {
		width: 100%;
	}


	.header__flip {
		display: none;
	}

	.header {
		padding-bottom: 0;
	}

	.posts {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
		margin-top: 0.5rem;
		margin-left: 10px;
		margin-right: 10px;
	}

	.post {
		width: 100%;
		margin-bottom: 1rem;
	}

	.post .image {
		height: auto;
	}

	.post.hoch {
		width: 100%;
	}


	.post img {
		border-radius: 0;
		outline: 0;
		-webkit-filter: inherit !important;
		filter: inherit !important;
		width: 101%;
	}


	.post.hoch .image {
		height: 63vw;

	}

	.text-thumbnail {
		height: 63vw;
		font-size: 27px;

	}

	.slideshow-mobile .swiper-slide {
		height: auto !important;
		overflow: hidden;
	}

	.slideshow-mobile img {
		display: block;
		width: 100%;
		height: auto;
	}


	/* Links zu Kategorien im Titel deaktivieren */
	.post__terms a {
		pointer-events: none;
	}


	/* single */

	.zuruck-btn a {
		padding-top: 7px;
		padding-right: 8px;
	}

	.detail-bild-caption,
	.detail-titel {
		margin-left: 10px;
		font-size: 16px;
		line-height: 1.2;
	}

	.detail-titel {
		color: #000;
	}

	.detailseite.bild .detail-titel {
		top: 25px;
	}

	.detail-bild-caption {
		/* Gleicht die abweichenden Schriftmetriken des mobilen H1-Titels aus. */
		top: 32px;
		color: #000;
	}

	.detail-titel h1 .mobile {
		color: #000;
		display: block !important;
		font-family: "ABCDiatypeRoundedMono-Regular", sans-serif;
		font-size: 13px;
		margin-top: 2px;
		position: static;
	}

	.slideshow-component {
		width: 100%;
		height: 100vh;
		height: 100svh;
		overflow: hidden;
	}

	/*
	 * Detailseiten-Slider mobil
	 *
	 * Die Desktop-Ausgabe richtet Bilder an der Viewport-Höhe aus. Ohne diese
	 * Begrenzungen können Hochformate auf schmalen Displays breiter als ihr
	 * Slide werden und in den nächsten Slide hineinragen.
	 */
	.slideshow-component .slideshow {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	.slideshow-component .swiper-wrapper {
		height: 100% !important;
		-webkit-box-align: stretch;
		-ms-flex-align: stretch;
		align-items: stretch;
	}

	.slideshow-component .swiper-slide {
		width: 100% !important;
		height: 100% !important;
		min-width: 100%;
		overflow: hidden;
	}

	.slideshow-component .swiper-slide > div {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		width: 100%;
		height: 100%;
		min-width: 0;
	}

	.slideshow-component img {
		display: block;
		width: auto;
		max-width: 100%;
		height: auto;
		max-height: 100%;
		margin: auto;
		-o-object-fit: contain;
		object-fit: contain;
	}

	.slideshow-component .slide--fullscreen img {
		width: 100%;
		max-width: 100%;
		height: 100%;
		max-height: 100%;
		-o-object-fit: cover;
		object-fit: cover;
	}


	.swiper-slide {
		height: auto !important;
	}

	.zwischentitel-component,
	.text-component {
		margin-left: 10px;
		margin-right: 10px;
	}


	.zwischentitel-component h3 {
		font-size: 25px;
	}

	.text-component {
		font-size: 16px;
	}

	.bild-component figure {
		max-width: calc(100% - 40px);
	}


	.detailseite.bild .content>.slideshow-component:first-child {
		margin-top: calc(0px - 2rem);
	}

	/* 	page */


	.page .content {
		padding: 0;
		margin: 10px;

		font-size: 16px;
	}
}