@charset "UTF-8";

/* Mobile: seitlicher Abstand fuer Content-Kacheln (Quiz, Studien, FAQ, Blog, …).
   Gegen .container { padding: 5px } in custom.css — !important + #main-content / main.
   2rem ≈ 32px: genug Luft zum Displayrand auf schmalen Handys. */

@media (max-width: 767.98px) {
	#main-content [class*="file-"] > .container,
	#main-content .container[class*="file-"],
	main [class*="file-"] > .container,
	main .container[class*="file-"] {
		padding-left: max(2rem, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(2rem, env(safe-area-inset-right, 0px)) !important;
	}

	#main-content [class*="file-"] > .container .row,
	#main-content .container[class*="file-"] .row,
	main [class*="file-"] > .container .row,
	main .container[class*="file-"] .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	#main-content [class*="file-"] > .container .row > [class*="col-"],
	#main-content .container[class*="file-"] .row > [class*="col-"],
	#main-content [class*="file-"] > .container .blog-item,
	#main-content .container[class*="file-"] .blog-item,
	main [class*="file-"] > .container .row > [class*="col-"],
	main .container[class*="file-"] .row > [class*="col-"],
	main [class*="file-"] > .container .blog-item,
	main .container[class*="file-"] .blog-item {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#main-content .file-gewinnspiel .gs-shell,
	#main-content .file-newsletter .gs-shell,
	main .file-gewinnspiel .gs-shell,
	main .file-newsletter .gs-shell {
		padding-left: max(2rem, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(2rem, env(safe-area-inset-right, 0px)) !important;
	}

	#main-content .suche-page.container,
	main .suche-page.container {
		padding-left: max(2rem, env(safe-area-inset-left, 0px)) !important;
		padding-right: max(2rem, env(safe-area-inset-right, 0px)) !important;
	}
}