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%}
/*Roboto*/
@font-face {
  font-family: 'Roboto';
  src: url('/files/kimu/theme/fonts/Roboto-VariableFont_wdth,wght.ttf') format("truetype-variations");
  font-weight: 400;
}


:root {
  --font-base: 'Roboto', sans-serif; /*'Merriweather', serif; */
  --color-primary: #3e6b48;
  --color-secondary: #5D9364; /*#88a88c;*/
  --color-background: #f7f8f5;
  --color-text: #333;
  --color-text-invers: #FFFFFF;
  --color-accent: #b5caa0;
  --color-header: #ffffff;
  --color-footer: #88a88c;
  --border-radius: 8px;
  --spacing: 1rem 0rem 0rem 2rem;
  --color-veranstaltungen: #D20103; /*rot*/
  --color-brasshoppers: #62E32D; /*#56630C; /*grün*/
  --color-caminando: #1A11F2; /*blau*/
  --color-chorgemeinschaft: #CB8DDC; /*lila*/
  --color-kantorei: #5DE2E7; /*türkis*/
  --color-kammerorchester: #FFDE59; /*gelb*/
  --color-kinderchor: #FE9900; /*orange*/
}



/* Dark Mode */
@media (prefers-color-scheme: dark) {
  :root {
    --color-background: #455C48;/*#1e1e1e;*/
    --color-text: #e0e0e0;
    --color-primary: #7ecf94;
    --color-secondary: #b5e0c6;
    --color-accent: #4d7359;
	--color-header: #59705C;
  }

  body {
    background-color: var(--color-background);
    color: var(--color-text);
  }

  section, 
  /*header, nav, footer */
  {
    /*background-color: #2a2a2a;*/
	background-color: var(--color-background);
    color: var(--color-text);
  }

  a:hover {
    color: var(--color-secondary);
  }

  input, textarea {
    background-color: #333;
    color: var(--color-text);
    border-color: #555;
  }
}

@media (max-width:1200px) {
  :root {
	  --spacing: 0.5rem 0rem 0rem 0.5rem;
  }
}
	  
/* Reset & Basics */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-base);
  background-color: var(--color-background);
  color: var(--color-text);
  font-size: 16px;
  line-height: 1.6;
}

a {
  color: var(--color-primary);
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:not([href*="demo.local"]):not([href*="seeger-duesseldorf.de"]):not([href^="#"]):not([href^="/"]):not(.no-icon)::after {
/*  content: '\2197'; /* Code für ↗ */
/*  display: inline-block;
  margin-left: 5px;
  font-size: 0.9em;*/
  font-family: "Font Awesome 7 Free";
  font-weight: 900; /* Wichtig für "Solid" Icons */
  content: '\f35d'; /* Code für "arrow-up-right-from-square" */
  display: inline-block;
  margin-left: 5px;
  font-size: 0.9em;
}
a:hover {
  color: var(--color-secondary);
}

h1 {
	font-size: 1.5rem;
}
h2 {
	font-size: 1.3rem;
}

		.legende_1 > a {
			color: var(--color-veranstaltungen);
			background-color: var(--color-veranstaltungen);
			}
		.legende_2 > a {
			color: var(--color-brasshoppers);
			background-color: var(--color-brasshoppers);
			}
		.legende_3 > a {
			color: var(--color-caminando);
			background-color: var(--color-caminando);
			}
		.legende_4 > a {
			color: var(--color-chorgemeinschaft);
			background-color: var(--color-chorgemeinschaft);
			}
		.legende_5 > a {
			color: var(--color-kantorei);
			background-color: var(--color-kantorei);
			}
		.legende_6 > a {
			color: var(--color-kammerorchester);
			background-color: var(--color-kammerorchester);
			}
		.legende_7 > a {
			color: var(--color-kinderchor);
			background-color: var(--color-kinderchor);
			}

/* Header */
header {
  background-color: var(--color-header);
  padding: var(--spacing);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Navigation */
.menu-list li{
    list-style-type: none;
    margin-bottom: 0.5rem;
    font-size: 1.2rem;
    }
    .mod_navigation .invisible {
        display: none;
    }
@media (min-width:1200px) {
    .main-menu ul {
    list-style-type: none;
    text-align:right;
    padding: 0px 0px;
    }
    .main-menu li {
    display: inline;
    font-size: 1.2	rem;
    }
    .main-menu ul.level_2 {
    display: none;
    position:absolute;
    background: white;
    padding: 20px;
    }
    .main-menu li:hover ul.level_2 {
    display: block !important;
    } 
    .main-menu li:not(.last)::after {
        content: '|';
        padding: 0px 10px;
    }
    .main-menu ul.level_2 li {
        display: block !important; /*list-item !important;*/
        padding: 5px 0px;
		position:absolute;
		text-align:right;
		font-size: 1rem;
    }
    .main-menu ul.level_2 li::after {
        content: none !important;
    }
    .main-menu a {
        text-decoration: none;
        color: var(--color-primary);
    }
	.sub-menu ul {
		list-style-type: none;
		position:relative;
		text-align:right;
		padding: 0.3rem 0rem;
    }
    .sub-menu li {
		display: inline;
		font-size: 1.2rem;
    }
	.sub-menu li:not(.last)::after {
        content: '|';
        padding: 0px 10px;
    }
	.sub-menu a {
        text-decoration: none;
        color: var(--color-secondary);
    }
	.lvl3-menu ul {
		list-style-type: none;
		padding: 0.3rem 0rem;
    }
	.lvl3-menu li {
		display: block;
		font-size: 1.5rem;
    }
	.lvl3-menu a {
        text-decoration: none;
        color: var(--color-secondary);
    }
	
	.nav-footer ul {
		list-style-type: none
	}
	.nav-footer li {
		color: white; /*var(--color-background);*/
		display: inline;
		font-size: 1.2rem;
		padding: 0rem 1rem;
	}
	.nav-footer a:hover {
		color: white; /*var(--color-background);*/
	}
	/*.nav_footer li:not(.last)::after {
        color: var(--color-background);
		content: '|';
        padding: 0px 10px;
    }*/
}

@media (max-width:1199px) {
    .main-menu, .sub-menu, .menu-list {
    display:none;
    }
}
/* Verwendung mit Trigger-Modul */
/*** Smart Menu ***/{
	}
.sm_hidden {
    visibility: hidden;
    position: absolute; 
    }
.sm_show { 
    visibility: visible; 
    width:90vw; 
    height:100vh; 
    background:white; 
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;}
    #trigger {
	position: absolute;right: 10px;top: 10px;z-index: 1000;}
    #smart_menu li {
        list-style-type: none;
        padding-bottom: 10px;
        font-size: 1.2rem;
    }
    #smart_menu {
        padding: 2rem; /*20px;*/
    }
    #smart_menu li ul{
    margin-left: 2rem; /*-15px;*/
    padding-top: 0.5rem; /*10px;*/
    }
	#smart_menu level_3{
			visibility: hidden;
	}
    @media (min-width:1200px){
    #trigger {
    display:none;
    }
}


/* Main + Section */
main {
  padding: var(--spacing);
  max-width: 1200px;
  margin: 0 auto;
}

main h2,
main h3,
main h4 {
	margin-top: 1rem;
}

main ul {
  /*list-style-type: square;*/
  /*list-style:none; */
  list-style-image: url('/files/kimu/theme/music-solid-full.svg');
  margin-left: 1rem;
  padding: 1rem;
}
main ol {
  list-style-type: decimal; /* Default: numbers (1, 2, 3...) */
  margin-left: 1rem;
  padding: 1rem;
}

section {
  margin-bottom: 3rem;
  padding: 2rem;
  background-color: var(--color-background);
  border-radius: var(--border-radius);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

aside {
  padding: var(--spacing);
}

.article-separation {
	/*width: 80%;*/
	border: 1px solid;
	color: var(--color-secondary);
	margin: 0rem 10rem 0rem 5rem;
}
.music-line {
	border: 1px solid;
	color: var(--color-secondary);
	margin: 0rem 10rem 0rem 5rem;
}

}
.line {
	width: 30px;
	border: 2px solid;
	color: var(--color-secondary);
}

/* Grid-System */
@media (min-width:800px) {
	.grid-2 {
	  display: grid;
	  grid-template-columns: 1fr 1fr; /*repeat(auto-fit, minmax(300px, 1fr));*/
	  gap: 2rem; /*var(--spacing);*/
	  margin-top: 1.5rem;
	}
}
@media (max-width:799px) {
	.grid-2 {
	  display: block;
	  /*grid-template-columns: 1fr 1fr; /*repeat(auto-fit, minmax(300px, 1fr));*/
	  /*gap: 2rem; /*var(--spacing);*/
	  margin-top: 1.5rem;
	}
}

/* Footer */
footer {
  background-color: var(--color-footer);
  color: white;
  text-align: center;
  padding: 2rem;
  margin-top: 4rem;
  font-size: 0.9rem;
}

/* Buttons */
.button,
button,
input[type="submit"] {
  background-color: var(--color-primary);
  color: white;
  border: none;
  padding: 0.6rem 1.2rem;
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.button:hover,
button:hover,
input[type="submit"]:hover {
  background-color: var(--color-secondary);
}

/*** Events ***/
.header {
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--color-secondary);
	padding-top: 2rem;
}
.event_title {
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-text);
}
.time_location {
	font-size: 1rem;
	font-weight: 500;
	color: var(--color-secondary);
}
.more {
	.padding: 0rem 0rem 2rem 0rem;
}
.event_upcoming {
	margin-bottom: 1rem;
	font-size: 1rem;
	font-weight: 700;
}

/**allgemeine Einstellung für den Kalender**/

* {
 -moz-box-sizing: border-box; 
 -webkit-box-sizing: border-box; 
 box-sizing: border-box;
}
.cal_header {
	font-size: 1.2rem;
	font-weight:500;
	color: var(--color-primary);
	}

/* body {
 color: #616161;
}
ul {
 margin: 0; 
 padding: 0
}
li {
 list-style-type: none
}*/
.invisible {
 display: none
}
		/**KALENDER STYLE***/
		.cal_calendar
		{
		 max-width: 1200px;
		 width: 100%;
		 align: center;
		 overflow: hidden;
		}
		.cal_navigation, .cal_head
		{
		 height: 3rem;
		 margin: 0;
		 padding: 0;
		}
		.cal_navigation li
		{
		 list-style: none;
		 float: left;
		 height: 30px;
		 padding-top: 6px;
		 text-align: center;
		 width: 33%;
		}
		.cal_head.current 
		{
		 font-size: 1.2rem;
		 weight: 900;
		 color: var(--color-primary);
		 padding-top: 0;
		}

		/***WOCHENTAGE***/
		
		.cal_thead li
		{
		 width: 14.285%;
		 height: 2rem;
		 border: 1px solid var(--color-primary);
		 text-transform: uppercase;
		 text-align: center;
		 background-color: var(--color-background);
		 float: left;
		 color: var(--color-primary);
		 font-weight: 700;
		 display: table;
		 padding-top: 0.3rem;
		}

		/***KALENDER***/
		.cal_body
		{
		 clear: both;
		 overflow: hidden;
		}
		.cal_body .header
		{
		 margin-top: 0.5rem;
		}
		.cal_body ul
		{
		 clear: both;
		}	
		.cal_body ul li
		{
		 width: 14.285%;
		 height: 5rem;
		 border: 1px solid var(--color-primary);
		 text-transform: uppercase;
		 text-align: left;
		 padding-left: 0.3rem;
		 :not(.today) background-color:var(--color-background);
		 line-height: 1.2;
		 padding-top: 0.3rem;
		 float: left;
		 display: table
		}
		.label.weekend {
		 background-color: var(--color-primary); 
		 color: var(--color-text-invers);
		}
		.today, 
		.active.today {
			background-color: var(--color-accent); 
			color: var(--color-text);
			}
		.today > .cal_header {
			color: var(--color-text-invers);
			font-weight: 700;
			align: center;
			}
		/*.days.active, .active.today {
		 background-color: var(--color-secondary); 
		 color: var(--color-text);
		}
		.days.active > .header, .active.today > .header {
		 /*display: none;
		 color: var(--color-text-invers);
		}*/
		.upcoming_cal, .featured_cal
		{
		 font-size: 1rem;
		 display: flex; /*table-cell;*/
		 vertical-align: middle;
		 color: var(--color-text);
		}
		.cal_1.upcoming_cal > a, .cal_1.featured_cal > a, .cal_1.bygone_cal > a
				{
					color: var(--color-veranstaltungen);
					background-color: var(--color-veranstaltungen);
			}
			
		.cal_2.upcoming_cal > a, .cal_2.featured_cal > a, .cal_2.bygone_cal > a
				{
					color: var(--color-brasshoppers);
					background-color: var(--color-brasshoppers);
			}
		
		.cal_3.upcoming_cal > a, .cal_3.featured_cal > a, .cal_3.bygone_cal > a
				{
					color: var(--color-caminando);
					background-color: var(--color-caminando);
			}
		
		.cal_4.upcoming_cal > a, .cal_4.featured_cal > a, .cal_4.bygone_cal > a
				{
					color: var(--color-chorgemeinschaft);
					background-color: var(--color-chorgemeinschaft);
			}
		
		.cal_5.upcoming_cal > a, .cal_5.featured_cal > a, .cal_5.bygone_cal > a
				{
					color: var(--color-kantorei);
					background-color: var(--color-kantorei);
			}
			
		.cal_6.upcoming_cal > a, .cal_6.featured_cal > a, .cal_6.bygone_cal > a
				{
					color: var(--color-kammerorchester);
					background-color: var(--color-kammerorchester);
			}
			
		.cal_7.upcoming_cal > a, .cal_7.featured_cal > a, .cal_7.bygone_cal > a
				{
					color: var(--color-kinderchor);
					background-color: var(--color-kinderchor);
			}
		.upcoming_cal > a, .featured_cal > a, .bygone_cal > a
		{
		 color: var(--color-secondary);
		 background-color: var(--color-secondary);
		
		.days
		{
		 border: 1px solid var(--color-primary);
		}

/* Formulare mit nebeneinander angeordneten Label und Input */
form {
	max-width: 500px;
}

form .form-row {
  /*display: flex;
  align-items: center;*/
  margin-bottom: 1rem;
  gap: 1rem;
}

form .widget {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

form .form-row label {
  min-width: 150px;
  font-weight: 500;
}

form input[type="text"],
form input[type="email"],
form textarea {
  flex: 1;
  padding: 0.6rem;
  border: 1px solid #ccc;
  border-radius: var(--border-radius);
  width: 500px;
}

form input[type="radio"],
form input[type="checkbox"] {
		margin-top: 0.5rem;
		margin-right:0.3rem;
		margin-bottom: 0.5rem;
		margin-left:1rem;
		transform: scale(1.5);
	}

form .radio_container,
form .checkbox_container {
	/*display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;*/
	/*max-width: 500px;*/
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

/*form .form-row.checkbox,
form .form-row.radio {
  flex-direction: row;
}

form .form-row.checkbox label,
form .form-row.radio label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: normal;
}*/

/* Images */
picture {
  margin: 0rem 0rem 0rem 0rem;
}

figcaption {
  color: var(--color-secondary);
  font-size: 0.7rem;
  font-style: italic;
  margin-top: -0.5rem;
  margin-left: 0rem;
}

/* Video + Audio */
.content-youtube {
	max-width: 600px;
}

.content-player {
	max-width: 400px;
	margin-top: 2rem;
}

/* Aufzählungen mit Font Awesome Icons */
ul.fa-list {
  list-style: none;
  padding-left: 0;
}

ul.fa-list li::before {
  content: "\f058"; /* Font Awesome: check-circle */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-right: 0.6rem;
  color: var(--color-primary);
}


		

/* Roboto + Font Awesome (für Listen) */
/*@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');*/
/*@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css');*/


/*Roboto*/
@font-face {
  font-family: 'Roboto';
  src: url('/files/kimu/theme/fonts/Roboto-VariableFont_wdth,wght.ttf') format("truetype-variations");
  font-weight: 400;
}

/*Merriweather*/
@font-face {
  font-family: 'Merriweather';
  src: url('/files/kimu/theme/fonts/Merriweather-VariableFont_opsz,wdth,wght.ttf') format("truetype-variations");
  font-weight: 400;
}

/* Font Awesome - solid */
@font-face {
  font-family: 'Font Awesome 7 Free';
  /*font-style: solid;*/
  font-weight: 900;
  /*src: url('../../files/kimu/theme/fonts/vollkorn-v12-latin-600.eot');*/
  src: local(''),
       url('../../files/kimu/theme/fonts/fa-solid-900.woff2') format('woff2');
}


:root {
  --font-base: 'Roboto', sans-serif; /*'Merriweather', serif; */
  --color-primary: #3e6b48;
  --color-secondary: #5D9364; /*#88a88c;*/
  --color-background: #f7f8f5;
  --color-text: #333;
  --color-text-invers: #FFFFFF;
  --color-accent: #b5caa0;
  --color-header: #ffffff;
  --color-footer: #88a88c;
  --border-radius: 8px;
  --spacing: 1rem 0rem 0rem 2rem;

}



/* Dark Mode */
@media (prefers-color-scheme: dark) {
  :root {
    --color-background: #455C48;/*#1e1e1e;*/
    --color-text: #e0e0e0;
    --color-primary: #7ecf94;
    --color-secondary: #b5e0c6;
    --color-accent: #4d7359;
	--color-header: #59705C;
  }

  body {
    background-color: var(--color-background);
    color: var(--color-text);
  }

  section 
  /*header, nav, footer */
  {
    /*background-color: #2a2a2a;*/
	background-color: var(--color-background);
    color: var(--color-text);
  }

  a:hover {
    color: var(--color-secondary);
  }

  input, textarea {
    background-color: #333;
    color: var(--color-text);
    border-color: #555;
  }
}

@media (max-width:1200px) {
  :root {
	  --spacing: 0.5rem 0rem 0rem 0.5rem;
  }
}
	  
/* Reset & Basics */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: var(--font-base);
  background-color: var(--color-background);
  color: var(--color-text);
  font-size: 16px;
  line-height: 1.6;
}

a {
  color: var(--color-primary);
  font-weight: bold;
  text-decoration: none;
  transition: color 0.3s ease;
}
a:not([href*="demo.local"]):not([href*="seeger-duesseldorf.de"]):not([href^="#"]):not([href^="/"]):not([href^="{{link_url::"]):not(.no-icon)::after {
/*  content: '\2197'; /* Code für ↗ */
/*  display: inline-block;
  margin-left: 5px;
  font-size: 0.9em;*/
  font-family: "Font Awesome 7 Free";
  font-weight: 900; /* Wichtig für "Solid" Icons */
  content: '\f35d'; /* Code für "arrow-up-right-from-square" */
  display: inline-block;
  margin-left: 5px;
  font-size: 0.9em;
}
a:hover {
  color: var(--color-secondary);
}

h1 {
	font-size: 1.5rem;
}
h2 {
	font-size: 1.3rem;
}

/*		.legende_1 > a {
			color: var(--color-veranstaltungen);
			background-color: var(--color-veranstaltungen);
			}
		.legende_2 > a {
			color: var(--color-brasshoppers);
			background-color: var(--color-brasshoppers);
			}
		.legende_3 > a {
			color: var(--color-caminando);
			background-color: var(--color-caminando);
			}
		.legende_4 > a {
			color: var(--color-kantorei);
			background-color: var(--color-kantorei);
			}
		.legende_5 > a {
			color: var(--color-kammerorchester);
			background-color: var(--color-kammerorchester);
			}
		.legende_6 > a {
			color: var(--color-kinderchor);
			background-color: var(--color-kinderchor);
			}*/

/* Header */
header {
  background-color: var(--color-header);
  padding: var(--spacing);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

/* Navigation */

/*	nav ul {
	  list-style: none;
	  display: flex;
	  gap: 1.2rem;
	  position: relative;
	}

	nav li {
	  position: relative;
	}

	nav > ul > li > a {
	  font-weight: 500;
	  padding: 0.4rem 0.8rem;
	  border-radius: var(--border-radius);
	  display: block;
	}

	nav > ul > li:hover > a {
	  background-color: var(--color-accent);
	  color: white;
	}

	/* Dropdown: Ebene 2 
	nav li ul {
	  display: none;
	  position: absolute;
	  top: 100%;
	  left: 0;
	  background: white;
	  padding: 0.5rem;
	  border-radius: var(--border-radius);
	  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
	  z-index: 1000;
	  flex-direction: column;
	  min-width: 180px;
	}

	nav li:hover ul {
	  display: flex;
	}

	nav li ul li a {
	  padding: 0.4rem 0.8rem;
	  white-space: nowrap;
	}

	nav li ul li a:hover {
	  background-color: var(--color-accent);
	  color: white;
	}*/

.menu-list li{
    list-style-type: none;
    margin-bottom: 0.5rem;
    font-size: 1.2rem;
    }
    .mod_navigation .invisible {
        display: none;
    }
@media (min-width:1200px) {
    .main-menu ul {
    list-style-type: none;
    text-align:right;
    padding: 0px 0px;
    }
    .main-menu li {
    display: inline;
    font-size: 1.2rem;
    }
    .main-menu ul.level_2 {
    display: none;
    position:absolute;
    background: white;
    padding: 20px;
    }
    .main-menu li:hover ul.level_2 {
    display: block !important;
    } 
    .main-menu li:not(.last)::after {
        content: '|';
        padding: 0px 10px;
    }
    .main-menu ul.level_2 li {
        display: block !important; /*list-item !important;*/
        padding: 5px 0px;
		position:absolute;
		text-align:right;
		font-size: 1rem;
    }
    .main-menu ul.level_2 li::after {
        content: none !important;
    }
    .main-menu a {
        text-decoration: none;
        color: var(--color-primary);
    }
	.sub-menu ul {
		list-style-type: none;
		position:relative;
		text-align:right;
		padding: 0.3rem 0rem;
    }
    .sub-menu li {
		display: inline;
		font-size: 1.2rem;
    }
	.sub-menu li:not(.last)::after {
        content: '|';
        padding: 0px 10px;
    }
	.sub-menu a {
        text-decoration: none;
        color: var(--color-secondary);
    }
	.lvl3-menu ul {
		list-style-type: none;
		padding: 0.3rem 0rem;
    }
	.lvl3-menu li {
		display: block;
		font-size: 1.5rem;
    }
	.lvl3-menu a {
        text-decoration: none;
        color: var(--color-secondary);
    }
	
	.nav-footer ul {
		list-style-type: none
	}
	.nav-footer li {
		list-style-type: none;
		color: white; /*var(--color-background);*/
		display: inline;
		font-size: 1.2rem;
		padding: 0rem 1rem;
	}
	.nav-footer a:hover {
		color: white; /*var(--color-background);*/
	}
	/*.nav_footer li:not(.last)::after {
        color: var(--color-background);
		content: '|';
        padding: 0px 10px;
    }*/
}

@media (max-width:1199px) {
    .main-menu, .sub-menu, .menu-list {
    display:none;
    }
}
/* Verwendung mit Trigger-Modul */
/*** Smart Menu ***/

.sm_hidden {
    visibility: hidden;
    position: absolute; 
    }
.sm_show { 
    visibility: visible; 
    width:90vw; 
    height:100vh; 
    background:white; 
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1000;}
    #trigger {
	position: absolute;right: 10px;top: 10px;z-index: 1000;}
    #smart_menu {
        padding: 1rem; /*20px;*/
    }
    #smart_menu li ul{
		list-style-type: none;
		margin-left: 1rem; /*-15px;*/
		padding-top: 0.5rem; /*10px;*/
    }
	#smart_menu li {
        list-style-type: none;
        padding-bottom: 10px;
        font-size: 1.2rem;
	}
	#smart_menu li level_2{
		font-size: 1rem;
	}
	#smart_menu level_3{
		visibility: hidden;
	}
    @media (min-width:1200px){
    #trigger {
    display:none;
    }
}


/* Main + Section */
main {
  padding: var(--spacing);
  max-width: 1200px;
  margin: 0 auto;
}

main h2,
main h3,
main h4 {
	margin-top: 1rem;
}

main ul {
  list-style-type: square;
  /*list-style:none; */
  /*list-style-image: url('/files/kimu/theme/music-solid-full.svg');*/
  margin-left: 1rem;
  padding: 1rem;
}
main ol {
  list-style-type: decimal; /* Default: numbers (1, 2, 3...) */
  margin-left: 1rem;
  padding: 1rem;
}


/*main li::marker {
	content: url('/files/kimu/theme/music-solid-full.svg');
	font-size: 0;
	width: 15px;
	height: 15px;
}*/

/*main ul li::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  mask: url('../../files/kimu/theme/css/files/kimu/logo/music-solid-full.svg') no-repeat center;
  -webkit-mask: url('../../files/kimu/theme/css/files/kimu/logo/music-solid-full.svg') no-repeat center;
  background-color: var(--color-background); 
  margin-right: 10px;
}*/

section {
  margin-bottom: 3rem;
  padding: 2rem;
  background-color: var(--color-background);
  border-radius: var(--border-radius);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

aside {
  padding: var(--spacing);
}

.article-separation {
	/*width: 80%;*/
	border: 1px solid;
	color: var(--color-secondary);
	margin: 0rem 10rem 0rem 5rem;
}
.music-line {
	border: 1px solid;
	color: var(--color-secondary);
	margin: 0rem 10rem 0rem 5rem;
}

.line {
	width: 30px;
	border: 2px solid;
	color: var(--color-secondary);
}

/* Grid-System */
@media (min-width:800px) {
	.grid-2 {
	  display: grid;
	  grid-template-columns: 1fr 1fr; /*repeat(auto-fit, minmax(300px, 1fr));*/
	  gap: 2rem; /*var(--spacing);*/
	  margin-top: 1.5rem;
	}
}
@media (max-width:799px) {
	.grid-2 {
	  display: block;
	  /*grid-template-columns: 1fr 1fr; /*repeat(auto-fit, minmax(300px, 1fr));*/
	  /*gap: 2rem; /*var(--spacing);*/
	  margin-top: 1.5rem;
	}
}

/* Footer */
footer {
  background-color: var(--color-footer);
  color: var(--color-text-invers);
  text-align: center;
  padding: 2rem;
  margin-top: 4rem;
  font-size: 0.9rem;
}

/* Buttons */
.button,
button,
input[type="submit"] {
  background-color: var(--color-primary);
  color: var(--color-text-invers);
  border: none;
  padding: 0.6rem 1.2rem;
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background-color 0.3s ease;
}

.button:hover,
button:hover,
input[type="submit"]:hover {
  background-color: var(--color-secondary);
  color: var(--color-text-invers);
}

/*** Events ***/
.header {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-text);
	padding-top: 1rem;
}
.event_title {
	font-size: 1rem;
	font-weight: 700;
	color: var(--color-text);
}
.location {
	font-size: 1rem;
	font-weight: 500;
	font-style:italic;
	color: var(--color-secondary);
}
.time_location {
	font-size: 1rem;
	font-weight: 500;
	color: var(--color-secondary);
}
.more {
	.padding: 0rem 0rem 2rem 0rem;
}
.event_upcoming {
	margin-bottom: 1rem;
	font-size: 1rem;
	font-weight: 700;
}



/* Formulare mit nebeneinander angeordneten Label und Input */
form {
	max-width: 500px;
}

form .form-row {
  /*display: flex;
  align-items: center;*/
  margin-bottom: 1rem;
  gap: 1rem;
}

form .widget {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

form .form-row label {
  min-width: 150px;
  font-weight: 500;
}

form input[type="text"],
form input[type="email"],
form textarea {
  flex: 1;
  padding: 0.6rem;
  border: 1px solid #ccc;
  border-radius: var(--border-radius);
  width: 500px;
}

form input[type="radio"],
form input[type="checkbox"] {
		margin-top: 0.5rem;
		margin-right:0.3rem;
		margin-bottom: 0.5rem;
		margin-left:1rem;
		transform: scale(1.5);
	}

form .radio_container,
form .checkbox_container {
	/*display: flex;
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;*/
	/*max-width: 500px;*/
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
}

/*form .form-row.checkbox,
form .form-row.radio {
  flex-direction: row;
}

form .form-row.checkbox label,
form .form-row.radio label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: normal;
}*/

/* Images */
picture {
  margin: 0rem 0rem 0rem 0rem;
}

figcaption {
  color: var(--color-secondary);
  font-size: 0.7rem;
  font-style: italic;
  margin-top: -0.5rem;
  margin-left: 0rem;
}

/* Video + Audio */
.content-youtube {
	max-width: 600px;
}

.content-player {
	max-width: 500px;
	margin-top: 2rem;
}

/* Aufzählungen mit Font Awesome Icons */
ul.fa-list {
  list-style: none;
  padding-left: 0;
}

ul.fa-list li::before {
  content: "\f058"; /* Font Awesome: check-circle */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  margin-right: 0.6rem;
  color: var(--color-primary);
}

.technischer-hinweis {
    border: 2px solid darkred;         /* dunkelroter Rahmen */
    color: darkred;                    /* Textfarbe dunkelrot */
    background-color: #fff5f5;         /* leicht rötlicher Hintergrund für Lesbarkeit */
    margin: 0.5rem 0.5rem 0.5rem 0.5rem;
	padding: 10px 10px 10px 50px;      /* links Platz für das Icon */
    background-image: url('/files/kimu/theme/Achtung.jpg'); /* Verkehrszeichen-Bild */
    background-repeat: no-repeat;
    background-position: 10px center;  /* Icon links ausgerichtet */
    background-size: 32px 32px;        /* Icon-Größe */
    border-radius: 5px;                /* leicht abgerundete Ecken */
    font-weight: bold;
}
.technischer-hinweis h2 {
	margin-top: -0.5rem;
}