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}
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%}
/**
 * CLICKPRESS CSS-Grid
 * @author: Stefan Schulz-Lauterbach
 *
 * thanks to Dinko Skopljak for co-working
 */
.justify-items-start {
  justify-items: start;
}

.justify-items-center {
  justify-items: center;
}

.justify-items-end {
  justify-items: end;
}

.justify-items-stretch {
  justify-items: stretch;
}

.content-start {
  align-content: start;
}

.content-center {
  align-content: center;
}

.content-end {
  align-content: end;
}

.items-start {
  align-items: start;
}

.items-center {
  align-items: center;
}

.items-end {
  align-items: end;
}

.items-stretch {
  align-items: stretch;
}

.items-baseline {
  align-items: baseline;
}

[class*=grid_] {
  display: grid;
  grid-gap: 1rem;
}
[class*=grid_] > .block {
  margin-bottom: 0;
}

@media (min-width: 576px) {
  .grid_mobile_100 {
    grid-template-columns: 1fr;
  }
  .grid_mobile_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_mobile_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_mobile_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_mobile_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_mobile_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_mobile_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_mobile_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_mobile_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_mobile_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_mobile_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_mobile_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_mobile_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_mobile_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_mobile_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_mobile_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .gap_mobile_0 {
    grid-gap: 0;
  }
  .gap_mobile_1 {
    grid-gap: 1rem;
  }
  .gap_mobile_2 {
    grid-gap: 2rem;
  }
  .gap_mobile_3 {
    grid-gap: 3rem;
  }
  .gap_mobile_4 {
    grid-gap: 4rem;
  }
  .gap_mobile_5 {
    grid-gap: 5rem;
  }
  .gap_mobile_6 {
    grid-gap: 6rem;
  }
  .gap_mobile_7 {
    grid-gap: 7rem;
  }
  .gap_mobile_8 {
    grid-gap: 8rem;
  }
  .gap_mobile_9 {
    grid-gap: 9rem;
  }
  .gap_mobile_10 {
    grid-gap: 10rem;
  }
  .gap_mobile_11 {
    grid-gap: 11rem;
  }
  .gap_mobile_12 {
    grid-gap: 12rem;
  }
}
@media (min-width: 768px) {
  .grid_tablet_100 {
    grid-template-columns: 1fr;
  }
  .grid_tablet_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_tablet_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_tablet_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_tablet_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_tablet_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_tablet_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_tablet_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_tablet_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_tablet_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_tablet_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_tablet_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_tablet_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_tablet_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_tablet_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_tablet_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .grid_tablet_20_40_40 {
    grid-template-columns: 1fr 2fr 2fr;
  }
  .grid_tablet_40_20_40 {
    grid-template-columns: 2fr 1fr 2fr;
  }
  .grid_tablet_40_40_20 {
    grid-template-columns: 2fr 2fr 1fr;
  }
  .gap_tablet_0 {
    grid-gap: 0;
  }
  .gap_tablet_1 {
    grid-gap: 1rem;
  }
  .gap_tablet_2 {
    grid-gap: 2rem;
  }
  .gap_tablet_3 {
    grid-gap: 3rem;
  }
  .gap_tablet_4 {
    grid-gap: 4rem;
  }
  .gap_tablet_5 {
    grid-gap: 5rem;
  }
  .gap_tablet_6 {
    grid-gap: 6rem;
  }
  .gap_tablet_7 {
    grid-gap: 7rem;
  }
  .gap_tablet_8 {
    grid-gap: 8rem;
  }
  .gap_tablet_9 {
    grid-gap: 9rem;
  }
  .gap_tablet_10 {
    grid-gap: 10rem;
  }
  .gap_tablet_11 {
    grid-gap: 11rem;
  }
  .gap_tablet_12 {
    grid-gap: 12rem;
  }
}
@media (min-width: 992px) {
  .grid_desktop_100 {
    grid-template-columns: 1fr;
  }
  .grid_desktop_50_50 {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_33_33_33 {
    grid-template-columns: repeat(3, 1fr);
  }
  .grid_desktop_75_25 {
    grid-template-columns: 3fr 1fr;
  }
  .grid_desktop_25_75 {
    grid-template-columns: 1fr 3fr;
  }
  .grid_desktop_66_33 {
    grid-template-columns: 2fr 1fr;
  }
  .grid_desktop_60_40 {
    grid-template-columns: 3fr 2fr;
  }
  .grid_desktop_40_60 {
    grid-template-columns: 2fr 3fr;
  }
  .grid_desktop_33_66 {
    grid-template-columns: 1fr 2fr;
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_desktop_50_25_25 {
    grid-template-columns: 2fr 1fr 1fr;
  }
  .grid_desktop_25_50_25 {
    grid-template-columns: 1fr 2fr 1fr;
  }
  .grid_desktop_25_25_50 {
    grid-template-columns: 1fr 1fr 2fr;
  }
  .grid_desktop_40_30_30 {
    grid-template-columns: 4fr 3fr 3fr;
  }
  .grid_desktop_30_40_30 {
    grid-template-columns: 3fr 4fr 3fr;
  }
  .grid_desktop_30_30_40 {
    grid-template-columns: 3fr 3fr 4fr;
  }
  .grid_desktop_20_40_40 {
    grid-template-columns: 1fr 2fr 2fr;
  }
  .grid_desktop_40_20_40 {
    grid-template-columns: 2fr 1fr 2fr;
  }
  .grid_desktop_40_40_20 {
    grid-template-columns: 2fr 2fr 1fr;
  }
  .grid_desktop_25_25_25_25 {
    grid-template-columns: repeat(4, 1fr);
  }
  .grid_desktop_40_20_20_20 {
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
  .grid_desktop_20_40_20_20 {
    grid-template-columns: 1fr 2fr 1fr 1fr;
  }
  .grid_desktop_20_20_40_20 {
    grid-template-columns: 1fr 1fr 2fr 1fr;
  }
  .grid_desktop_20_20_20_40 {
    grid-template-columns: 1fr 1fr 1fr 2fr;
  }
  .grid_desktop_20_20_20_20_20 {
    grid-template-columns: repeat(5, 1fr);
  }
  .gap_desktop_0 {
    grid-gap: 0;
  }
  .gap_desktop_1 {
    grid-gap: 1rem;
  }
  .gap_desktop_2 {
    grid-gap: 2rem;
  }
  .gap_desktop_3 {
    grid-gap: 3rem;
  }
  .gap_desktop_4 {
    grid-gap: 4rem;
  }
  .gap_desktop_5 {
    grid-gap: 5rem;
  }
  .gap_desktop_6 {
    grid-gap: 6rem;
  }
  .gap_desktop_7 {
    grid-gap: 7rem;
  }
  .gap_desktop_8 {
    grid-gap: 8rem;
  }
  .gap_desktop_9 {
    grid-gap: 9rem;
  }
  .gap_desktop_10 {
    grid-gap: 10rem;
  }
  .gap_desktop_11 {
    grid-gap: 11rem;
  }
  .gap_desktop_12 {
    grid-gap: 12rem;
  }
}

/*# sourceMappingURL=clickpress-grid.css.map */

#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}
.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}
/** CSS definitions: colors, fonts, widths - LEUCHTIE **/

:root {
	
    /* font definitions */
    --mainfont: Arial, sans-serif;
	
	/* Color used inside the content */
	--background: rgba(0,0,51,1); /* #000033; */
	--headerback: rgba(0,0,51,1);
	--mainback: rgba(99,184,255,0.1);
	--mainborder: rgba(53,76,106,1); /* #354c6a; */
    --fontcolor: rgba(255,255,255,1);
    --h1h4color: rgba(255,215,0,1);
    --linkcolor: rgba(255,215,0,1); /* #ffd700; */
    --footerback: rgba(0,0,51,1);
    --linknavifootercolor: rgba(255,255,255,1);
	--kachelborder: 1px solid none;
	--kachelbackground: rgba(99,184,255,0.1);
	
	/* Navigation */
	--linknavicolor: rgba(255,215,0,1);
    --navback:  rgba(0,0,51,1);
    --navback2: rgba(92,126,161,1); /* #5c7ea1; */	
	
	--mobilnavibackground: rgba(0,0,51,1);
    --mobilenaviborder: rgba(0,0,51,1);
	
    /* Accordeon colors */
    --accordeonheader: rgba(255,191,0,1);
    --accordeonhover: #46607a;
    --accordeonback: rgba(92,126,161,1);
    --accordeonborder: 1px solid rgba(92,126,161,1);
	
	/* Bilder */
	--captionbackground: rgba(0,0,0,0.5);
    --captioncolor: rgba(236,201,62,1);
	--imgborder: 1px solid rgba(0,0,0,1);
	
    /* images */
    --backgroundimage: url("/files/theme/img/leuchthalsband-leuchtie-led-hund-hintergrund.jpg");
	
	/* Size definitions */
    --maxwidth: 80%; /* 1490px; */
    --maxheight: 600px;
	
	/* Suchen */
	
	--searchboxborder: 1px solid none;
	--searchboxback: rgba(99,184,255,0.1);
	--searchheaderback: rgba(92,126,161,1);
	--searchheadertext: rgba(255,215,0,1);
	--searchtext: rgba(236,201,62,1);
	
	--buttonback: rgba(92,126,161,1); /* #5c7ea1; barrierefrei #2b425e; */
    --buttonbackhover: rgba(52,103,64,1); /* #346740; */
	
	/* Slider */
    --slider-border: 1px solid rgba(70, 96, 122, 1); /* #46607a; */
    --slider-background: rgba(99, 184, 255, 0.1);
	
	/* FAQ */
	
	--faq-ul-color: rgba(255,255,255,1);
}

/* 10-mobile.css Stand: 08.05.2023
/** CSS Grundgerüst mobiles Layout Contao 5 **/

body {
	font-family: var(--mainfont);
	font-size: 1em;
	font-weight: 400;
	line-height: 1.5;
	background-color: var(--background);
	color: var(--fontcolor);
	background-image: var(--backgroundimage);
	background-repeat:no-repeat;
	background-position: center; background-attachment: fixed;
}

html {
	overflow-y: scroll;
	height: 100%;
	font-size: 16px;
	line-height: 24px;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

/* Adapt boxmodel */

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

*:before,
*:after{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* general elements and paddings/margins */

p, ul, ol, pre, table, blockquote {
    margin-top: 0em;
    margin-bottom: 1em;
}

/* Blocksatz gewünscht:
p {
	text-align: justify;
}*/

ul ul, ol ol, ul ol, ol ul {
    margin-top: 0em;
    margin-bottom: 0em;
}

ul {
    list-style: disc;
}

ol {
    list-style: decimal;
}

li {
    margin-left: 2em;
}

h1, h2, h3, h4 {
	line-height: 1.5;
	color: var(--h1h4color);
}

/* Links */
a,
a:visited {
	color: var(--linkcolor);
	text-decoration: underline;
}
a:hover,
a:focus,
a:active {
	color: var(--linkcolor);
    outline: 0;
}

#container {
	padding: 0 0.2em;
}

#wrapper {
	width: 100%;
	max-width: unset;
	margin: 0 auto;
	/* background-color: var(--wrapperback); normal nicht nötig */
}

#header {
	background-color: var(--headerback);
	margin: 0 0 1em 0;
	padding: 0.5em 0;
}

/* fester Header */
#header {
	position: sticky;
    z-index: 1001;
    top: 0;
}

#main {
	background-color: var(--mainback);
	/* font-size: 1em; normal nicht nötig */
	/* line-height: 1.5; normal nicht nötig */
	/* color: var(--fontcolor); normal nicht nötig */
	border-radius: 5px;
	border: 1px solid var(--mainborder);
}

#main .inside {
	padding: 0 1em;
}

#footer {
	margin: 1.5em 0 0 0; 
	padding: 1.5em 2%;
	/* border-top: 1px solid var(--footerback); normal nicht nötig */
	color: var(--linknavifootercolor);
	background-color: var(--footerback);	
}

#footer a,
#footer a:hover,
#footer a:focus,
#footer a:active {
	color: var(--linknavifootercolor);
	text-decoration:underline;
}

/* Viewport max 767px */
@media screen and (max-width: 767px) {

}

/* Viewport min 768px */
@media screen and (min-width: 768px) {
	
}
/* 10b-desktop.css Stand: 26.04.2023*/
/** addition for header/footer full size **/

/* Viewport min 768px */

@media screen and (min-width: 768px) {
	
	/* Header center auf maxwidth */	
	#header .inside {
		margin: 0 auto;     
		max-width: var(--maxwidth);  
	}

	/* Footer center auf maxwidth */
	#footer .inside {
		max-width: var(--maxwidth);  
		margin: 0 auto;     
	}
	
    /* Container center auf maxwidth */
    #container {
        margin: 0 auto;
        max-width: var(--maxwidth);
        /* border-radius: 5px;
        background: var(--containerback);
		border: 1px solid var(--containerborder);*/
    } 
	
	/* main auf eine eine Mindesthöhe zu setzen */
	#main {
		min-height: var(--maxheight);
	}
	
}
/* 11a-nav-mobile.css Stand: 26.04.2023*/
/* Position of the menu button */

div.menubutton {
    width:100%;
    right:0;
    top:.2rem;
    position:relative;
    display:block;
    margin-bottom:.2em;
	padding-bottom: .2em;
    z-index: 10;
}

div.menubutton a.shownav:after {
	font-size: 0.7rem;
	content: " \25bc"
}

div.menubutton a.hidenav:after {
	font-size: 0.7rem;
	content: " \25b2"
}

div.menubutton a.hidenav {
	display: none;
}

/* Layout of the menu button */

div.menubutton a {
	display: block;
	margin: 0.1em;
	padding: 0.5rem;
	background-color: var(--mobilnavibackground);
	border: 1px solid var(--mobilenaviborder);
	border-radius: 0.25rem;
	text-decoration: none;
	color: var(--linknavicolor);
	behavior:url('assets/css3pie/1.0.0/PIE.htc');
}

/* header navigation */

#nav-main {
	margin: 0.2em;
	padding: 0;
    background-color: var(--mobilnavibackground);
    behavior: url('assets/css3pie/1.0.0/PIE.htc');
    transition: 1s;
}

#nav-main ul.level_1 {
	margin: 0;
	padding: 0;
	text-align: left;
}

#nav-main li {
    margin: 0;
    padding: 0 0.2em;
	border-top: 1px solid var(--mobilenaviborder);
	border-left: 1px solid var(--mobilenaviborder);
	border-right: 1px solid var(--mobilenaviborder);
    list-style-type: none;
}

#nav-main ul.level_2 {
	margin: 0;
	padding: 0 0 0 2rem;
	text-align: left;
}

#nav-main li:last-of-type {
    border-bottom: 0;
}

#nav-main li a,
#nav-main li span {
    display: block;
    padding: .1rem;
    text-align: left;
    background-color: var(--mobilnavibakbackground);
    text-decoration: none;
    color: var(--linknavicolor);
}

#nav-main a:hover,
#nav-main a:focus {
    text-decoration: underline;
}

#nav-main .active {
    background-color: var(--headerback);
    text-decoration: none;
    color: var(--linknavicolor);
}

/* create the menu that can be hidden */

#nav-main {
    max-height: 0;
}

#menu:target nav.mod_navigation {
    max-height:40rem;
}

#menu:target a.shownav {
    display:none;
}

#menu:target a.hidenav {
    display:block;
}

/* 11b-nav-desktop.css Stand: 26.04.2023*/
/** CSS one column, PC Screen **/

@media screen and (min-width: 768px) {
	
	/* remove menu button for responsive naviagtion */
	div.menubutton {
		display: none;
	}
	
	#nav-main {
		max-height: 58px;
		display: block;
		/*background-color: var(--nav-line-back);*/
		color: var(--linknavicolor);
		margin: 0 0 0 0;
	}

	#nav-main ul {
		width: auto;
		float: left;
		margin: 0;
		padding: 0;
		list-style: none;
		/*background-color: var(--nav-line-back);*/
	}
	
	#nav-main li {
		width: auto;
		float: left;
		margin: 0 0em 0 0em; 
		padding: 0 1em 0 1em; 
		border: 0px;
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
		background-color: var(--navback);
	}
	
	#nav-main li span, 
	#nav-main li a {
	    display: inline;
    	padding: 0;
		background-color: var(--navback);
		border: 0px;
	}
	
	#nav-main li:hover,
	#nav-main li:hover a,
	#nav-main li:hover a span,
	#nav-main li:hover strong {
		background-color: var(--navback2);
	}
	
	#nav-main li.active.submenu,
	#nav-main strong.active.submenu,
	#nav-main li.active,
	#nav-main strong.active {
		background-color: var(--navback2);
	}
	
	#nav-main .level_1 > li:hover,
	#nav-main .level_1 > li:hover > a,
	#nav-main .level_1 > li:hover > a span,
	#nav-main .level_1 > li:hover > strong,
	#nav-main .level_1 > li.active,
	#nav-main .level_1 > li.active > strong {
		background-color: var(--navback);
	}

	#nav-main a {
		background-color: var(--navback);
		display: block;
		line-height: 2rem;
		text-decoration: none;
		color: var(--linknavicolor);
	}

	#nav-main .active,
	#nav-main .trail {
		line-height: 2rem;
		border: 0px;
		color: var(--linknavicolor);
	}

	#nav-main .active strong{
		font-weight: bold;
	}
	
	#nav-main a:hover,
	#nav-main a:focus {
		color: var(--linknavicolor);
		background-color: var(--navback);
	}

	#nav-main .level_2 {
		width: 0;
		height: 0;
		position: absolute;
		left: -32768px;
		overflow: hidden;
		display: block;
	}
	
	#nav-main ul.level_2 {
		margin: 0;
		margin-left: -1em;
		padding: 1em 0 1em 0;
		text-align: left;
		border-bottom-right-radius: 5px;
		border-bottom-left-radius: 5px;
	}	
	
	#nav-main .level_2 li {
		clear: both;
		background-color: var(--navback2);
	}
	
	#nav-main .level_2 span {
		background-color: var(--navback2);
	}
	
	#nav-main li:hover .level_2 {
		width: auto;
		height: auto;
		min-width: 78px;
		left: auto;
		overflow: auto;
		display: block;
		background-color: var(--navback2);
		z-index: 1000;
	}

	#nav-main .level_2 .active,
	#nav-main .level_2 .trail {
		font-weight:bold;
		background-color: var(--navback2);
	}
		
	#nav-main .level_2 .sibling
	{
		font-weight: normal;
	}	
}

/* 20-accordeon.css Stand: 26.04.2023*/

/* Wenn das erste Accordion Elemente nicht offen sein soll, dann eintragen ins Template: j_accordion.html5: active: 'false', */

/* benutze Variablen:
	--accordeonheader: rgba(236,201,62,1);
    --accordeonhover: rgba(0,0,0,1);
    --accordeonback: rgba(113,12,19,1);
    --accordeonborder: 1px solid rgba(0,0,0,1);
	--accordeonarrow: "Font Awesome 5 Free"; --> optional bei anderen Symbolen
	
	Anzeige aktuell mit "+" und "-" fürs Aufklapp-Symbol 
	
	sollten Pfeile gewünscht werden, könnte man "Font Awesome 5 free" einbinden --> content symbole umschreiben
	zusätzlich Font Awesome installieren und im header <link href="/files/theme/fonts/awesome/css/all.min.css" rel="stylesheet"> auf Seitenlayout eintragen
*/

.ce_accordion {
	margin: 0.5em 0;
	border-radius: 0.5em;
	border: var(--accordeonborder);
}

.ui-accordion-content {
	padding: 0.25em 0.5em;
}

.ce_accordion .toggler {
	cursor: pointer;
	color: var(--accordeonheader);
	background: var(--accordeonback);
	outline: none;
	padding: 0.5em;
	font-weight: 700;	
}

.ce_accordion .toggler.active,
.ce_accordion .toggler:hover {
	background: var(--accordeonhover);
}

.ui-icon:before {
	/* font-family: var(--accordeonarrow); für Font Awesome */
	color: var(--accordeonheader);
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	width: 25px;
	text-align: center;
	/*content: '\f101';  für Font Awesome */
	content: '+';
}

.ui-accordion-header-active .ui-icon:before {
    /*content: '\f338';  für Font Awesome */
    content: '-';
}

/* 21-images.css Stand: 03.05.2023 */
/* Image formatting */

/* Bilder mit Rahmen ohne Abstand */
.img-rahmen img {
	border-radius: 7px;
	border: var(--imgborder);
}

.img-rahmen figcaption {
	line-height: 1.2;
	font-size: 0.875em;
	background-color: var(--captionbackground);
	text-align: center;
	padding: 0.3em;
	border-radius: 5px;
	color: var(--captioncolor);
	margin: -0.2em 0 0 0;
}

/* Linker und rechter Abstand zum Text bei Bildern bei Text mit Bild */
.float_left, .media--left>figure {
	margin-right: 1em;
}

.float_right, .media--right>figure  {
	margin-left: 1em;
}

/* Bilder in mobilem Layout prozentual anzeigen */
.img-mobile-80 img {
	width: 80%;
}

.img-mobile img {
	width: 100%;
	}

.img-center figure {
	text-align: center;
}

.img-no-caption figcaption {
	display: none;
}

.img-50-40 figure {
	max-width: 50%;
}

/* Viewport max 767px */
@media screen and (max-width: 767px) {

}

/* Viewport min 768px */
@media screen and (min-width: 768px) {

	.img-50-40 figure {
		max-width: 40%;
	}
	
}
/* 22-RockSolid-Slider.css Stand: 17.04.2024 */
/** Definitions for Image sliders, based on  RockSolid-Slider **/
/* CSS-Prefix rsts-box wird nur benötigt, wenn die Galerie als Kachel/Box verwendet wird. 
    Die Breite des Slider sollte auf "auto" gesetzt werden, damit sie sich der Breite besser anpasst */
	
/* Möchte man um den Slider inkl. Bilderleiste eine Rahmen, kann die CSS-Klasse "kachel" genutzt werden

/* wenn keine Bildunterschrift da seins soll, muss im Modul das CSS-Prefix auf rsts-no-caption geändert werden */
.rsts-box-slide p {
    display: none !important;
}

.rsts-text {
	padding: 0.5em;
}

.rsts-thumbs-view {
	padding: 0 0 0.5em 0;
}

/* Slider bei Grid ohne Text etc., muss nur die CSS-ID slider-grid gesetzt werden - dann geht es mit Clickpress Grid */

#slider-grid .rsts-caption,
#slider-grid .rsts-text,
#slider-grid .rsts-prev,
#slider-grid .rsts-next {
	display: none;
}

#slider-grid .rsts-slide {
    border-radius: 0.5em;
}

/* 88-sonderformate.css Stand: 04.05.2023 */

/* Überschrift ohne Top Abstand */

.h-top h2,
.h-top h3 {
	margin-top: 0;
}

/* Abstand zwischen Artikeln */
.mod_article {
	 margin-bottom: 1em;
}

/* Wenn Kachel nötig wird innerhalb einer seite */
.kachel {
	background: var(--kachelbackground);
	padding: 0.5em;
	border: var(--kachelborder);
	border-radius: 5px;	
	margin-bottom: 1em;
}

/* Buttons --> ungeschickte Bezeichnung - da es auch ein Standard CSS begriff ist - hängt dann auch mit Suchen Formular zusammen*/

.button a,
button {
    display: inline-block;
    padding: 0.5em 2.75em;
    background:	var(--buttonback);
    font-size: 1em;
    margin: 0.5em 0;
    text-align: center;
    color: var(--linknavicolor);
    font-weight: 700;
    text-decoration: none;
    border-radius: 5px;
    box-shadow: 0 1px 2px var(--boxshaddow);
    border: 0;
    transition: all 0.3s ease 0s;
}

.button a:hover,
.button a:focus,
button a:hover,
button a:focus {
    background-color: var(--buttonbackhover);
}

.button-center,
.text-center {
    text-align: center;
}

button {
    cursor: pointer;
}

/* Grid 100 % breit */

[class*=grid] {
    float: none;
}

/* Menü mit Unterseiten */
.mod_customnav {
	margin: 0.5em 0 !important;
	border-radius: 7px;
}
/* 99-print.css Stand: 26.04.2023*/
/* for printing, remove colors and backgrounds */

@media print {

    @page {
      size: A4;
    }
    
    #nav-main,
    #nav-mobile,
    #form-search,
    #footer .box-wrapper {
      display: none;
    }
    
    body {
      border: 0;
    }
    
    #wrapper {
      margin: 0;
    }
    
    #footer {
      border: 0;
      margin: 0;
    }
    
    #main a[href]:after {
      content: " (" attr(href) ")";
    }
    
}
    
