@charset "UTF-8";

@media all {
	/** == Allgemein Start == **/
	main div.block {
		margin-bottom: 60px;
	}

	.block:not(.hint) img {
		border-radius: 20px;
		box-shadow: 0 3px 6px var(--cover-color);
	}

	.block .image-container {
		position: relative;
		z-index: 1;
	}
	/** == Allgemein End == **/

	/** == Header Start == **/
	.block:not(.accordion) h2,
	.block h3,
	.block h4 {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.block h2 {
		font-size: 30px;
	}

	.block h3 {
		font-size: 28px;
	}

	.block h4 {
		font-size: 25px;
	}
	/** == Header End == **/

	/** == Galerie Start == **/
	.block#gallery {
		scroll-margin-top: 250px;
	}

	.block picture:last-child {
		display: inline-block;
		margin-bottom: 20px;
	}

	.block picture + em,
	.block img + em {
		display: inline-block;
		font-size: initial;
		margin-top: 20px;
	}

	.block.gallery a.gallery-image {
		border-radius: 20px;
		display: inline-block;
		font-size: 0;
		margin-bottom: 20px;
	}

	.block.gallery .row.preview {
		margin-bottom: 20px;
	}

	.block.gallery .active img {
		border: 4px solid var(--red);
	}

	.block.gallery .preview img {
		object-fit: cover;
		height: 120px;
		width: auto;
		max-width: 100%;
	}
	/** == Galerie End == **/

	/** == Akkordeon Start == **/
	.block.accordion details {
		position: relative;
		background-color: var(--white);
		margin-bottom: 25px;
		border: 1px solid var(--border-color);
		border-radius: 20px;
		padding: 25px;
	}

	.block.accordion details:focus-within {
		outline: 2px dashed var(--red);
	}

	.block.accordion summary {
		position: relative;
		padding-left: 110px;
		list-style: none;
		color: var(--header-color);
	}

	/* Akkordeon-Pfeil im Chrome nicht anzeigen */
	.block.accordion details summary::-webkit-details-marker {
		display:none;
	}

	.block.accordion details summary:hover {
		cursor: pointer;
	}

	.block.accordion details summary:focus {
		outline: none;
	}

	.block.accordion summary::before {
		content: "";
		position: absolute;
		left: 0;
		top: calc(50% - 23px);
		width: 45px;
		height: 45px;
		background-image: url("/pub/theme/runners/skin/assets/icons/plus.svg");
	}

	.block.accordion details[open] > summary::before {
		background-image: url("/pub/theme/runners/skin/assets/icons/minus.svg");
	}

	.block.accordion summary + div {
		margin-top: 20px;
	}
	/** == Akkordeon End == **/

	/** == Hinweis Start == **/
	.block.hint {
		padding: 25px;
		border: 1px solid var(--border-color);
		border-radius: 25px;
	}

	.block.hint.yellow {
		background-color: var(--light-yellow);
	}

	.block.hint.red {
		background-color: var(--lighter-red);
	}

	.block.hint.blue {
		background-color: var(--light-blue);
	}

	.block.hint.green {
		background-color: var(--success);
	}

	.block.hint .icon,
	.block.hint .icon img {
		width: 110px;
		height: 75px;
	}

	.block.hint .icon img {
		width: 75px;
	}
	/** == Hinweis End == **/

	/** == Downloads Start == **/
	.block.downloads h2 {
		margin-bottom: 25px;
	}

	.block.downloads .download-container {
		border: 1px solid var(--blue);
		border-radius: 15px;
		background-color: var(--white);
		padding: 20px;
	}

	.block.downloads .download-container h2 {
		margin-top: 0;
	}

	.block.downloads .download-container ul > li {
		display: grid;
		grid-template-columns: min-content max-content auto max-content min-content;
		margin-bottom: 15px;
	}

	.block.downloads .download-container ul > li > span:first-child {
		margin-right: 15px;
	}

	.block.downloads .download-container ul > li span.connector {
		margin: 0 5px 8px 5px;
		border-bottom: 2px dotted var(--border-color);
	}

	.block.downloads .download-container ul > li > a:last-child {
		margin-left: 25px;
	}

	.block.downloads .download-container ul > li span.download {
		position: relative;
		top: 3px;
		display: inline-block;
	}
	/** == Downloads End == **/

	/** == Able-Player Start == **/
	.block .able-wrapper {
		z-index: 0;
	}

	.block .able {
		box-shadow: none;
		margin: 0;
	}

	.block .able-status-bar {
		height: 2.5em;
		min-height: 2.5em;
	}
	/** == Able-Player End == **/

	/** == Stellenausschreibungen Start == **/
	.block ul.bite-container a {
		text-decoration: underline;
		color: var(--header-color);
	}

	.block ul.bite-container a:hover {
		text-decoration: none;
		color: var(--header-color);
	}

	.block ul.bite-container li {
		list-style-type: disc;
	}

	.block ul.bite-container li:before {
		content: "";
	}
	/** == Stellenausschreibungen End == **/

	/** == Text-Button Start == **/
	.block.text-button {
		background-color: var(--blue);
	}

	.block.text-button .text {
		padding: 60px 0;
	}

	.block.text-button .button {
		display: flex;
		height: 100%;
		padding: 60px 0;
		align-items: center;
		justify-content: center;
	}

	.block.text-button a.btn {
		display: inline-block;
		height: 40px;
		padding: 10px 30px;
		white-space: nowrap;
		line-height: 1;
		text-align: center;
	}
	/** == Text-Button End == **/
}

@media (max-width: 1200px) {
	/** == Galerie Start == **/
	.block.gallery .preview img {
		height: 100px;
	}
	/** == Galerie End == **/
}

@media (max-width: 991px) {
	/** == Allgemein Start == **/
	main div.container.block {
		margin-bottom: 50px;
	}
	/** == Allgemein End == **/
}

@media (max-width: 767px) {
	/** == Galerie Start == **/
	.block.gallery .active img {
		border: unset;
	}

	.block.gallery a.gallery-image {
		pointer-events: none;
		text-decoration: none;
	}

	.block.gallery a.gallery-image {
		margin-bottom: 40px;
	}

	.block.gallery .row.preview {
		margin-bottom: 0;
	}

	.block.gallery .preview img {
		height: auto;
		width: 100%;
	}
	/** == Galerie End == **/

	/** == Downloads Start == **/
	.block.downloads .download-container ul > li {
		grid-template-columns: min-content 1fr;
	}

	.block.downloads .download-container ul > li a:last-child {
		display: inline-block;
		margin-left: 5px;
	}

	.block.downloads .download-container ul > li > *:nth-last-child(-n + 2) {
		display: none !important;
	}
	/** == Downloads End == **/

	/** == Text-Button Start == **/
	.block.text-button .button {
		padding-top: 0;
	}
	/** == Text-Button End == **/
}
