body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
header,footer,nav,section,aside,main,article,figure,figcaption{display:block}body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img,iframe{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
.mod_visitors .invisible {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    float: left;
	width:0px;
	height:0px;
}
.cc-head>*:first-child{margin-top:0}.cc-head>*:last-child{margin-bottom:15px}.contao-cookiebar{--ccb-backdrop: rgba(0, 0, 0, .75);--ccb-anim-duration: .5s;--ccb-checked-clr: #399d32;--ccb-checked-bg: #dcf3db;--ccb-unchecked-clr: #9c9b99;--ccb-unchecked-bg: #fff;--ccb-disabled-clr: #c8c7c5;--ccb-disabled-bg: #f4f4f4;--ccb-focus-clr: #00a4f4;position:fixed;inset:0;z-index:9999;display:flex;align-items:var(--ccb-align, center);justify-content:var(--ccb-justify, center);letter-spacing:0;padding:15px;max-height:100dvh;box-sizing:border-box;pointer-events:none;overflow:hidden;color:var(--ccb-clr, #444)}.contao-cookiebar *{box-sizing:border-box}.contao-cookiebar p{color:var(--ccb-text, #868686);line-height:1.4}.contao-cookiebar label{position:relative;display:block;padding:8px 13px 8px 0;line-height:1.2rem}.contao-cookiebar label.group{font-weight:600}.contao-cookiebar input{position:absolute;width:1px;height:1px;outline:0 none;opacity:0}.contao-cookiebar input+label{padding:8px 13px 8px 45px;cursor:pointer}.contao-cookiebar input+label:before,.contao-cookiebar input+label:after{content:"";position:absolute;border-radius:10px}.contao-cookiebar input+label:before{top:7px;left:0;width:35px;height:18px;margin:0;box-sizing:content-box;background:var(--ccb-unchecked-bg);border:1px solid var(--ccb-unchecked-clr);transition:border-color .2s}.contao-cookiebar input+label:after{display:block;top:11px;left:4px;width:12px;height:12px;background:var(--ccb-unchecked-clr);transition:background .2s,margin-left .2s,padding .2s}.contao-cookiebar input+label:active:after{padding-left:5px}.contao-cookiebar input.cc-group-half+label:after{background:linear-gradient(to right, var(--ccb-unchecked-clr) 0%, var(--ccb-unchecked-clr) 50%, var(--ccb-checked-clr) 50%, var(--ccb-checked-clr) 100%)}.contao-cookiebar input:checked+label:after{background:var(--ccb-checked-clr);margin-left:17px}.contao-cookiebar input:checked+label:active:after{margin-left:12px}.contao-cookiebar input:checked+label:before{background:var(--ccb-checked-bg);border-color:var(--ccb-checked-clr)}.contao-cookiebar input:disabled+label{pointer-events:none}.contao-cookiebar input:disabled+label:after{background:var(--ccb-disabled-clr)}.contao-cookiebar input:disabled+label:before{background:var(--ccb-disabled-bg);border-color:var(--ccb-disabled-clr)}.contao-cookiebar input:focus-visible:not(.cc-hide-focus)+label:before{outline:3px dashed var(--ccb-focus-clr);outline-offset:2px}.contao-cookiebar .cc-btn{display:inline-block;cursor:pointer;width:100%;padding:8px 14px;margin-bottom:8px;font-size:15px;outline:0 none;border:1px solid var(--ccb-btn-bdr, #cfcfcf);border-radius:4px;color:var(--ccb-btn-clr, #444);background:var(--ccb-btn-bg, #f5f5f5)}.contao-cookiebar .cc-btn:hover,.contao-cookiebar .cc-btn:focus{background:var(--ccb-btn-bg-hvr, #ececec)}.contao-cookiebar .cc-btn:last-child{margin-bottom:0}.contao-cookiebar .grayscale{--ccb-btn-bg: #f1efef;--ccb-btn-bg-hvr: #ececec}.contao-cookiebar .grayscale .success{--ccb-btn-bg: #fbfbfb;--ccb-btn-bg-hvr: #f7f7f7}.contao-cookiebar .highlight .success{--ccb-btn-bg: #4e9e3e;--ccb-btn-bg-hvr: #4c933f;--ccb-btn-bdr: #3e7830;--ccb-btn-clr: #fff}.cc-focus:not(.cc-hide-focus):focus-visible{outline:3px dashed var(--ccb-focus-clr);outline-offset:-3px}.cc-invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;float:left}.cc-inner{display:inline-block;overflow-y:auto;max-height:100%;max-width:100%;padding:23px;border-radius:3px;opacity:0;pointer-events:none;visibility:hidden;font-size:1rem;text-align:left;background:var(--ccb-bg, #fff);box-shadow:var(--ccb-box-shadow, rgba(99, 99, 99, 0.2)) 0 2px 8px 0;animation:var(--ccb-anim, cookiebar-middle-in) var(--ccb-anim-duration) ease-in-out forwards}.cc-group{position:relative;border:1px solid var(--ccb-bdr, #d0d0d0);border-radius:5px;margin-bottom:10px}.cc-cookie-info{font-size:.875rem;background:var(--ccb-info-bg, #fff);border:1px solid var(--ccb-info-bdr, #efefef);padding:10px;border-radius:5px}.cc-cookie-info>div>span{font-weight:600}.cc-cookie-info>div+div{margin-top:5px;word-wrap:break-word}.cc-cookie-info+button.cc-detail-btn-details{margin-top:15px}.cc-cookies{background:var(--ccb-cookies-bg, #fbfbfb);border-radius:0 0 5px 5px}.cc-cookies>p{font-size:.875rem}.cc-cookies>p,.cc-cookies>.cc-cookie{margin:0;padding:15px;border-top:1px solid var(--ccb-cookies-bdr, #fbfbfb)}.cc-cookie label.cookie+*{margin-top:10px}.cc-cookie p{margin:0 0 15px;font-size:.875rem}.cc-cookie-desc p{margin-bottom:0}.cc-footer,.cc-info{text-align:center}.cc-info{margin-top:15px}.cc-info>p{font-size:.875rem}.cc-info>a{display:inline-block;font-size:.813rem;color:var(--ccb-detail-clr, #a2a2a2);text-decoration:none}.cc-info>a:hover{color:var(--ccb-detail-clr-hvr, #717171)}.cc-info>a+a:before{display:inline-block;content:"·";margin-right:5px}.cc-active .cc-inner{opacity:1;pointer-events:auto;visibility:visible}.cc-active.cc-blocked{pointer-events:auto;animation:cookiebar-overlay-in var(--ccb-anim-duration) ease-in-out forwards}.cc-saved.cc-inner{opacity:0;pointer-events:none;visibility:hidden}.cc-saved.cc-blocked{pointer-events:none;animation:cookiebar-overlay-out var(--ccb-anim-duration) ease-in-out forwards}.cc-left{--ccb-justify: flex-start}.cc-right{--ccb-justify: flex-end}.cc-top{--ccb-align: flex-start}.cc-top.cc-active{--ccb-anim: cookiebar-top-in}.cc-top.cc-saved{--ccb-anim: cookiebar-top-out}.cc-middle.cc-active{--ccb-anim: cookiebar-middle-in}.cc-middle.cc-saved{--ccb-anim: cookiebar-middle-out}.cc-bottom{--ccb-align: flex-end}.cc-bottom.cc-active{--ccb-anim: cookiebar-bottom-in}.cc-bottom.cc-saved{--ccb-anim: cookiebar-bottom-out}@media(min-width: 768px){.contao-cookiebar .cc-btn{width:auto;margin-bottom:0}.cc-inner{max-width:var(--ccb-max-width, 750px)}}@media(forced-colors){.contao-cookiebar input+label:after{border:1px solid currentColor}.cc-inner{border:1px solid currentColor}input.cc-group-half+label:after{margin-left:9px}}@media(prefers-reduced-motion){.contao-cookiebar{--ccb-anim-duration: 2s}}@media print{.contao-cookiebar{opacity:0}}@keyframes cookiebar-overlay-in{0%{background:rgba(0,0,0,0)}to{background:var(--ccb-backdrop)}}@keyframes cookiebar-overlay-out{0%{background:var(--ccb-backdrop)}to{background:rgba(0,0,0,0);visibility:hidden}}@keyframes cookiebar-top-in{0%{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-top-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(-100%)}}@keyframes cookiebar-middle-in{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes cookiebar-middle-out{0%{opacity:1;visibility:visible;transform:scale(1)}to{opacity:0;visibility:hidden;transform:scale(0)}}@keyframes cookiebar-bottom-in{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes cookiebar-bottom-out{0%{opacity:1;visibility:visible;transform:translateY(0)}to{opacity:0;visibility:hidden;transform:translateY(100%)}}.cc-group{display:flex;flex-wrap:wrap;justify-content:space-between;align-content:center}.cc-group>label{flex-grow:1;margin:5px 0 5px 10px}.cc-cookies{display:none;width:100%}.cc-detail-btn{padding:8px 10px;line-height:1.2rem}.cc-detail-btn-details{text-decoration:underline;padding:0;margin:0 0 10px}.cc-detail-btn,.cc-detail-btn-details{display:inline-block;color:var(--ccb-detail-clr, #a2a2a2);border:0 none;outline:0 none;background:rgba(0,0,0,0);font-size:13px;letter-spacing:0;text-transform:initial;cursor:pointer}.cc-detail-btn span:nth-child(2),.cc-detail-btn-details span:nth-child(2){display:none}.cc-detail-btn.cc-active span:nth-child(1),.cc-detail-btn-details.cc-active span:nth-child(1){display:none}.cc-detail-btn.cc-active span:nth-child(2),.cc-detail-btn-details.cc-active span:nth-child(2){display:inline}.cc-detail-btn:hover,.cc-detail-btn-details:hover{background:rgba(0,0,0,0);color:var(--ccb-detail-clr-hvr, #717171)}
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}
table.sortable thead th{background-image:url(../../assets/tablesorter/images/default.svg);background-repeat:no-repeat;background-position:center right}table.sortable thead th.tablesorter-headerAsc{background-image:url(../../assets/tablesorter/images/asc.svg)}table.sortable thead th.tablesorter-headerDesc{background-image:url(../../assets/tablesorter/images/desc.svg)}
.content-slider{overflow:hidden;visibility:hidden;position:relative}.slider-wrapper{overflow:hidden;position:relative}.slider-wrapper>*{float:left;width:100%;position:relative}.slider-control{height:30px;position:relative}.slider-control a,.slider-control .slider-menu{position:absolute;top:9px;display:inline-block}.slider-control .slider-prev{left:0}.slider-control .slider-next{right:0}.slider-control .slider-menu{top:0;width:50%;left:50%;margin-left:-25%;font-size:27px;text-align:center}.slider-control .slider-menu b{color:#bbb;cursor:pointer}.slider-control .slider-menu b.active{color:#666}

/* Schriftart für Stadt Laufen Schriftzug */
@font-face {
	font-family: 'WebVijaya';
	font-style: normal;
	font-weight: 400;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/vijaya/vijaya.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/vijaya/vijaya.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/vijaya/vijaya.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/vijaya/vijaya.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/vijaya/vijaya.ttf') format('truetype');
}

/* Schriftart Regular */
@font-face {
	font-family: 'WebFiraSans';
	font-style: normal;
	font-weight: 400;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-regular.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-regular.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-regular.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-regular.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-regular.ttf') format('truetype');
}

/* Schriftart Italic */
@font-face {
	font-family: 'WebFiraSans';
	font-style: italic;
	font-weight: 400;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-italic.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-italic.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-italic.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-italic.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-italic.ttf') format('truetype');
}

/* Schriftart Bold */
@font-face {
	font-family: 'WebFiraSans';
	font-style: normal;
	font-weight: 700;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold.ttf') format('truetype');
}

/* Schriftart Bold Italic */
@font-face {
	font-family: 'WebFiraSans';
	font-style: italic;
	font-weight: 700;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold-italic.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold-italic.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold-italic.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold-italic.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/firasans/firasans-bold-italic.ttf') format('truetype');
}


/* Schriftart Symbole Awesome */
@font-face {
	font-family: 'AwesomeWeb';
	font-style: normal;
	font-weight: 900;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-solid-900.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-solid-900.eot?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-solid-900.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-solid-900.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-solid-900.ttf') format('truetype');
}

/* Schriftart Symbole Awesome */
@font-face {
	font-family: 'AwesomeWeb';
	font-style: normal;
	font-weight: 400;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-regular-400.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-regular-400?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-regular-400.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-regular-400.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-regular-400.ttf') format('truetype');
}

/* Schriftart Symbole Awesome */
@font-face {
	font-family: 'AwbrandWeb';
	font-style: normal;
	font-weight: 400;
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-brands-400.eot');
	src: url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-brands-400?#iefix') format('embedded-opentype'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-brands-400.woff2') format('woff2'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-brands-400.woff') format('woff'),
	url('https://dev.stadtlaufen.de/files/themes/fonts/awesome700/fa-brands-400.ttf') format('truetype');
}

@media print {

	/* Allgemeine Grundeinstellungen */
	html {
		overflow-y: scroll;
		overflow-x: auto;
	}
	
	/* Allgemeine Seitenformatierungen */
	body {
		margin-right :auto;
		margin-left :auto;
		padding: 0;
		vertical-align: top;
		text-align: left;
		font: 1rem WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
	}
	
	#header,
	#footer,
	.startbanner,
	.navi_top {
		display: none;
	}

}


@media screen {

	/* Unsichtbare Links zum Überspringen der Navigation werden formatiert */
	.mod_navigation .invisible {
		color: var(--sl-fontcol);
		background-color: var(--sl-backcol);
	}
	
	/* Beschriftungen von Buttons werden ausgeblendet */
	.navi_start, .navi_suche, .share_cont, .navi_top {
		display: block;
		width: 0;
		height: 0;
		overflow: hidden;
		color: var(--sl-backcol);
		background-color: var(--sl-fontcol);
	}

	/* Der nach-oben-Button wird platziert und formatiert */
	.navi_top::before {
		content: '\f0d8';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		position: fixed;
		z-index: 11890;
		padding: calc(.5rem + .5vw);
		background-color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		right: var(--sl-leerbox);
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle;
		opacity: 1;
		overflow: hidden;
		transition: opacity var(--sl-speeder) ease;
	}

	/* Der nach-oben-Button wird ausgeblendet */
	.navi_top.hide-scroll::before {
		padding: 0;
		width: 0;
		opacity: 0;
		transition: opacity var(--sl-speeder) ease, width 0s ease var(--sl-speeder), padding 0s ease var(--sl-speeder);
	}

	/* Der Home-Button wird platziert und formatiert */
	.navi_start::before {
		content: '\f015';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		position: fixed;
		z-index: 11880;
		padding: calc(.5rem + .5vw);
		background-color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle;
	}

	/* Der Suchen-Button wird platziert und formatiert */
	.navi_suche::before {
		content: '\f002';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		position: fixed;
		right: var(--sl-leerbox);
		z-index: 11850;
		padding: calc(.5rem + .5vw);
		background-color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle;
	}

	/* Das Suchformular wird platziert und ausgeblendet */
	.navi_suche form {
		position: fixed;
		height: calc(2rem + 2vw);
		z-index: 11840;
		color: var(--sl-backcol);
		background-color: var(--sl-highcol);
		background-color: var(--sl-hightrs);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		box-sizing: border-box;
		overflow: hidden;
		text-align: left;
		opacity: 0;
		width: 0;
		padding: 0;
		white-space: nowrap;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

	/* Das Suchformular wird dargestellt, wenn es den Fokus erhält */
	.navi_suche:hover form, .navi_suche:focus form, .navi_suche:active form, .navi_suche:focus-within form {
		width: calc(12rem + 12vw);
		opacity: 1;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

	/* Das Suchformular wird formatiert */
	.navi_suche form .formbody {
		display: flex;
		font-size: 0;
		height: calc(2rem + 2vw);
		align-items: center;
    }

	/* Die Widgets im Suchformular werden platziert */
	.navi_suche .widget {
		display: inline-block;
	}

	/* Die Texteingabe im Suchformular wird formatiert */
	.navi_suche .widget-text .text {
		font-size: var(--sl-fontdef);
		border: 1px solid var(--sl-highcol);
		border-radius: 0;
		color: var(--sl-highcol);
		background-color: var(--sl-backcol);
		margin-left: calc(.9rem + .4vw);
		padding: calc(.15rem + .15vw) calc(.25rem + .25vw);
		outline: none;
		vertical-align: middle;
		width: calc(7.75rem + 7.75vw);
	}

	/* Die Texteingabe wird beim fokussieren anders formatiert */
	.navi_suche .widget-text .text:hover, .navi_suche .widget-text .text:focus, .navi_suche .widget-text .text:active {
		background-color: var(--sl-overlit);
	}

	/* Der Absenden-Button im Suchformular wird platziert */
	.navi_suche .widget-submit .submit {
		font-size: calc(.9rem + .4vw);
		border: 0;
		background-color: transparent;
		color: transparent;
		vertical-align: middle;
		overflow: hidden;
		outline: none;
		padding: 0;
		margin-left: calc(.5rem + .5vw);
	}

	/* Ein Symbol für den Absenden-Button wird eingefügt */
	.navi_suche .widget-submit .submit::before {
		content: '\f04b';
		color: var(--sl-backcol);
		font-family: AwesomeWeb;
		font-weight: bold;
		background-color: transparent;
		text-align: left;
	}

	/* Der Button für das Teilen-Menü wird platziert und formatiert */
	.share_label::before {
		content: '\f1e0';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		position: fixed;
		z-index: 11750;
		padding: calc(.5rem + .5vw);
		background-color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle;
	}

	/* Die Beschriftung des Teilen-Buttons wird ausgeblendet */
	.share_button {
		display: block;
		width: 0;
		height: 0;
		overflow: hidden;
	}

	/* Das Teilen-Menü wird formatiert */
	.share_main {
		display: grid;
		grid-gap: 0;
		grid-auto-flow: column;
		grid-template-columns: calc(2rem + 2vw) calc(2rem + 2vw) calc(2rem + 2vw) calc(2rem + 2vw) calc(2rem + 2vw) 0;
		position: fixed;
		height: calc(2rem + 2vw);
		width: 0;
		z-index: 11740;
		color: var(--sl-backcol);
		background-color: var(--sl-highcol);
		background-color: var(--sl-hightrs);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		box-sizing: border-box;
		overflow: hidden;
		text-align: left;
		opacity: 0;
		padding: 0;
		white-space: nowrap;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

	/* Die einzelnen Buttons des Teilen-Menüs werden formatiert und platziert */
	.share_print, .share_email, .share_whatsapp, .share_facebook, .share_twitter {
		display: grid;
		grid-template-columns: calc(2rem + 2vw) 0;
		grid-template-rows: calc(2rem + 2vw) 0;
		grid-gap: 0;
		align-items: center;
		justify-items: center;
   		font-size: calc(.9rem + .4vw);
		border: 0;
		background-color: transparent;
		color: transparent;
		vertical-align: middle;
		overflow: hidden;
		outline: none;
		padding: 0;
		margin: 0;
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
	}

	/* Abstand des ersten Symbols nach links einhalten */
	.share_print {
		margin-left: calc(.25rem + .25vw);
	}

	/* Der Drucken-Button erhält ein Symbol */
	.share_print::before {
		content: '\f02f';
		color: var(--sl-backcol);
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		background-color: transparent;
	}

	/* Der E-Mail-Button erhält ein Symbol */
	.share_email::before {
		content: '\0040';
		color: var(--sl-backcol);
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		background-color: transparent;
	}

	/* Der Whatsapp-Button erhält ein Symbol */
	.share_whatsapp::before {
		content: '\f232';
		color: var(--sl-backcol);
		font-family: AwbrandWeb;
		font-weight: normal;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		background-color: transparent;
	}

	/* Der Facebook-Button erhält ein Symbol */
	.share_facebook::before {
		content: '\f09a';
		color: var(--sl-backcol);
		font-family: AwbrandWeb;
		font-weight: normal;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		background-color: transparent;
	}

	/* Der Twitter-Button erhält ein Symbol */
	.share_twitter::before {
		content: '\e61b';
		color: var(--sl-backcol);
		font-family: AwbrandWeb;
		font-weight: normal;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		background-color: transparent;
	}

	/* Die Checkboxen für Navigation und Teilen-Menü werden verborgen */
	.navi_select, .share_select {
		position: absolute;
		display: none;
		width: 0;
		height: 0;
		top: 0;
		left: 0;
	}
	
	/* Die Farbe für die Navigationsbutton und Teilen-Button wird gesetzt */
	.navi_label, .share_label {
		color: var(--sl-backcol);
	}
	
	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.navi_label::before {
		content: '\f0c9';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.9rem + .4vw);
		line-height: calc(1rem + 1vw);
		position: fixed;
		z-index: 12000;
		padding: calc(.5rem + .5vw);
		background-color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		width: calc(2rem + 2vw);
		height: calc(2rem + 2vw);
		box-sizing: border-box;
		text-align: center;
		vertical-align: middle;
	}

	/* Die Navigationsbeschriftung wird formatiert */
	.navi_button {
		position: fixed;
		height: calc(2rem + 2vw);
		z-index: 11995;
		font-size: calc(.9rem + .4vw);
		font-weight: bold;
		line-height: calc(1rem + 1vw);
		white-space: nowrap;
		background-color: var(--sl-highcol);
		background-color: var(--sl-hightrs);
		border-radius: var(--sl-rounded);
		border: 1px solid var(--sl-backcol);
		box-sizing: border-box;
		overflow: hidden;
		text-align: left;
		opacity: 1;
		width: calc(6rem + 4vw);
		padding: calc(.5rem + .5vw) calc(.9rem + .4vw);
		margin: 0;
		vertical-align: middle;
		display: flex;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}
	
	/* Ein Zusatz zur Navigationsbeschriftung wird eingefügt und verborgen */
	.navi_button::after {
		content: '\00a0- Navigation';
		width: 0;
		opacity: 0;
		overflow: hidden;
		display: inline-block;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

	/* Ein Hintergrund-Objekt bei geöffneter Navigation wird eingefügt und verborgen */
	.navi_backer {
		position: fixed;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		margin: 0;
		box-sizing: border-box;
		background: rgba(0, 0, 0, 0);
		font-size: 0;
		z-index: 11900;
		transition: background var(--sl-speeder) ease, width 0s ease var(--sl-speeder), height 0s ease var(--sl-speeder);
	}

	/* Die Hauptnavigation wird formatiert */
	.navi_main {
		position: fixed;
		width: 0;
		z-index: 11950;
		opacity: 0;
		max-height: calc(100vh - 6rem - 3vh);
		overflow: visible;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease, padding 0s var(--sl-speeder);
		padding: 0;
		display: flex;
	}
	
	/* Die Checkboxen der ersten Navigationsebene werden ausgeblendet */
	.navi_main input[type=checkbox] {
		width: 0;
		height: 0;
		margin: 0;
		padding: 0;
	}
	
	/* Die oberste Ebene der Navigation wird formatiert */
	.navi_main .level_1 {
		background-color: var(--sl-highcol);
		color: var(--sl-backcol);
		border-radius: var(--sl-rounded);
		border: 0;
		overflow-y: auto;
		overflow-x: hidden;
		width: 100%;
		margin: 0;
		padding: calc(.25rem + .25vw) 0;
	}
	
	/* Unterdrückte Menüpunkte in der Navigation werden ausgeblendet */
	.navi_main .level_1 .navinot {
		display: none;
	}

	/* Die Container der Navigationspunkte auf der obersten Ebene werden formatiert */
	.navi_main .level_1 > li {
		display: flex;
	}

	/* Die Navigationspunkte auf der obersten Ebene werden formatiert */
	.navi_main .level_1 > li > a, .navi_main .level_1 > li > span, .navi_main .level_1 > li > strong, .navi_main .level_1 > li > label {
		padding: calc(.25rem + .25vw) calc(.9rem + .4vw);
		margin: 0;
		color: var(--sl-backcol);
		font-size: calc(.9rem + .4vw);
		text-decoration: none;
		text-align: left;
		white-space: nowrap;
		outline: none;
	}

	/* Aktive Einträge werden gesondert formatiert */
	.navi_main .level_1 > li > .active, .navi_main .level_1 > li > .trail,
	.navi_main .level_2 > li > .active, .navi_main .level_2 > li > .trail {
		color: var(--sl-overcol);
		font-weight: bold;
	}

	/* Den Navigationspunkten auf der obersten Ebene werden Symbole vorangestellt, wenn Unterpunkte vorhanden sind */
	.navi_main .level_1 > li.submenu > a::before,
	.navi_main .level_1 > li.submenu > span::before,
	.navi_main .level_1 > li.submenu > label::before {
		content: '\f0d9';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.5rem + .5vw);
		display: inline-block;
		width: calc(.5rem + .5vw);
		padding-right: calc(.25rem + .25vw);
	}

	/* Die untergeordnete Menüebene wird formatiert und platziert */
	.navi_main .level_2 {
		position: absolute;
		right: 0;
		background-color: var(--sl-highcol);
		background-color: var(--sl-hightrs);
		border-radius: var(--sl-rounded);
		border: 0;
		overflow: hidden;
		width: 0;
		margin: 0;
		padding: calc(.25rem + .25vw) 0;
		text-align: right;
		opacity: 0;
		top: calc(1.5rem + 1.5vw);
		bottom: 0;
		z-index: -1;
		transition: right var(--sl-speeder) ease, opacity var(--sl-speeder) ease, width 0s var(--sl-speeder);
	}

	/* Die Container der Navigationspunkte auf der untergeordneten Ebene werden formatiert */
	.navi_main .level_2 > li {
		display: flex;
		text-align: right;
		justify-content: flex-end;
		margin-right: calc(.5rem + .5vw);
		overflow: hidden;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

	/* Die Navigationspunkte auf der untergeordneten Ebene werden formatiert */
	.navi_main .level_2 > li > a, .navi_main .level_2 > li > span, .navi_main .level_2 > li > strong, .navi_main .level_2 > li > label {
		padding: calc(.25rem + .25vw) calc(.5rem + .5vw);
		margin: 0;
		color: var(--sl-backcol);
		font-size: calc(.8rem + .3vw);
		text-decoration: none;
		outline: none;
	}

	/* Verweise auf externe Seiten erhalten eine gesonderte Formatierung */
	.navi_main li.extern > a {
		color: var(--sl-fehlcol);
	}
	
	/* Verweise auf externe Seiten erhalten auch ein gesondertes Symbol */
	.navi_main li.extern > a::before {
		content: '\f2f5';
		font-family: AwesomeWeb;
		font-weight: bold;
		font-size: calc(.5rem + .5vw);
		display: inline-block;
		width: calc(.5rem + .5vw);
		padding-right: calc(.25rem + .25vw);
	}

}

@media screen and (min-width: 1025px) {

	/* Positionierung des Top-Links */
	.navi_top::before {
		bottom: calc(1.5rem + 1.5vw);
	}

	/* Home-Button im Header */
	.navi_start::before {
		top: calc(1.5rem + 1.5vw);
		right: var(--sl-leerbox);
	}

	/* Positionierung der Hauptnavigation */
	.navi_main {
		top: calc(3rem + 3vw);
		right: calc(var(--sl-leerbox) + 3rem + 3vw);
		padding: calc(1.5rem + 1.5vw) 0 0 0;
	}

	/* Reaktion der Hauptnavigation auf Hover- und Fokus-Aktionen */
	.navi_cont:hover .navi_main, .navi_cont:focus .navi_main, .navi_cont:active .navi_main, .navi_cont:focus-within .navi_main {
		width: calc(12rem + 6vw);
		opacity: 1;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease, padding 0s;
	}

	/* Reaktion der Hauptnavigation auf Hover- und Fokus-Aktionen */
	.navi_cont:hover .navi_main .level_1, .navi_cont:focus .navi_main .level_1, .navi_cont:active .navi_main .level_1, .navi_cont:focus-within .navi_main .level_1 {
		border: 1px solid var(--sl-backcol);
	}

	/* Reaktion des Navigationsbuttons auf Hover- und Fokus-Aktionen */
	.navi_cont:hover .navi_button, .navi_cont:focus .navi_button, .navi_cont:active .navi_button, .navi_cont:focus-within .navi_button {
		width: calc(12rem + 6vw);
		opacity: 1;
	}

	/* Reaktion des zusätzlichen Inhalts im Navigationsbutton auf Hover- und Fokus-Aktionen */
	.navi_cont:hover .navi_button::after, .navi_cont:focus .navi_button::after, .navi_cont:active .navi_button::after, .navi_cont:focus-within .navi_button::after {
		width: calc(4rem + 4vw);
		opacity: 1;
	}

	/* Die statischen Hauptnavigationspunkte sind nicht klickbar */
	.navi_main .level_1 li span, .navi_main .level_1 li strong, .navi_main .level_1 li label {
		cursor: default;
	}

	/* Dynamische Hauptnavigationspunkte reagieren auf Hover- und Fokus-Aktionen */
	.navi_main .level_1 li:hover > a, .navi_main .level_1 li:focus > a, .navi_main .level_1 li:active > a, .navi_main .level_1 li:focus-within > a,
	.navi_main .level_1 li:hover > span, .navi_main .level_1 li:focus > span, .navi_main .level_1 li:active > span, .navi_main .level_1 li:focus-within > span,
	.navi_main .level_1 li:hover > label, .navi_main .level_1 li:focus > label, .navi_main .level_1 li:active > label, .navi_main .level_1 li:focus-within > label {
		color: var(--sl-overcol);
		text-decoration: underline;
	}

	/* "Statische" Hauptnavigationspunkte mit Untermenüs reagieren nicht auf Hover- und Fokus-Aktionen */
	.navi_main .level_1 li:hover > a::before, .navi_main .level_1 li:focus > a::before, .navi_main .level_1 li:active > a::before, .navi_main .level_1 li:focus-within > a::before,
	.navi_main .level_1 > li.submenu:hover > a, .navi_main .level_1 > li.submenu:focus > a, .navi_main .level_1 > li.submenu:active > a, .navi_main .level_1 > li.submenu:focus-within > a,
	.navi_main .level_1 > li.submenu:hover > span, .navi_main .level_1 > li.submenu:focus > span, .navi_main .level_1 > li.submenu:active > span, .navi_main .level_1 > li.submenu:focus-within > span,
	.navi_main .level_1 > li.submenu:hover > label, .navi_main .level_1 > li.submenu:focus > label, .navi_main .level_1 > li.submenu:active > label, .navi_main .level_1 > li.submenu:focus-within > label {
		text-decoration: none;
	}
	
	/* Untermenüs reagieren auf Hover- und Fokus-Aktionen und werden entsprechend animiert und platziert */
	.navi_main .level_1 li:hover .level_2, .navi_main .level_1 li:focus .level_2, .navi_main .level_1 li:active .level_2, .navi_main .level_1 li:focus-within .level_2 {
		right: calc(11.5rem + 5.5vw);
		width: calc(12rem + 6vw);
		opacity: 1;
		transition: right var(--sl-speeder) ease, opacity var(--sl-speeder) ease, width 0s;
		border: 1px solid var(--sl-backcol);
	}

	/* Farbliche Veränderung verschiedener Elemente auf Hover- und Fokus-Aktionen */
	.navi_start:hover::before, .navi_start:focus::before, .navi_start:active::before,
	.navi_label:hover, .navi_label:focus, .navi_label:active,
	.navi_suche:hover::before, .navi_suche:focus::before, .navi_suche:active::before, .navi_suche:focus-within::before,
	.navi_top:hover::before, .navi_top:focus::before, .navi_top:active::before,
	.navi_select:hover ~ .navi_label::before, .navi_select:focus ~ .navi_label::before, .navi_select:active ~ .navi_label::before,
	.navi_select:hover ~ .navi_label .navi_button, .navi_select:focus ~ .navi_label .navi_button, .navi_select:active ~ .navi_label .navi_button,
	.share_cont:hover .share_label::before, .share_cont:focus .share_label::before, .share_cont:active .share_label::before, .share_cont:focus-within .share_label::before,
	.share_print:hover::before, .share_print:focus::before, .share_print:active::before,
	.share_email:hover::before, .share_email:focus::before, .share_email:active::before,
	.share_whatsapp:hover::before, .share_whatsapp:focus::before, .share_whatsapp:active::before,
	.share_facebook:hover::before, .share_facebook:focus::before, .share_facebook:active::before,
	.share_twitter:hover::before, .share_twitter:focus::before, .share_twitter:active::before {
		color: var(--sl-overcol);
		border-color: var(--sl-overcol);
	}

	/* Positionierung des Navigationslabels */
	.navi_label::before {
		top: calc(1.5rem + 1.5vw);
		right: calc(var(--sl-leerbox) + 3rem + 3vw);
	}
	
	/* Positionierung des Navigationsbuttons */
	.navi_button {
		top: calc(1.5rem + 1.5vw);
		right: calc(var(--sl-leerbox) + 3rem + 3vw);
	}
	
	/* Platzierung des Suchbuttons */
	.navi_suche::before {
		top: calc(4.5rem + 4.5vw);
	}

	/* Platzierung des Suchformulars */
	.navi_suche form {
		top: calc(4.5rem + 4.5vw);
		right: calc(var(--sl-leerbox));
	}
	
	/* Darstellung der Widgets in der Suche */
	.navi_suche .widget-submit .submit:hover::before, .navi_suche .widget-submit .submit:focus::before, .navi_suche .widget-submit .submit:active::before {
		color: var(--sl-overcol);
		cursor: pointer;
	}

	/* Positionierung des Teilen-Labels */
	.share_main,
	.share_label::before {
		top: calc(7.5rem + 7.5vw);
		right: calc(var(--sl-leerbox));
	}

	/* Reaktion des Teilen-Buttons auf Hover- und Fokus-Aktionen */
	.share_main button:hover {
		cursor: pointer;
	}
	
	/* Darstellung des Teilen-Inhalts bei Hover- und Fokus-Aktionen anpassen */
	.share_cont:hover .share_main, .share_cont:focus .share_main, .share_cont:active .share_main, .share_cont:focus-within .share_main {
		width: calc(12.25rem + 12.25vw);
		opacity: 1;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

}

@media screen and (max-width: 1024px) {
	
	/* nach-oben-Button wird positioniert */
	.navi_top::before {
		bottom: 1rem;
		right: var(--sl-leerabs);
	}

	/* Home-Button wird positioniert */
	.navi_start::before {
		bottom: calc(4rem + 2vw);
		left: var(--sl-leerabs);
	}

	/* Suchen-Button wird positioniert */
	.navi_suche::before {
		top: calc(4rem + 2vw);
		right: var(--sl-leerabs);
	}	

	/* Suchformular wird positioniert */
	.navi_suche form {
		top: calc(4rem + 2vw);
		right: var(--sl-leerabs);
	}

	/* Die Farben verschiedener Elemente reagieren bei Aktivierung */
	.navi_select:checked ~ .navi_label,
	.navi_suche:hover, .navi_suche:focus, .navi_suche:active, .navi_suche:focus-within,
	.share_cont:hover .share_label, .share_cont:focus .share_label, .share_cont:active .share_label, .share_cont:focus-within .share_label {
		color: var(--sl-overcol);
	}

	/* Positionierung der Hauptnavigation */
	.navi_main {
		padding: 0;
		top: calc(4rem + 2vw);
		right: var(--sl-leerabs);
	}	

	/* Aktivierung der Hauptnavigation bei Klick auf Navigationsbutton */
	.navi_select:checked ~ .navi_main {
		width: calc(12rem + 6vw);
		opacity: 1;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease, padding 0s, border 0s;
	}
	
	/* Sobald die erste Navigationsebene eingeblendet wird, setzen wir den Rahmen */
	.navi_select:checked ~ .navi_main .level_1 {
		border: 1px solid var(--sl-backcol);
	}

	/* Positionierung von Navigationsmenüs 2. Ebene */
	.navi_main .level_2 {
		top: 0;
		border: 1px solid var(--sl-backcol);
	}

	/* Aktivierung der untergeordneten Navigation 2. Ebene */
	.navi_main .level_1 li:hover .level_2,
	.navi_main .level_1 li:focus .level_2,
	.navi_main .level_1 li:active .level_2 {
		display: block;
		right: calc(11.5rem + 5.5vw);
		width: calc(12rem + 6vw);
		opacity: 1;
		transition: right var(--sl-speeder) ease, opacity var(--sl-speeder) ease, width 0s;
	}

	/* Änderung des Labels im aktiven Navigationsbutton */
	.navi_select:checked ~ .navi_label::before {
		content: '\f00d';
	}

	/* Änderung der Breite des aktiven Navigationsbuttons */
	.navi_select:checked ~ .navi_label .navi_button {
		width: calc(12rem + 6vw);
		opacity: 1;
	}

	/* Anpassung des zusätzlichen Inhalts im aktiven Navigationsbutton */
	.navi_select:checked ~ .navi_label .navi_button::after {
		width: calc(6rem + 3vw);
		opacity: 1;
	}

	/* Darstellung der Hintergrund-Hinterlegung bei aktivierter Navigation */
	.navi_select:checked ~ .navi_label .navi_backer {
		width: 100vw;
		height: 100vh;
		background-color: var(--sl-backtrs);
		transition: background var(--sl-speeder) ease, width 0s ease 0s, height 0s ease 0s;
	}

	/* Positionierung des Navigations-Icons */
	.navi_button, .navi_label::before {
		top: 1rem;
		right: var(--sl-leerabs);
	}
	
	/* Positionierung des Teilen-Labels */
	.share_label::before {
		bottom: 1rem;
		left: var(--sl-leerabs);
	}

	/* Positionierung des Teilen-Inhalts */
	.share_main {
		padding-left: calc(2rem + 2vw);
		bottom: 1rem;
		left: var(--sl-leerabs);
	}

	/* Aktivierung des Teilen-Inhalts bei bestimmten Aktionen */
	.share_select:hover ~ .share_main, .share_select:focus ~ .share_main, .share_select:active ~ .share_main, .share_select:focus-within ~ .share_main {
		width: calc(12.25rem + 12.25vw);
		opacity: 1;
		transition: width var(--sl-speeder) ease, opacity var(--sl-speeder) ease;
	}

}

@media screen and (max-width: 640px) {
	
	/* Aktivierung der Hauptnavigation bei Klick auf Navigationsbutton */
	.navi_select:checked ~ .navi_main {
		width: calc(14rem + 7vw);
	}

	/* Änderung der Breite des aktiven Navigationsbuttons */
	.navi_select:checked ~ .navi_label .navi_button {
		width: calc(14rem + 7vw);
	}
	
	/* Die Ausrichtung der Navigationseinträge erfolgt untereinander */
	.navi_main .level_1 li {
		flex-direction: column;
	}
	
	/* Die Pfeile werden für die Navigation verändert */
	.navi_main .level_1 > li.submenu > a::before,
	.navi_main .level_1 > li.submenu > span::before,
	.navi_main .level_1 > li.submenu > label::before {
		content: '\f0d7';
	}

	/* Die Pfeile werden für die Navigation verändert */
	.navi_main .level_1 > li.submenu > input[type=checkbox]:checked ~ a::before,
	.navi_main .level_1 > li.submenu > input[type=checkbox]:checked ~ span::before,
	.navi_main .level_1 > li.submenu > input[type=checkbox]:checked ~ label::before {
		content: '\f0da';
	}
	
	/* Die Formatierung der Navigationseinträge in der zweiten Ebene wird verändert */
	.navi_main .level_2 {
		z-index: auto;
		position: relative;
		height: 0;
		padding: 0;
		border: 0;
		right: calc(11.5rem + 5.5vw);
        width: 0;
	}
	
	/* Ausrichtung der Einträge in der zweiten Navigationsebene wird angepasst */
	.navi_main .level_2 a, .navi_main .level_2 strong, .navi_main .level_2 label {
		text-align: left;
	}
	
	/* Aktivierung der untergeordneten Navigation 2. Ebene */
	.navi_main .level_1 input[type=checkbox]:checked ~ .level_2 {
		right: 0;
		height: auto;
        width: 100%;
		opacity: 1;
		border: 0;
		margin-left: calc(1.4rem + .9vw);
		transition: right var(--sl-speeder) ease, opacity var(--sl-speeder) ease, width 0s;
	}
	
}

/* ----------------------------------------------------- */
/* Grundlegende Formatierungen für Bildschirmdarstellung */
/* ----------------------------------------------------- */

@media screen and (max-width: 1024px) {
	
	/* Variablen für mobile Darstellung */
	html {
		--sl-leerbox: calc(4rem + 2vw);
		--sl-leerabs: 1rem;
		--sl-leerend: calc(1rem + 1vw);
		--sl-headtop: 1rem;
	}

}

@media screen and (max-width: 640px) {
	
	/* Variablen für mobile Darstellung */
	html {
		--sl-leerbox: 1rem;
	}

}

@media screen and (min-width: 1025px) {
	
	/* Variable für Desktop-Darstellung */
	html {
		--sl-leerbox: 7.5vw;
		--sl-leerabs: 2.5vw;
		--sl-leerend: 5vw;
		--sl-headtop: calc(1.5rem + 1.5vw);
	}

}

@media (prefers-color-scheme: light) {
  html {
	--sl-highcol: rgb(3,82,169);
	--sl-hightrs: rgba(3,82,169,.85);
	--sl-highlgt: rgba(3,82,169,.10);
	--sl-fontcol: rgb(0,0,0);
	--sl-fonttrs: rgba(0,0,0,.6);
	--sl-backcol: rgb(255,255,255);
	--sl-backtrs: rgba(255,255,255,.6);
	--sl-overcol: rgb(255,232,76);
	--sl-overlit: rgb(255,249,204);
	--sl-fehlcol: rgb(255,225,210);
	--sl-fehllit: rgb(140,0,0);
	--sl-movecol: rgb(150,0,0);
  }
}

@media (prefers-color-scheme: dark) {
  html {
	--sl-highcol: rgb(165,210,255);
	--sl-hightrs: rgba(165,210,255,.85);
	--sl-highlgt: rgba(165,210,255,.10);
	--sl-fontcol: rgb(230,230,230);
	--sl-fonttrs: rgba(230,230,230,.7);
	--sl-backcol: rgb(24,24,24);
	--sl-backtrs: rgba(24,24,24,.7);
	--sl-overcol: rgb(5,80,180);
	--sl-overlit: rgb(25,60,110);
	--sl-fehlcol: rgb(140,0,0);
	--sl-fehllit: rgb(255,225,210);
	--sl-movecol: rgb(150,170,190);
  }
}

@media screen {

	/* Allgemeine Grundeinstellungen */
	html {
		overflow-y: scroll;
		overflow-x: auto;
		scroll-behavior: smooth;
		--sl-rounded: calc(1rem + 1vw);
		--sl-speeder: .25s;
		--sl-fontdef: calc(.8rem + .25vw);
		--sl-fontsml: calc(.7rem + .2vw);
	}
	
	/* Allgemeine Seitenformatierungen */
	body {
		margin-right :auto;
		margin-left :auto;
		padding: 0;
		vertical-align: top;
		text-align: left;
		font: var(--sl-fontdef) WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		color: var(--sl-fontcol);
		background-color: var(--sl-backcol);
		background-attachment: fixed;
	}
	
	/* Allgemeine Seitenformatierungen für RCE-Template */
	body.laufen-rce-template {
	    font-family: WebFiraSans,Verdana,Arial,Helvetica,sans-serif !important;
	}
	
	/* ------------------------------ */
	/* Formatierungen im Hauptbereich */
	/* ------------------------------ */
	
	/* Standard-Abstände für Artikel-Blöcke */
	.mod_article {
		margin: 0;
		padding: var(--sl-leerabs) var(--sl-leerbox) calc(var(--sl-leerabs) * 2) var(--sl-leerbox);
		box-sizing: border-box;
	}

	/* Standard-Abstände für Artikel-Blöcke */
	.mod_article.startbanner {
		margin: 0;
		padding: 0;
	}

	/* Standard-Abstände für Artikel-Blöcke */
	.mod_article.infobox {
		background-color: var(--sl-highlgt);
	}

	/* Standard-Abstände für Artikel-Blöcke */
	.mod_article.trenner {
		border-top: 1px solid var(--sl-highcol);
	}

	/* Überschriften erster Ordnung */
	.mod_article h1 {
		font-size: calc(2.5 * var(--sl-fontdef));
		margin-top: calc(2.5 * var(--sl-fontdef));
		margin-bottom: calc(2.5 * var(--sl-fontdef));
		font-weight: bold;
	}
	
	/* Überschriften zweiter Ordnung */
	.mod_article h2 {
		font-size: calc(2 * var(--sl-fontdef));
		margin-top: calc(2 * var(--sl-fontdef));
		margin-bottom: calc(2 * var(--sl-fontdef));
		font-weight: bold;
	}
	
	/* Überschriften dritter Ordnung */
	.mod_article h3 {
		font-size: calc(1.6 * var(--sl-fontdef));
		margin-top: calc(1.6 * var(--sl-fontdef));
		margin-bottom: calc(1.6 * var(--sl-fontdef));
		font-weight: bold;
	}

	/* Überschriften vierter Ordnung */
	.mod_article h4 {
		font-size: calc(1.3 * var(--sl-fontdef));
		margin-top: calc(1.3 * var(--sl-fontdef));
		margin-bottom: calc(1.3 * var(--sl-fontdef));
		font-weight: bold;
	}

	/* Absatzformatierungen */
	.mod_article p {
		font-size: var(--sl-fontdef);
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
		line-height: 175%;
	}
	
	/* Elemente nebeneinander darstellen */
	.mod_article .nebeneinander > div {
		display: inline-block;
		margin-right: var(--sl-fontdef);		
	}
	
	/* Standard-Abstände für Artikel-Blöcke */
	.content-text img,
	.content-gallery img {
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		display: block;
	}

	/* Standard-Abstände für Artikel-Blöcke */
	.content-text.media--right figure {
		margin: var(--sl-fontdef) 0 var(--sl-fontdef) var(--sl-fontdef);
	}

	/* Standard-Abstände für Artikel-Blöcke */
	.content-text.media--left figure {
		margin: var(--sl-fontdef) var(--sl-fontdef) var(--sl-fontdef) 0;
	}
	
	/* Bildausrichtung innerhalb eines Hyperlink-Blocks */
	.content-hyperlink figure {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
	}
	
	/* Ungeordnete Aufzählungen in Textblöcken */
	.content-text ul, .content-text ol {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
		list-style-position: outside;
		margin-left: calc(2 * var(--sl-fontdef));
	}

	/* Darstellungsart von ungeordneten Aufzählungen noch verfeinern */
	.content-text ul {
		list-style-type: disc;
		margin-left: var(--sl-fontdef);
	}

	/* Zeilenhöhen in ungeordneten Aufzählungen */
	.content-text ul li, .content-text ol li {
		line-height: 175%;
	}

	/* Zeilenhöhen in Download-Aufzählungen */
	.content-download, .content-downloads ul li {
		line-height: 150%;
	}

	/* Formatierung in Download-Aufzählungen */
	.content-download, .content-downloads ul {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
		list-style-type: none;
		margin-left: 0;
	}

	/* Tabellen-Inhaltsblock */
	.content-table {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
	}

	/* Tabellenformatierung */
	.content-table table {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
		font-size: var(--sl-fontdef);
		line-height: 175%;
		border-collapse: separate;
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		background-color: var(--sl-backcol);
		overflow: hidden;
	}
	
	/* Tabellenindexierungszelle formatieren */
	.content-table th {
		background-color: var(--sl-highlgt);
		padding: calc(.25 * var(--sl-fontdef)) calc(.5 * var(--sl-fontdef));
		font-weight: bold;
		border-bottom: 1px solid var(--sl-highlgt);
		border-right: 1px solid var(--sl-highlgt);
	}
	
	/* Tabelleninhaltszelle formatieren */
	.content-table td {
		padding: calc(.25 * var(--sl-fontdef)) calc(.5 * var(--sl-fontdef));
		border-bottom: 1px solid var(--sl-highlgt);
		border-right: 1px solid var(--sl-highlgt);
	}

	/* Letzten Eintrag einer Tabellenzeile formatieren */
	.content-table th:last-child,
	.content-table td:last-child {
		border-right: 0;
	}

	/* Letzte Zeile eines Gliederungsblocks in der Tabelle formatieren */
	.content-table tr:last-child th,
	.content-table tr:last-child td {
		border-bottom: 0;
	}

	/* Formatierungen für Links */
	.content-text a, .content-table a, .mod_newslist a, .back a, .mainsub a, .mod_c4g_maps a {
		color: var(--sl-highcol);
		text-decoration: underline;
	}

	/* Formatierungen für markierte Links */
	.content-text a:hover, .content-text a:focus, .content-text a:active,
	.content-table a:hover, .content-table a:focus, .content-table a:active,
	.mod_newslist a:hover, .mod_newslist a:focus, .mod_newslist a:active,
	.back a:hover, .back a:focus, .back a:active,
	.mainsub a:hover, .mainsub a:focus, .mainsub a:active,
	.mod_c4g_maps a:hover, .mod_c4g_maps a:focus, .mod_c4g_maps a:active {
		color: var(--sl-movecol);
		text-decoration: underline;
	}

	/* Andere Farbe bei externen Links */
	.content-text a[href^="http:"], .content-text a[href^="https:"],
	.content-table a[href^="http:"], .content-table a[href^="https:"],
	.mod_newslist a[href^="http:"], .mod_newslist a[href^="https:"],
	.back a[href^="http:"], .back a[href^="https:"],
	.mainsub a[href^="http:"], .mainsub a[href^="https:"],
	.mod_c4g_maps a[href^="http:"], .mod_c4g_maps a[href^="https:"] {
		color: var(--sl-fehllit);
    }

	/* Formatierungen für markierte Links */
	.content-text a[href^="http:"]:hover, .content-text a[href^="http:"]:focus, .content-text a[href^="http:"]:active,
	.content-text a[href^="https:"]:hover, .content-text a[href^="https:"]:focus, .content-text a[href^="https:"]:active,
	.content-table a[href^="http:"]:hover, .content-table a[href^="http:"]:focus, .content-table a[href^="http:"]:active,
	.content-table a[href^="https:"]:hover, .content-table a[href^="https:"]:focus, .content-table a[href^="https:"]:active,
	.mod_newslist a[href^="http:"]:hover, .mod_newslist a[href^="http:"]:focus, .mod_newslist a[href^="http:"]:active,
	.mod_newslist a[href^="https:"]:hover, .mod_newslist a[href^="https:"]:focus, .mod_newslist a[href^="https:"]:active,
	.back a[href^="http:"]:hover, .back a[href^="http:"]:focus, .back a[href^="http:"]:active,
	.back a[href^="https:"]:hover, .back a[href^="https:"]:focus, .back a[href^="https:"]:active,
	.mainsub a[href^="http:"]:hover, .mainsub a[href^="http:"]:focus, .mainsub a[href^="http:"]:active,
	.mainsub a[href^="https:"]:hover, .mainsub a[href^="https:"]:focus, .mainsub a[href^="https:"]:active,
	.mainsub a[href^="http:"]:hover, .mainsub a[href^="http:"]:focus, .mainsub a[href^="http:"]:active,
	.mod_c4g_maps a[href^="https:"]:hover, .mod_c4g_maps a[href^="https:"]:focus, .mod_c4g_maps a[href^="https:"]:active {
		color: var(--sl-highcol);
	}

	/* Symbol vor Links */
	.content-text a::before, .content-table a::before, .content-download a::before, .content-downloads a::before, .mod_newslist a::before, .back a::before, .mainsub a::before, .mod_c4g_maps a::before {
		content: '\f015';
		font-family: AwesomeWeb;
		font-weight: bold;
		display: inline-block;
		padding-left: calc(.25 * var(--sl-fontdef));
		padding-right: calc(.5 * var(--sl-fontdef));
		text-decoration: none;
    }

	/* Bei in den Textblock eingefügten klickbaren Bildern kein Linkbild anzeigen */
	.content-text a.cboxElement::before {
		content: '';
		display: none;
	}
	
	/* Symbol vor Nachrichtenbeiträgen */
	.content-text a[href^="/einzelartikel/"]::before,
	.content-table a[href^="/einzelartikel/"]::before,
	.mod_newslist a[href^="/einzelartikel/"]::before,
	.back a[href^="/einzelartikel/"]::before,
	.mainsub a[href^="/einzelartikel/"]::before,
	.mod_c4g_maps a[href^="/einzelartikel/"]::before {
		content: '\f15c';
    }

	/* Symbol vor externen Links */
	.content-text a[href^="http:"]::before, .content-text a[href^="https:"]::before,
	.content-table a[href^="http:"]::before, .content-table a[href^="https:"]::before,
	.mod_newslist a[href^="http:"]::before, .mod_newslist a[href^="https:"]::before,
	.back a[href^="http:"]::before, .back a[href^="https:"]::before,
	.mainsub a[href^="http:"]::before, .mainsub a[href^="https:"]::before,
	.mod_c4g_maps a[href^="http:"]::before, .mod_c4g_maps a[href^="https:"]::before {
		content: '\f2f5';
    }

	/* Symbol vor E-Mail-Links */
	.content-text a[href^="mailto:"]::before, .content-table a[href^="mailto:"]::before, .mod_newslist a[href^="mailto:"]::before, .back a[href^="mailto:"]::before, .mainsub a[href^="mailto:"]::before {
		content: '\f0e0';
	}
	
	/* Symbol vor Telefon-Links */
	.content-text a[href^="tel:"]::before, .content-table a[href^="tel:"]::before, .mod_newslist a[href^="tel:"]::before, .back a[href^="tel:"]::before, .mainsub a[href^="tel:"]::before {
		content: '\f095';
	}
	
	/* Bildbeschreibung eines eingebetteten Bildes */
	.content-text figure figcaption,
	.content-image figure figcaption {
		font-size: var(--sl-fontsml);
		margin-top: var(--sl-fontsml);
		margin-bottom: var(--sl-fontsml);
		line-height: 175%;
    }

	/* Bildformatierung eines eingebetteten Bildes */
	.content-image figure img {
		margin-top: var(--sl-fontsml);
		margin-bottom: var(--sl-fontsml);
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		display: block;
	}

	/* Formatierungen für Links */
	.content-download a, .content-downloads a {
		color: var(--sl-fontcol);
		text-decoration: none;
		display: inline-grid;
		grid-template-columns: min-content 6rem auto;
	}

	/* Formatierungen für Links */
	.content-download a .filetext, .content-downloads a .filetext {
		color: var(--sl-highcol);
		text-decoration: underline;
		clear: right;
		grid-column-start: 2;
		grid-column-end: 4;
	}

	/* Formatierungen für Links */
	.content-download a .filetype, .content-downloads a .filetype {
		font-size: var(--sl-fontsml);
	}

	/* Formatierungen für Links */
	.content-download a .filesize, .content-downloads a .filesize {
		color: var(--sl-movecol);
		font-size: var(--sl-fontsml);
	}
    
	/* Größeres Dateisymbol vor Download-Links */
	.content-download a::before, .content-downloads a::before {
		content: '\f0c6';
		color: var(--sl-highcol);
		font-size: calc(2 * var(--sl-fontdef));
		grid-row: span 2;
		padding: 0 var(--sl-fontdef) 0 calc(.25 * var(--sl-fontdef));
		align-self: center;
	}

	/* Formatierungen für Links */
	.content-downloads li {
		margin-bottom: var(--sl-fontdef);
	}

	/* Formatierungen für Links */
	.content-downloads li::last-child {
		margin-bottom: 0;
	}

	/* Formatierungen für markierte Links */
	.content-download a:hover .filetext, .content-download a:focus .filetext, .content-download a:active .filetext,
	.content-downloads a:hover .filetext, .content-downloads a:focus .filetext, .content-downloads a:active .filetext {
		color: var(--sl-movecol);
		text-decoration: underline;
	}

	/* Formatierungen für markierte Links */
	.content-download a:hover:before, .content-download a:focus:before, .content-download a:active:before,
	.content-downloads a:hover:before, .content-downloads a:focus:before, .content-downloads a:active:before {
		color: var(--sl-movecol);
	}

	/* Formatierung für Akkordeon */
	.content-accordion {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		overflow: hidden;
	}

	/* Formatierung für Header des Akkordeon-Bereichs */
	.content-accordion .handorgel__header {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: var(--sl-fontdef);
		font-weight: bold;
		color: var(--sl-highcol);
		box-sizing: border-box;
		border-top: 1px solid var(--sl-highlgt);
	}

	/* Formatierung für Header des Akkordeon-Bereichs */
	.content-accordion .handorgel__header:first-child {
		border-top: 0;
	}

	/* Button im Header des Akkordeon-Bereichs */
	.content-accordion .handorgel__header__button {
		margin: 0;
		padding: calc(var(--sl-fontdef) * 0.75) var(--sl-fontdef);
		border: 0;
		box-sizing: border-box;
		text-decoration: underline;
		outline: none;
		background-color: var(--sl-backcol);
		line-height: 175%;
	}

	/* Symbol für Button im Akkordeon-Bereich */
	.content-accordion .handorgel__header__button:before {
		display: inline-block;
		content: '\f0d7';
    	font-family: AwesomeWeb;
    	font-weight: bold;
    	margin-right: calc(.5 * var(--sl-fontdef));
    	text-decoration: none;
	}

	/* Markierung beim Überfahren des Header-Buttons im Akkordeon-Bereich */
	.content-accordion .handorgel__header__button:hover, .content-accordion .handorgel__header__button:focus, .content-accordion .handorgel__header__button:active {
		color: var(--sl-movecol);
	}
	
	/* Markierung des geöffneten Buttons im Header des Akkordeon-Bereichs */
	.content-accordion .handorgel__header--opened .handorgel__header__button:hover, .content-accordion .handorgel__header--opened .handorgel__header__button:focus, .content-accordion .handorgel__header--opened .handorgel__header__button:active {
		text-decoration: underline;
	}
	
	/* Änderung des geöffneten Buttons im Header des Akkordeon-Bereichs */
	.content-accordion .handorgel__header--opened .handorgel__header__button:before {
		content: '\f0d8';
	}

	/* Formatierung eines Akkordeon-Bereichs */
	.content-accordion .handorgel__content {
		border-top: 1px solid var(--sl-highlgt);
		border-bottom: 0;
		border-left: 0;
		border-right: 0;
		background-color: var(--sl-backcol);
		margin: 0;
		padding: 0;
	}

	/* Formatierung eines Inhaltselements im Akkordeon-Bereich */
	.content-accordion .handorgel__content__inner {
		border: 0;
		margin: 0;
        padding: 0 var(--sl-fontdef);
        overflow: hidden;
        background-color: var(--sl-backcol);
	}

	/* Galerie-Darstellung */
	.content-gallery ul {
		display: inline-grid;
		grid-auto-flow: column;
		grid-template-columns: auto auto auto auto;
		column-gap: calc(1rem + 1vw);
		row-gap: calc(1rem + 1vw);
		overflow: visible;
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
	}

	/* Youtube-Element formatieren */
	.content-youtube {
	    margin-top: var(--sl-fontdef);
	    margin-bottom: var(--sl-fontdef);
	    font-size: 0;
	    max-width: 60rem;
	}
	
	/* Youtube-Element formatieren */
	.content-youtube figure {
		overflow: hidden;
	    border: 1px solid var(--sl-highcol);
	    border-radius: .5rem;
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_simple, .mod_newslist .layout_short {
		padding: calc(var(--sl-fontdef) * 0.75) var(--sl-fontdef);
		border-left: 1px solid var(--sl-highcol);
		border-right: 1px solid var(--sl-highcol);
		border-bottom: 1px solid var(--sl-highlgt);
		line-height: 175%;
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_simple:first-of-type, .mod_newslist .layout_short:first-of-type {
		border-top: 1px solid var(--sl-highcol);
		border-top-left-radius: .5rem;
		border-top-right-radius: .5rem;
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_simple:last-of-type, .mod_newslist .layout_short:last-of-type {
		border-bottom: 1px solid var(--sl-highcol);
		border-bottom-left-radius: .5rem;
		border-bottom-right-radius: .5rem;
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_simple time {
		min-width: 8rem;
		display: inline-block;
		color: var(--sl-fonttrs);
	}

	/* Info über den Nachrichten-Ersteller wird abgeschwächt */
	.mod_newslist .info, .mod_newsreader .info {
		color: var(--sl-fonttrs);
	}
	
	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_short .info {
		margin-top: 0;
		font-size: var(--sl-fontsml);
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_short h2 {
		font-size: calc(1.3 * var(--sl-fontdef));
		margin-top: var(--sl-fontdef);
		margin-bottom: 0;
	}

	/* Zeitformatierung bei Nachrichtenlisten */
	.mod_newslist .layout_short .more {
		margin-top: 0;
		margin-bottom: 0;
	}

	/* Der Backlink aus den Artikeln wird abgesetzt */
	.mod_newsreader .back, .mod_newsreader .content-downloads {
		border-top: 1px solid var(--sl-highlgt);
	}

	/* Rahmen um beigefügte Anlagen in Artikeln wird gesetzt */
	.mod_newsreader .content-downloads {
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
	}

	/* Rahmen um beigefügte Anlagen in Artikeln wird gesetzt */
	.mod_newsreader .content-downloads strong {
		border-bottom: 1px solid var(--sl-highlgt);
		padding: var(--sl-fontdef);
		display: block;
	}

	/* Rahmen um beigefügte Anlagen in Artikeln wird gesetzt */
	.mod_newsreader .content-downloads ul {
		margin: var(--sl-fontdef);
	}

	/* Absetzung des Zurück-Links im Newsreader */
	.mod_newsreader .back a {
		margin-top: var(--sl-fontdef);
		display: block;
	}
	
	/* Rahmen um Kartenelement setzen */
	.mod_c4g_maps {
		margin-top: var(--sl-fontdef);
		margin-bottom: var(--sl-fontdef);
	}

	/* Rahmen um Kartenelement setzen */
	.mod_c4g_maps .c4g_map {
		max-height: 90vh;
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		overflow: hidden;
	}
		
	/* Consent-Text wird formatiert */
	.mod_c4g_maps .cc-module {
		padding: 0 var(--sl-fontdef) var(--sl-fontdef) var(--sl-fontdef);
	}

	/* Consent-Button wird formatiert */
	.mod_c4g_maps .cc-module button {
		border: 1px solid var(--sl-highcol);
		background-color: var(--sl-highlgt);
		color: var(--sl-highcol);
		outline: none;
		padding: calc(var(--sl-fontdef) * .75) var(--sl-fontdef);
		border-radius: .5rem;
		font-size: var(--sl-fontdef);
    }

	/* Consent-Button wird formatiert */
	.mod_c4g_maps .cc-module button:hover, .mod_c4g_maps .cc-module button:focus, .mod_c4g_maps .cc-module button:active {
		cursor: pointer;
		color: var(--sl-fontcol);
		background-color: var(--sl-fehlcol);
	}

	/* Darstellung eines Infoblocks - gegebenenfalls mit Bild */
	.vcard {
		display: inline-grid;
		grid-auto-flow: column;
		grid-template-columns: max-content auto;
		margin-right: 2rem;
		vertical-align: top;
	}
	
	/* Weißer Hintergrund mit Rahmen für Bilder mit Transparenz */
	.bildback img {
		background-color: #fff;
		padding: 5px;
		border-radius: .5rem;
	}
	
	/* Auflistung von Unterpunkten in Hauptinhalten (nur Navigation) */
	.mainsub ul {
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
	}
	
	/* Formatierung der einzelnen Listeneinträge in Untermenüs */
	.mainsub ul li {
		padding: calc(var(--sl-fontdef) * 0.75) var(--sl-fontdef);
		border-bottom: 1px solid var(--sl-highlgt);
		line-height: 175%;
	}
	
	/* Formatierung des letzten Eintrags in einem Untermenü */
	.mainsub ul li:last-child {
		border-bottom: 0;
	}
	
	/* Galeriansicht von Bildern im Vordergrund */
	#colorbox, #cboxOverlay {
		z-index: 20000;
	}
	
}


@media screen {

	/* ------------------------------------------------ */
	/* Darstellung im Kopfbereich der Seite formatieren */
	/* ------------------------------------------------ */

	/* Header für Kontrast mit dunklem Hintergrund versehen */
	#header {
		background-color: #000;
	}

	/* Logo in der Kopfzeile */
	.header_logo {
		position: absolute;
		top: var(--sl-headtop);
		left: var(--sl-leerbox);
		padding: 0;
		text-align: left;
	}

	/* Link im Header */
	.header_logo a {
		text-decoration: none;
	}
	
	/* Positionierung des Wappens */
	.header_wappen {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		padding: 0;
		z-index: 3500;
	}

	/* Größe für Stadtwappen wird definiert */
	.header_wappen img {
		max-width: calc(2.5rem + 4.5vw);
		height: calc(2.5rem + 4.5vw);
		border: 0;
	}
	
	/* Positionierung der Schrift */
	.header_schrift {
		position: relative;
		display: inline-block;
		margin-left: calc(.5rem + 1vw);
		vertical-align: middle;
		padding: 0;
		z-index: 3505;
	}
	
	/* Schriftzug Stadt wird formatiert */
	.header_stadt {
		margin-bottom: calc(-.5rem + -1vw);
		padding-left: calc(1rem + 1.75vw);
		font: calc(.75rem + 1.75vw) WebVijaya,WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		font-weight: normal;
		text-decoration: none;
		color: #fff;
		text-shadow: 2px 2px 5px #000;
	}
	
	/* Schriftart für Logos wird festgelegt */
	.header_laufen {
		font: calc(1.75rem + 3.25vw) WebVijaya,WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		font-weight: normal;
		text-decoration: none;
		color: #fff;
		text-shadow: 2px 2px 5px #000;
	}
	
	/* Schriftart für Motto wird festgelegt */
	.header_motto {
		position: relative;
		margin-top: calc(.15rem + .25vw);
		font: calc(.5rem + 1.5vw) WebVijaya,WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		font-weight: normal;
		text-decoration: none;
		color: #fff;
		text-shadow: 2px 2px 5px #000;
		white-space: nowrap;
		z-index: 3510;
	}

	/* Positionierung des Banners im Anfangsbereich der Seite */
	.startbanner, .content-swiper {
		position: relative;
		font-size: 0;
	}
	
	/* Breite der Bilder im Swiper und im Anfangsbereich werden auf 100 % gesetzt */
	.content-swiper .content-image img,
	.startbanner .content-image img {
		width: auto;
		height: auto;
		min-width: 100%;
		min-height: 30vh;
		object-fit: cover;
		margin: 0;
		border: 0;
		border-radius: 0;
	}

	/* Darstellung der Unterschriften bei Bildbeschreibungen in Swiper und Anfangsbereich */
	.content-swiper .content-image figcaption,
	.startbanner .content-image figcaption {
		bottom: 0;
		position: absolute;
		display: block;
		box-sizing: border-box;
		font-size: calc(.45rem + .45vw);
		line-height: 175%;
		background-color: var(--sl-fontcol);
		background-color: var(--sl-fonttrs);
		font-weight: normal;
		color: var(--sl-backcol);
		text-align: left;
		width: 100%;
		margin: 0;
	}

	/* Seitenränder für Caption von Swiper begrenzen werden Seitenwechsler */
	.content-swiper .content-image figcaption {
		padding: calc(.45rem + .45vw) calc(2.5 * var(--sl-leerbox) + 1vw) calc(.45rem + .45vw) var(--sl-leerbox);
	}

	/* Seitenränder für Caption von Einzelbildern erweitern */
	.startbanner .content-image figcaption {
		padding: calc(.45rem + .45vw) var(--sl-leerbox) calc(.45rem + .45vw) var(--sl-leerbox);
	}
	
	/* Darstellung des Seitenwechslers */
	.content-swiper .swiper-pagination {
		position: absolute;
		width: calc(1.5* var(--sl-leerbox));
		padding: 0;
		margin: 0;
		font-size: calc(.45rem + .45vw);
		line-height: 175%;
		text-align: right;
		box-sizing: border-box;
		top: auto;
		bottom: calc(.45rem + .45vw);
		right: var(--sl-leerbox);
		left: auto;
    }

	/* Darstellung des Seitenwechslers */
	.content-swiper .swiper-pagination-bullet {
		background-color: var(--sl-backcol);
		background-color: var(--sl-backtrs);
		opacity: 1;
		width: calc(.25rem + .25vw);
		height: calc(.25rem + .25vw);
	}

	/* Darstellung des Seitenwechslers */
	.content-swiper .swiper-pagination-bullet-active {
		background-color: var(--sl-overcol);
	}

	/* Steuerelemente für Blättern formatieren */
	.content-swiper button {
		width: calc(2rem + 2vw);
		height: 100%;
		margin: 0;
		padding: 0;
		background-color: transparent;
		border: 0;
	}

	/* Steuerelemente für Blättern formatieren */
	.content-swiper button::after {
		display: none;
	}

	/* Steuerelemente für Blättern formatieren */
	.content-swiper .swiper-button-prev {
		left: 0;
		right: auto;
		top: 0;
	}

	/* Steuerelemente für Blättern formatieren */
	.content-swiper .swiper-button-next {
		right: 0;
		left: auto;
		top: 0;
	}

}


/* ----------------------------------------------- */
/* Darstellung im Fußbereich der Seite formatieren */
/* ----------------------------------------------- */

@media screen {

	/* Panel der Cookiebar (Consent-Tool) wird formatiert */
	.contao-cookiebar .cc-inner {
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		outline: none;
		background-color: var(--sl-backcol);
		color: var(--sl-fontcol);
		box-shadow: none;
		padding: var(--sl-fontdef);
	}

	/* Die Cookie-Gruppe wird formatiert */
	.contao-cookiebar .cc-group {
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		margin-bottom: var(--sl-fontsml);
		background-color: var(--sl-highlgt);
		color: var(--sl-fontcol);
	}

	/* Die Schalterbeschriftung der Cookie-Gruppe wird formatiert */
	.contao-cookiebar .cc-group label {
		margin: 0 0 0 var(--sl-fontsml);
		padding-top: calc(var(--sl-fontsml) * .75);
		padding-bottom: calc(var(--sl-fontsml) * .5);
	}

	/* Der Detail-Button der Cookie-Gruppe wird formatiert */
	.contao-cookiebar .cc-detail-btn {
		margin: 0;
		padding: calc(var(--sl-fontsml) * .5) var(--sl-fontsml);
		color: var(--sl-highcol);
		text-decoration: none;
	}

	/* Die Häkchen-Boxen werden neu positioniert mittels Abstand */
	.contao-cookiebar input + label::before, .contao-cookiebar input + label::after {
		margin-top: 3px;
	}
	
	/* Cookie-Block (Gruppe) wird formatiert */
	.contao-cookiebar .cc-cookies {
		background-color: var(--sl-backcol);
		color: var(--sl-fontcol);
		border-radius: 0 0 .5rem .5rem;
	}
	
	/* Beschreibung des Cookie-Blocks wird formatiert */
	.contao-cookiebar .cc-cookies > p {
		border-top: 0;
		padding: calc(var(--sl-fontsml) * .75) var(--sl-fontsml);
		background-color: var(--sl-highlgt);
	}
	
	/* Jede Cookie-Beschreibung wird durch eine Trennlinie abgesetzt */
	.contao-cookiebar .cc-cookie {
		border-top: 1px solid var(--sl-highlgt);
		padding: 0 var(--sl-fontsml) calc(var(--sl-fontsml) * .75) var(--sl-fontsml);
	}
	
	/* Die Blöcke innerhalb einer Cookie-Beschreibung werden formatiert */
	.contao-cookiebar .cc-cookie > label, .contao-cookiebar .cc-cookie > p, .contao-cookiebar .cc-cookie > div {
		margin: 0;
	}
	
	/* Ein Absatz nach den jeweiligen Cookie-Blöcken wird eingefügt */
	.contao-cookiebar .cc-cookie > p {
		margin-bottom: calc(var(--sl-fontsml) * .75);
	}

	/* Die Beschreibung der Cookies wird vormatiert */
	.contao-cookiebar .cc-cookie > .cc-cookie-desc {
		margin-top: calc(var(--sl-fontsml) * .75);
	}
	
	/* Der Infoblock der einzelnen Cookie-Einträge wird formatiert */
	.contao-cookiebar .cc-cookie-info {
		border: 1px solid var(--sl-highlgt);
		background-color: var(--sl-highlgt);
		color: var(--sl-fontcol);
		border-radius: .5rem;
		font-size: var(--sl-fontsml);
		padding: calc(var(--sl-fontsml) * .75) var(--sl-fontsml);
	}

	/* Darstellung des Detail-Info-Button je Cookie */
	.contao-cookiebar .cc-cookie-info + button.cc-detail-btn-details {
		padding-top: calc(var(--sl-fontsml) * .75);
		padding-bottom: 0;
		margin: 0;
		color: var(--sl-highcol);
		text-decoration: none;
	}

	/* Eingeklappte Einträge erhalten ein Symbol zum Aufklappen */
	.contao-cookiebar .cc-detail-btn::before, .contao-cookiebar .cc-detail-btn-details::before {
		display: inline-block;
	    content: '\f0d7';
	    font-family: AwesomeWeb;
	    font-weight: bold;
	    margin-right: calc(.5 * var(--sl-fontdef));
	}

	/* Aufgeklappte Einträge erhalten anderes Symbol */
	.contao-cookiebar .cc-detail-btn.cc-active::before, .contao-cookiebar .cc-detail-btn-details.cc-active::before {
		content: '\f0d8';
	}
	
	/* Standard für Blockformatierungen im Cookie-Banner */
	.contao-cookiebar p, .contao-cookiebar label, .contao-cookiebar .cc-groups, .contao-cookiebar .cc-footer, .contao-cookiebar .cc-info, .contao-cookiebar button {
		font-size: var(--sl-fontsml);
		color: var(--sl-fontcol);
		line-height: 175%;
	}

	/* Grundlegende Formatierung für Links im Cookie-Banner */
	.contao-cookiebar p a, .contao-cookiebar .cc-info a {
		color: var(--sl-highcol);
		text-decoration: underline;
	}

	/* Formatierungen für markierte Links */
	.contao-cookiebar p a:hover, .contao-cookiebar p a:focus, .contao-cookiebar p a:active,
	.contao-cookiebar .cc-info a:hover, .contao-cookiebar .cc-info a:focus, .contao-cookiebar .cc-info a:active {
		color: var(--sl-movecol);
		text-decoration: underline;
	}

	/* Andere Farbe bei externen Links */
	.contao-cookiebar p a[href^="http:"], .contao-cookiebar p a[href^="https:"] {
		color: var(--sl-fehllit);
    }

	/* Formatierungen für markierte Links */
	.contao-cookiebar p a[href^="http:"]:hover, .contao-cookiebar p a[href^="http:"]:focus, .contao-cookiebar p a[href^="http:"]:active,
	.contao-cookiebar p a[href^="https:"]:hover, .contao-cookiebar p a[href^="https:"]:focus, .contao-cookiebar p a[href^="https:"]:active {
		color: var(--sl-highcol);
	}

	/* Symbol vor Links */
	.contao-cookiebar p a::before, .contao-cookiebar .cc-info a::before {
		content: '\f015';
		font-family: AwesomeWeb;
		font-weight: bold;
		display: inline-block;
		padding-left: calc(.25 * var(--sl-fontsml));
		padding-right: calc(.5 * var(--sl-fontsml));
		text-decoration: none;
		margin: 0;
    }

	/* Symbol vor Nachrichtenbeiträgen */
	.contao-cookiebar p a[href^="/einzelartikel/"]::before {
		content: '\f15c';
    }

	/* Symbol vor externen Links */
	.contao-cookiebar p a[href^="http:"]::before, .contao-cookiebar p a[href^="https:"]::before {
		content: '\f2f5';
    }

	/* Symbol vor E-Mail-Links */
	.contao-cookiebar p a[href^="mailto:"]::before {
		content: '\f0e0';
	}
	
	/* Symbol vor Telefon-Links */
	.contao-cookiebar p a[href^="tel:"]::before {
		content: '\f095';
	}
	
	/* Infoblock unter den Cookie-Einstellungen */
	.contao-cookiebar .cc-info {
		margin-top: var(--sl-fontsml);
	}
	
	/* Absatzblock im Infobereich des Consent-Tools */
	.contao-cookiebar .cc-info p {
		margin: 0;
	}
	
	/* Links im Infobereich des Consent-Tools */
	.contao-cookiebar .cc-info a {
		margin: 0 var(--sl-fontsml) 0 0;
	}
	
	/* Letzter Link ohne Abstand */
	.contao-cookiebar .cc-info a:last-child {
		margin: 0;
	}

	/* Aktionsbutton im Consent-Tool */
	.contao-cookiebar .cc-btn {
		padding: calc(var(--sl-fontsml) * .5) var(--sl-fontsml);
		border: 1px solid var(--sl-highcol);
		border-radius: .5rem;
		background-color: var(--sl-highlgt);
		color: var(--sl-highcol);
		margin: 0 calc(var(--sl-fontsml) * .5);
		font-size: var(--sl-fontsml);
	}
	
	/* Aktionsbutton im Consent-Tool */
	.contao-cookiebar .cc-btn:hover, .contao-cookiebar .cc-btn:focus, .contao-cookiebar .cc-btn:active {
		background-color: var(--sl-fehlcol);
		color: var(--sl-fontcol);
	}

	/* Legende im Consent-Tool wird ausgeblendet */
	.contao-cookiebar legend {	
		display: none;
	}
	
	/* Footer-Block formatieren */
	#footer {
		background-color: var(--sl-highcol);
		color: var(--sl-backcol);
		font-size: var(--sl-fontsml);
		box-sizing: border-box;
		margin: 0;
 		padding: var(--sl-leerend) 0;
	}
	
	/* Textblöcke und Überschriften formatieren */
	#footer h2, #footer h3, #footer p {
		margin: 0;
		padding: 0;
	}
	
	/* Überschriften im Footer formatieren */
	#footer h2, #footer h3 {
		font-weight: bold;
	}
	
	/* Footer-Layout als Gitter darstellen */
	#footer > .inside {
		display: grid;
		row-gap: var(--sl-leerend);
	}
	
	/* Textblöcke im Footer ebenfalls als Gitter darstellen */
	#footer .rte {
		display: grid;
		column-gap: calc(.5rem + .5vw);
		row-gap: calc(.5rem + .5vw);
		grid-auto-flow: row;
	}
	
	/* Stadt Laufen Logo im Footer platzieren */
	.footer_logo {
		padding-left: var(--sl-leerbox);
	}

	/* Link im Footer formatieren */
	.footer_logo a {
		text-decoration: none;
	}
	
	/* Positionierung des Wappens */
	.footer_wappen {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		padding: 0;
	}

	/* Größe für Stadtwappen wird definiert */
	.footer_wappen img {
		max-width: calc(2.5rem + 4.5vw);
		height: calc(2.5rem + 4.5vw);
		border: 0;
	}
	
	/* Positionierung der Schrift */
	.footer_schrift {
		position: relative;
		display: inline-block;
		margin-left: calc(.5rem + 1vw);
		vertical-align: middle;
		padding: 0;
	}

	/* Schriftzug Stadt wird formatiert */
	.footer_stadt {
		margin-bottom: calc(-.5rem + -1vw);
		padding-left: calc(1rem + 1.75vw);
		font: calc(.75rem + 1.75vw) WebVijaya,WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		font-weight: normal;
		text-decoration: none;
		color: var(--sl-backcol);
		text-shadow: 2px 2px 5px var(--sl-fontcol);
	}
	
	/* Schriftart für Logos wird festgelegt */
	.footer_laufen {
		font: calc(1.75rem + 3.25vw) WebVijaya,WebFiraSans,Verdana,Arial,Helvetica,sans-serif;
		font-weight: normal;
		text-decoration: none;
		color: var(--sl-backcol);
		text-shadow: 2px 2px 5px var(--sl-fontcol);
	}
	
	/* Links im Kontaktebereich formatieren */
	.footer_kontakt a, .footer_copy a, #footer .mod_cookiebar_opener a {
		color: var(--sl-overlit);
	}
	
	/* Öffnungszeiten im Footer werden platziert */
	.footer_offen {
		padding-right: var(--sl-leerbox);
	}
	
	/* Zweispaltige Darstellung der Öffnungszeiten */
	.footer_offen .rte {
		grid-template-columns: max-content max-content;
	}
	
	/* Überschrift der Öffnungszeiten wird einspaltig */
	.footer_offen .rte h3 {
		grid-column-start: 1;
		grid-column-end: 3;
		margin: 0;
		padding: 0;
	}

	/* Verweise im Footer werden platziert */
	.footer_verweise {
		padding-right: var(--sl-leerbox);
		align-items: center;
		display: grid;
		grid-auto-flow: column;
		grid-auto-columns: min-content;
		grid-column-gap: calc(1rem + 1vw);
	}

	/* Die Beschriftung der Verweise-Buttons wird ausgeblendet */
	.footer_verweise a {
		display: grid;
		grid-template-columns: min-content 0;
		align-items: center;
		text-decoration: none;
		overflow: hidden;
		color: var(--sl-overlit);
		font-size: calc(1rem + 1vw);
	}

	/* Die Farbe der Buttons beim Überfahren ändert sich */
	.footer_kontakt a:hover, .footer_kontakt a:focus, .footer_kontakt a:active,
	.footer_verweise a:hover, .footer_verweise a:focus, .footer_verweise a:active,
	.footer_copy a:hover, .footer_copy a:focus, .footer_copy a:active,
	#footer .mod_cookiebar_opener a:hover, #footer .mod_cookiebar_opener a:focus, #footer .mod_cookiebar_opener a:active {
		color: var(--sl-overcol);
	}

	/* Der E-Mail-Button erhält ein Symbol */
	.footer_email a::before {
		content: '\0040';
		font-family: AwesomeWeb;
		font-weight: bold;
	}

	/* Der Facebook-Button erhält ein Symbol */
	.footer_facebook a::before {
		content: '\f09a';
		font-family: AwbrandWeb;
		font-weight: normal;
	}

	/* Der Kummerkasten-Button erhält ein Symbol */
	.footer_kummer a::before {
		content: '\f01c';
		font-family: AwesomeWeb;
		font-weight: bold;
	}

	/* Der Online-Dienste-Button erhält ein Symbol */
	.footer_service a::before {
		content: '\f07a';
		font-family: AwesomeWeb;
		font-weight: bold;
	}

	/* Der Privatsphäre-Button erhält ein Symbol */
	#footer .mod_cookiebar_opener a::before {
		content: '\f3ed';
		font-family: AwesomeWeb;
		font-weight: bold;
	}

	/* Copyright-Hinweis im Footer wird platziert */
	.footer_copy {
		padding-left: var(--sl-leerbox);
		padding-right: 0;
		font-size: var(--sl-fontsml);
	}

	/* Copyright-Hinweis im Footer wird platziert */
	#footer .mod_cookiebar_opener {
		padding-left: 0;
		padding-right: var(--sl-leerbox);
		font-size: var(--sl-fontsml);
	}

	/* Die Navigation im Fußbereich wird formatiert */
	.footer_navi {
		padding-left: var(--sl-leerbox);
	}

	/* Unsichtbare Links zum Überspringen der Navigation werden formatiert */
	.footer_navi .invisible {
		background-color: var(--sl-backcol);
		color: var(--sl-highcol);
	}
	
	/* Die oberste Ebene der Navigation im Footer-Bereich wird formatiert */
	.footer_navi .level_1 {
		display: inline-block;
		text-align: center;
		box-sizing: border-box;
		margin: calc(.5rem + .5vw) 0;
		padding: calc(.25rem + .25vw);
		font-size: 0;
		background-color: var(--sl-backcol);
		color: var(--sl-highcol);
		border-radius: var(--sl-rounded);
	}

	/* Die Navigationseinträge im Footer werden nebeneinander angezeigt */
	.footer_navi .level_1 > li {
		text-align: center;
		display: inline-block;
	}

	/* Die Einträge in der obersten Ebene der Navigation werden formatiert */
	.footer_navi .level_1 > li > a,
	.footer_navi .level_1 > li > strong {
		padding: calc(.25rem + .25vw) calc(.5rem + .5vw);
		margin: 0;
		color: var(--sl-highcol);
		font-size: var(--sl-fontsml);
		text-decoration: none;
		text-align: left;
		white-space: nowrap;
		outline: none;
		display: block;
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a::before,
	.footer_navi .level_1 > li > strong::before {
		font-family: AwesomeWeb;
		font-weight: bold;
		padding-right: calc(.25rem + .25vw);
		display: inline-block;
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a.impressum::before,
	.footer_navi .level_1 > li > strong.impressum::before {
		content: '\e0bb';
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a.datenschutz::before,
	.footer_navi .level_1 > li > strong.datenschutz::before {
		content: '\f505';
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a.barriere::before,
	.footer_navi .level_1 > li > strong.barriere::before {
		content: '\e2ce';
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a.sitemap::before,
	.footer_navi .level_1 > li > strong.sitemap::before {
		content: '\f0e8';
	}

	/* Ein Symbol für den Navigationsbutton wird eingefügt */
	.footer_navi .level_1 > li > a.suche::before,
	.footer_navi .level_1 > li > strong.suche::before {
		content: '\f002';
	}

	/* Die aktiven Einträge in der obersten Ebene der Navigation werden gesondert formatiert */
	.footer_navi .level_1 > li > .active,
	.footer_navi .level_1 > li > .trail {
		color: var(--sl-movecol);
		font-weight: bold;
	}

	/* Die Einträge in der obersten Ebene der Navigation werden beim fokussieren gesondert formatiert */
	.footer_navi .level_1 > li:hover > a, .footer_navi .level_1 > li:focus > a, .footer_navi .level_1 > li:focus-within > a, .footer_navi .level_1 > li:active > a {
		color: var(--sl-movecol);
		text-decoration: underline;
	}

	/* Die Einträge in der obersten Ebene der Navigation werden beim fokussieren gesondert formatiert */
	.footer_navi .level_1 > li:hover > a::before, .footer_navi .level_1 > li:focus > a::before, .footer_navi .level_1 > li:focus-within > a::before, .footer_navi .level_1 > li:active > a::before {
		text-decoration: none;
	}

}

/* ----------------------------------- */
/* Optimierung für Mobil-Darstellung */
/* ----------------------------------- */

@media screen and (max-width: 1024px) {
	
	/* Alle Inhalte im Footer werden mittig ausgerichtet */
	#footer {
		text-align: center;
	}

	/* Die einspaltige Darstellung wird für die mobile Darstellung vorgegeben */
	#footer > .inside {
		column-gap: calc(1rem + 1vw);
		row-gap: var(--sl-leerend);
		grid-template-columns: auto auto;
		grid-auto-flow: row;
	}

	/* Die Textblöcke im Footer-Bereich werden mittig ausgerichtet (Grid) */
	#footer .rte {
		justify-self: center;
	}

	/* Seitlicher Abstand in der mobilen Darstellung wird gesetzt */
	.footer_logo, .footer_navi {
		padding-left: var(--sl-leerbox);
		padding-right: var(--sl-leerbox);
	}
	
	/* Schriftzug muss linksbündig bleiben, sonst stimmen die Positionierungen nicht mehr */
	.footer_schrift {
		text-align: left;
	}
	
	/* Bei Zweispaltiger Darstellung Kontakt rechtsbündig anzeigen */
	.footer_kontakt {
		padding-left: var(--sl-leerbox);
		text-align: right;
		justify-self: end;
	}

	/* Bei zweispaltiger Darstellung Öffnungszeiten linksbündig anzeigen */
	.footer_offen {
		text-align: left;
		justify-self: start;
	}

	/* Die Verweise werden mittig ausgerichtet (Grid) */
	.footer_verweise {
		justify-self: center;
		padding-left: var(--sl-leerbox);
	}

	/* Bei zu schmaler Darstellung wird das Copyright seitlich begrenzt */
	.footer_copy, #footer .mod_cookiebar_opener {
		padding-left: 4rem;
		padding-right: 4rem;
	}

	/* Der Mail-Link wird nicht umgebrochen */
	.footer_copy a, #footer .mod_cookiebar_opener a {
		display: inline-block;
		white-space: nowrap;
	}
	
	/* Die Navigation im Footer wird über zwei Spalten gezogen */
	.footer_navi, .footer_copy, .footer_verweise, .footer_logo, #footer .mod_cookiebar_opener {
		grid-column: span 2;
	}

}

@media screen and (max-width: 512px) {
	
	/* Footer-Block formatieren */
	#footer {
		margin-bottom: calc(4rem + 2vw);
	}
	
	/* Die einspaltige Darstellung wird für die mobile Darstellung vorgegeben */
	#footer > .inside {
		grid-template-columns: auto;
		grid-auto-flow: row;
	}

	/* Bei einspaltiger Darstellung zentrierte Positionierung */
	.footer_kontakt, .footer_offen {
		text-align: center;
		justify-self: center;
		padding-left: var(--sl-leerbox);
		padding-right: var(--sl-leerbox);
	}

	/* Die Navigation im Footer wird über zwei Spalten gezogen */
	.footer_navi, .footer_copy, .footer_verweise, .footer_logo, #footer .mod_cookiebar_opener {
		grid-column: 1;
	}

}

/* ----------------------------------- */
/* Optimierung für Desktop-Darstellung */
/* ----------------------------------- */

@media screen and (min-width: 1025px) {

	/* Eine dreispaltige Darstellung wird am Desktop vorgegeben */
	#footer > .inside {
		column-gap: calc(1rem + 1vw);
		grid-template-columns: auto auto auto;
	}

	/* Das Copyright wird über alle drei Spalten gezogen */
	.footer_copy {
		grid-column: span 2;
	}

	/* Die Navigation im Footer wird über zwei Spalten gezogen */
	.footer_navi {
		grid-column: span 2;
	}

}