/*------------------------------------------------------------*/
/*	Prefixed CSS-Stylesheed - Fußverkehrskonzept - Dreieich 	*/
/*------------------------------------------------------------*/

/* Scripte
------------------------------------*/
	@import url("../fonts/font-awesome/7.1.0/css/all.min.css");
	@import url("../fonts/roboto.css");


/* Entwicklungstools
------------------------------------*/
/* hidden elements */
	.hidden {
		display: none;
	}

/* Printeinstellungen
------------------------------------*/
@media print {
  header, nav, footer, button, .no-print, .btn {
    display: none !important; /* ausblenden */
  }

  body, html {
    color: black;
    background: white;
  }

  .content {
    width: 100%;
    margin: 0;
    padding: 0;
  }

}

/* Struktur Elemente
------------------------------------*/
	body,
	html {
		font-family: "Roboto", Arial, sans-serif;
		font-size: 18px;
		line-height: 1.5;
		color: #383737;
	}
	body {
		background-color: #fff;
		overflow-y: scroll;
		margin: 0px;
	}
	html {
	  scroll-behavior: smooth;
	}

/* Headline */
	.header-colorline {
		height: 50px;
		background-color: #000033;
	}
	.headline-container {
		position: relative;
		top: 0;
		width: 100%;
		height: 100px;
		z-index: 99;
		background: #000033;
	}
	.headline-wrap {
/*		background-color: #fff;*/
		position: relative;
		max-width: 1140px;
		padding-top: 20px;
		margin-left: auto;
		margin-right: auto;
	}
	.headline-logo-wrap {
		background-color: #fff;
	}
	.headline-logo {
/*		padding: 20px 20px 20px 20px;*/
		position: absolute;
		left: 0px;
  	height: 60px;
	}
	.headline-slogan {
		position: absolute;
		top: 40px;
		left:290px;
		font-size: 1.9rem;
		color: #fff;
		text-transform: uppercase;
		font-weight: bold;
		letter-spacing: 2px;
		line-height: 45px;
	}
	.uppercase {
		text-transform: uppercase;
	}
	.break-slogan {
		display: none;
	}
	.no-padding {
		padding: 0;
	}
/* Navigation */
	.navbar-container {
		-webkit-box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.2);
		        box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.2);
		/*width: 85%;*/
		border-top: 1px solid #fff;
		height: 60px;
		background-color: #000033;
/*		opacity: 0.85;*/
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 1000;
		left: 0;
		right: 0;
	}

/* Content */
	.container-xl {
		padding: 0;
	}
	.content {
/*		margin-top: 75px;*/
/*		margin-bottom: 50px;*/
		padding: 20px;
/*		background-color: #fff;*/
	}
	section {
		padding: 10px 10px 20px 10px;
	}
	section.mittmachen {
		min-height: 300px;
	}
	.row {
		margin: 0;
	}
	section:first-child {
		border-top: none;
		/*padding-top: 0;*/
	}

/* Footer */
	footer h1 {
	  font-size: 1.1em;
	  margin-bottom: 10px;
	  color: #fff;
/*	  text-transform: uppercase;*/
	  font-weight: bold;
	  letter-spacing: 0.1em;
	}

	.footer-2-container {
		width: 100%;
		min-height: 180px;
		background-color: #003;
		padding: 10px;
		font-size: 18px;
		color: #fff;
		line-height: 1.2em;
	}
	.footer-2-wrap {
		max-width: 1140px;
		margin-left: auto;
		margin-right: auto;
		padding-top: 15px;
	}
	.footer-3-container {
		border-top: 1px solid white;
		position: relative;
	  background-color:#003;
	  color: white;
	}
	.footer-3-wrap {
		max-width: 1140px;
		margin-left: auto;
		margin-right: auto;
		height: 60px;
	}
	.copyright {
		text-align: left;
		padding: 20px;
		font-size: 14px;
/*		color: #fff;*/
		height: 60px;
	}
	.logo-lka-footer {
		float: right;
		height: 60px;
		padding: 7px;
		background-color: white;
	}
	.fa-ul a {
		color: #fff;
		opacity: 1;
		text-decoration: none;
	}
	.fa-ul a:hover {
		color: #fff;
		opacity: 1;
		text-decoration: underline;
	}
	footer .fa, footer .fa {
		color: #fff;
	}

	.fa-ul > li {
		margin-left: -15px;
		color: #fff;
	}

/* Stilelemente
------------------------------*/
/* Nach-Oben-Button */
	.gototop {
		position: fixed;
		bottom: 30px;
		right: 30px;
		z-index: 99;
		width: 50px;
		height: 50px;
		border: 1px solid #fff;
		border-radius: 25px;
		background-color: #000033;
		padding-top: 8px;
		color: #fff;
		font-size: 20px;
		font-weight: bold;
		text-align: center;
		text-decoration: none;
	}
	.gototop:hover {
		color: white;
		-webkit-transform: translateY(-10px);
		    -ms-transform: translateY(-10px);
		        transform: translateY(-10px);
		-webkit-transition: -webkit-transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s;
		transition: -webkit-transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s;
		-o-transition: transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s;
		transition: transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s;
		transition: transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s, -webkit-transform cubic-bezier(0.5, 3, 0.8, 0.5) 0.5s;
	}
	.fa-chevron-up {
		font-weight: bold;
	}
	.fa-phone,
	.fa-fax {
		color: #000033;
	}

/* Schriften
------------------------------------*/
	.h_head {
		margin-top: 30px;
		margin-left: 25px;
		color: #003;
  	font-size: 1.35rem;
  	text-transform: uppercase;
  	font-weight: bold;
  	letter-spacing: 0.1em;
	}
	.h_head::after {
		content: "";
		display: block;
		width: 98%;
		height: 2px;
		background-color: #003;
		margin-top: 0.5rem;
	  margin-bottom: 20px;
	}

	.h_bold	{
		margin-top: 15px;
	}
	h1 {
	  font-size: 2em;
/*	  margin-top: 10px;*/
	  margin-bottom: 20px;
	  color: #066;
	}
	h2 {
		font-size: 1.6rem;
		color: #003;
		margin-bottom: 15px;
/*		font-weight: bold;*/
	}
	.nonspacing {
		white-space: nowrap;
	}
	.italic {
		font-style: italic;
	}
	.infoframe {
		background-color: #EBEBEB;
		padding: 15px;
	}
	.txt-colored {
		color: #000033;
	}

/* Links
------------------------------------*/
	a {
 		color: #005858;
 		text-decoration: none;
 	}
	a:hover {
		color: #003;
 		-webkit-transition: 0.4s;
 		-o-transition: 0.4s;
 		transition: 0.4s;
 		text-decoration: underline;
 	}

/* Absätze
------------------------------------*/
	p.explain {
		font-weight: normal;
		margin: 5px 0 15px 0;
	}
	p.note, span.note {
		font-style: italic;
		margin: 5px 0 5px 0;
	}
	.hinweis {
		font-style: italic;
	}
	.initial {
		font-size: 300%;
		line-height: 1;
		float: left;
		padding-right: .125em;
		color: #14394b;
	}

/* Newsletter
------------------------------------*/
	.newsletter {
		width: 100%;
		padding: 20px 20px 50px 20px;
		background-color: #eeeeee;
		transition: 0.5s;
		margin-bottom: 25px ;
	}
	.newsletter:hover {
		box-shadow: 5px 5px 15px rgba(0,0,0,0.3);
		transition: 0.5s;
	}
	.newsletter h1 {
		font-size: 1.3rem;
		line-height: 30px;
		margin: 0px 0 10px 0;
	}
	.btn-newsletter-wrap {
		margin-top: 20px;
		position: absolute;
		bottom: 40px;
		right: 30px;
	}

/* Modal
------------------------------------*/
	.modal-header {
		background-color: #066;
		color: white;
	}
	.modal-header-kritisch {
		background-color: #B2000B;
	}
	.modal-footer {
		background-color: #fff;
		color: white;
		padding-top: 3px;
		padding-bottom: 8px;
	}
	.modal-content{
		margin-top: 0;
	}
	.close {
		color: #fff;
		opacity: 1;
	}
	.close:hover {
		color: #fff;
		opacity: 0.3;
	}

	.modal.fade .modal-dialog {
		transform: translateY(-120px);
		opacity: 0;
		transition: all 0.45s cubic-bezier(.25,.8,.25,1);
	}

	.modal.show .modal-dialog {
		transform: translateY(0);
		opacity: 1;
	}

/* Aufzählungslisten
------------------------------------*/
/* Allgemein */
	ul {
		list-style-type: square;
	}
	li {
		padding-bottom: 0.2rem;
	}

/* Grafiken
------------------------------------*/
	.pic,
	.intro-pic,
	.shadow-pic {
/*		margin-top: 5px;*/
		width: 100%;
		border-radius: 5px;
		-webkit-box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
		        box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
	}
	.beitragsbild {
		width: 100%;
		border-radius: 5px;
	}
	.bildunterschrift {
		display: block;
		margin-top: 10px;
		margin-bottom: 10px;
		font-size: 16px;
	}
	.zeitstrahl {
		width: 100%;
		margin-bottom: 50px;
	}
	.accordion-pic-multimobilitaet,
	.accordion-pic-intermobilitaet,
	.accordion-pic-spnv,
	.accordion-pic-oepnv,
	.accordion-pic-ondemand,
	.accordion-pic-sharing {
		margin-top: 10px;
	    display: -webkit-box;
	    display: -ms-flexbox;
	    display: flex;
	    -webkit-box-pack: center;
	        -ms-flex-pack: center;
	            justify-content: center;
	}
	.accordion-pic-multimobilitaet img {
		width: 70%;
	}
	.accordion-pic-oepnv img,
	.accordion-pic-intermobilitaet img,
	.accordion-pic-sharing img,
	.accordion-pic-spnv img,
	.accordion-pic-ondemand img {
		width: 95%;
	}
	.mass-pic {
		width: 100%;
		border: 1px solid #0c2e82;
	}
	.show-map,
	.show-info {
		cursor: pointer;
		text-decoration: underline;
	}
	.show-map:hover,
	.show-info:hover  {
		text-decoration: none;
	}

/* Logos */
/* -------------------------- */
/* logos-modal-kontakt */
	.logo-lka-kontakt img {
		position: absolute;
		top: 15px;
		right: 20px;
		width: 230px;
	}
	.wappen img {
		position: absolute;
		bottom: 40px;
		right: 20px;
		width: 130px;
	}

/* Beteiligungsseiten
------------------------------------*/
	.dialog-login-tile {
/*		border-top: 1px solid darkgrey;
		border-bottom: 1px solid darkgrey;*/
		background-color: #066;
		margin-top: 15px;
		padding: 15px;
		color: #fff;
	}
	.dialog-login-tile h1 {
		color: #fff;
	}
	.dialog-login-btn {
		text-align: right;
		padding: 0;
	}
	.dialog-logout-tile {
		background-color: #146781;
		margin-top: 15px;
		padding: 15px;
		color: #ffffff;
	}
	.dialog-logout-tile h1 {
		color: #ffffff;
		font-size: 1.3rem;
		text-transform: none;
	}
	.dialog-logout-btn {
		text-align: right;
		padding: 0;
	}
	.dialog-tile-img {
		width: 100%;
	}
	.dialog-wrap {
		position: relative;
		-webkit-transition: 0.5s;
		-o-transition: 0.5s;
		transition: 0.5s;
		background-color: #f0f0f0;
		min-height: 625px;
		padding-bottom: 50px;
	}
	.dialog-wrap:hover {
		-webkit-box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
		        box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
		-webkit-transition: 0.5s;
		-o-transition: 0.5s;
		transition: 0.5s;
		background-color: #e0e0e0;
	}
	.dialog-tile {
		width: 100%;
		padding: 15px;
	}
	.dialog-tile h1,
	.dialog-login-tile h1 {
		font-size: 1.3rem;
		line-height: 30px;
		margin: 0px 0 10px 0;
		text-transform: none;

	}
	.dialog-tile h2 {
		margin-top: 10px;
		margin-bottom: 20px;
		color: #373737;
		font-size: 1.3rem;
		line-height: 30px;
		margin: 0px 0 10px 0;
		font-weight: normal;
	}
	.dialog-link:hover {
		text-decoration: none;
	}
	.dialog-fa {
		margin-right: 8px;
	}
	.dialog-hinweis {
		background-color: #E9E9E9;
		border: 1px solid #C2C2C2;
		padding: 15px;
		margin-bottom: 20px;
		box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.2);
	}

/* Header */
	p.header {
		font-size: 16px;
		font-weight: bold;
	}

/* Progressbar */
	.progress-wrap {
		padding: 0 0 10px 0;
	}
	.progress {
		background-color: #E9E9E9;

	}
	.progress-bar {
		background-color: #066;
		font-size: 14px;
	}

/* Fragen */
	.wrap {
		background-color: white;
		padding: 10px;
		min-height: 600px;
		/*font-size: 15px;*/
	}
	section.question {
		border-top: 1px solid #14394b;
		padding: 0;
	}
	article.question {
		padding-top: 15px;
		padding-bottom: 15px;
	}
	p.question {
		margin: 5px 0 5px 0;
	}
	fieldset {
		background-color: #E9E9E9;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.show-info {
		cursor: pointer;
		color: #14394b;
	}

/* Label */
	label {
		cursor: pointer;
		margin: 5px 5px 5px 5px;
	}

/* Inputfelder */
	input[type="text"],
	input[type="password"],
	select {
		border: 1px solid #CCCCCC;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 18px;
		margin: 5px 0px 5px 0px;
		padding: 0.3em;
		border-radius: 0.25rem;
		color: #383737;
		background-color: white;
		height: 40px;
	}
	input[type="text"]:focus,
	input[type="password"]:focus,
	select:focus,
	input[type="text"]:hover,
	input[type="password"]:hover,
	select:hover {
		-webkit-box-shadow: 0px 0px 5px 1px #14394b;
		        box-shadow: 0px 0px 5px 1px #14394b;
		outline: none;
	}
	.ip-select-max {
		width: 100%;
	}
	.ip-txt-max {
		width: 100%;
	}
	.ip-txt-xl {
		width: 80%;
	}
	.ip-txt-lg {
		width: 60%;
	}
	.ip-txt-md {
		width: 40%;
	}
	.ip-txt-sm {
		width: 25%;
	}
	.img-pulldown {
		height: 20px;
	}
	.verbindungen {
		padding-bottom: 15px;
	}
	.lable-verbindung {
		display: inline-block;
		min-width: 45px;
	}
	.h-verbindungen {
		padding: 15px 0 15px 0;
		font-weight: bold;
	}
	.select-startziel{
		width: 80%;
	}
	.verbindung-andere-txt {
		height: 30px;
		width: 80%;
		font-size: 16px;
		margin-left: 50px !important;
		padding-left: 10px !important;
	}
	span.hhb-4 {
		display: inline-block;
		min-width: 320px;
	}

/* Kommentarfelder */
	textarea {
		border: 1px solid #CCCCCC;
		/*font-size: 14px;*/
		height: 100px;
		width: 100%;
		padding: 0.5em;
		color: #383737;
	}
	textarea:hover,
	textarea:focus {
		-webkit-box-shadow: 0px 0px 5px 1px #14394b;
		        box-shadow: 0px 0px 5px 1px #14394b;
		outline: none;
	}
/* Pulldown Map */
	.pd-map {
		width: 100%;
	}

/* Button - allgemein */
	.btn {
		margin-top: 10px;
		border-radius: 5px;
		color: #fff;
		background-color: #006666;
		border-color: #006666;
 		transition: box-shadow 0.2s ease, border-color 0.2s ease;
/*		border-radius: 20px;*/
	}

	.btn-login {
		padding-right: 25px;
		padding-left: 25px;
	}
	section.button {
		text-align: right;
		border-top: 1px solid #14394b;
		/*margin: 0 10px 0 10px;*/
		padding-top: 5px;
		padding-bottom: 5px;
	}

/* Button - Custom */
/* Dialog "link-button" */
	.dialog-btn {
	    position: absolute; 			/* in Relation zu .dialog-wrap */
	    bottom: 25px;
	    left: 50%; 						/* horizontale Zentrierung */
	    -webkit-transform: translateX(-50%);
	        -ms-transform: translateX(-50%);
	            transform: translateX(-50%); 	/* horizontale Zentrierung */
	}

/* Dialog "allow-osm" */
	.btn-allow-osm {
		display: block;
		margin-top: 20px;
		margin-left: auto;
		margin-right: auto;
		width: 200px;
	}

/* PRIMARY */
	.btn-primary:not(:disabled):not(.disabled):active,
	.btn-primary.active,
	.show > .btn-primary.dropdown-toggle {
	  background-color: #006666;
	  border-color: #006666;
	}

	.btn-primary:hover,
	.btn-primary:focus {
		outline: none;
		color: #fff;
		background-color: #003;
		border-color: #003;
	}

	.btn-primary:focus,
	.btn-primary:active,
	.btn-primary:active:focus {
	  box-shadow: 0 0 0 0.25rem rgba(194, 207, 0, 0.4) !important; /* grün-gelb (#000033) */
	  border-color: #003 !important;
	  outline: none !important;
	}

/* WARNING */
	.btn-warning:hover  {
		outline: none;
		color: #146781;
		background-color: #fff;
		border-color: #146781;
	}

	.btn-warning:focus,
	.btn-warning:active,
	.btn-warning:active:focus {
	  box-shadow: 0 0 0 0.25rem rgba(255, 200, 0, 0.4) !important; /* gelber Ring */
	  border-color: #ffc800 !important;
	  outline: none !important;
	}

/* DANGER */
	.btn-danger:focus,
	.btn-danger:active,
	.btn-danger:active:focus {
	  box-shadow: 0 0 0 0.25rem rgba(230, 0, 0, 0.4) !important; /* rötlicher Ring */
	  border-color: #e60000 !important;
	  outline: none !important;
	}
	.btn-danger {
		color: #fff;
		background-color: #B2000B;
		border-color: #B2000B;
/*		border-radius: 20px;*/
	}
	.btn-danger:hover {
		outline: none;
		color: #fff;
		background-color: #003;
		border-color: #003;
	}

/* Formularvalidierung
------------------------------------*/
/* Hauptformular */
	.meldung-invalid {
		color: #B2000B;
		text-align: center;
		border: 1px solid;
		padding: 5px 0 5px 0;

	}
	#meldung-invalid {
		border-top: 1px solid #B2000B;
		padding: 10px 0 10px 0;
	}
	.invalid {
/*		border: 1px solid #14394b;*/
		-webkit-box-shadow: 0px 0px 3px 1px #E50032;
		        box-shadow: 0px 0px 3px 1px #E50032;
	}
	.invalid-select,
	.invalid-textfeld {
		border: 2px solid #B2000B;
	}
	.invalid-login {
		display: none;
		text-align: center;
		color: #fff;
		border: 1px solid;
		margin-top: 10px;
		padding: 5px 15px 5px 15px;
	}
	.invalid-marker,
	.invalid-input-text,
	.invalid-input-text-edit {
		display: none;
		text-align: center;
		color: #B2000B;
		border: 1px solid;
		margin-top: 10px;
		padding: 5px 15px 5px 15px;
	}
	.red {
		color: #c30c0e;
	}
	.fs-invalid {
		border-left: 5px solid #B2000B;
		padding: 11px;
	}

/* Login Gemeindebefragung */
	.login {
		text-align: center;
		width: 120px;
		border-radius: 5px 0 0 5px !important;
	}
	.input-group-pssw {
		margin-top: 5px;
		margin-bottom: 10px;
	}
	.btn-input-group-pssw {
		margin-top: 5px;
		height: 40px;
		border-left: none;
		border-radius: 0 5px 5px 0;
		cursor: pointer;
	}
	.meldung-invalid-login {
		color: #fff;
		text-align: center;
		border: 1px solid #fff;
		padding: 5px 0 5px 0;
	}

/* Info und Tooltips
------------------------------------*/
	.info {
		cursor: pointer;
	}
	.fa-info-circle {
		font-size: 1rem;
		color: #146781;
	}
	.info-text {
		text-decoration: underline;
		color: #007bff;
		font-weight: bold;
	}
	.info-text:hover {
		text-decoration: none;
	}
	.tooltip-inner {
		font-size: 18px;
		text-align: left;
		color: white;
		background-color: #146781;
	}

/* Leaflet
------------------------------------*/
/* Map-Getters */
	.getters-check-area {
		text-align: right;
		display: none;
	}
	.getters {
		padding: 2px 10px 2px 2px;
	 	background-color: rgba(255, 255, 255, 0.6);
	}
	.pd-zoom-ortsteil {
		display: block;
		z-index: 10;
		padding: 5px 5px 0 5px;
		position: absolute;
		right: 0px;
		top: 0px;
	}
	.map-wrap {
		margin: -10px -15px 10px -15px;
	}
	#map {
		height: 550px;
		width: 100%;
		z-index: 9;
	}
	.map-button {
		position: absolute;
		width: 35px;
		height: 35px;
		border: 2px solid rgba(0,0,0,0.2);
		border-radius: 4px;
		background-color: #f4f4f4;
		z-index: 10;
		color: black;
		cursor: pointer;
		font-size: 22px;
		text-align: center;
	}
	.map-button:hover {
		color: #BA0000;
		background-color: #ffffff;
	}
	.map-button:active {
		color: black;
	}
	#map-edit {
		height: 300px;
		width: 100%;
		z-index: 9;
	}
	.map-wrap,
	#map {
		height: 550px;
	}
/* Allow OSM */
	.allow-osm-info {
		position: absolute;
		background-image: url(../images/placeholder_osm_map.png);
		background-position: center top;
    	background-size: auto 100%;
		height: 100%;
		width: 100%;
		padding: 25px;
		color: #fff;
		z-index: 11;
	}
	.link-allow-osm {
		color: #ffffff;
	}
	.link-allow-osm:hover {
		color: #ffffff;
		text-decoration: underline;
	}

/* Leaflet-Popup */
	.leaflet-popup-content-wrap {
	    /*background: orange;*/
	    color: #333;
	    -webkit-box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	            box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	    padding: 1px;
	    border-radius: 5px;
	    min-width: 240px;
	}
	.leaflet-popup-content {
	    text-align: left;
		font-size: 16px;
	}
	.leaflet-popup-content h1 {
		font-size: 16px;
		margin: 0;
		padding: 10px 20px 10px 20px;
		background-color: #669933;
		color: white;
		margin: -14px -20px 10px -20px;
		border-radius: 4px 4px 0 0;
		text-transform: none;
		font-weight: normal;
	}
	.leaflet-popup-content h2 {
		font-weight: bold;
		font-size: 16px;
		margin: 0;
		padding: 10px 20px 10px 20px;
		background-color: white;
		color: #383737;
		margin: -14px -20px 0 -20px;
	}
	.leaflet-popup-content p {
		margin:	0;
		padding: 0 0 5px 0;
	}
	.leaflet-popup-content h1.default {
		background-color: #828282;
	}
	.leaflet-popup-content h1.gehwege {
		background-color: #03295a;
	}
	.leaflet-popup-content h1.queren {
		background-color: #115269;
	}
	.leaflet-popup-content h1.barrieren {
		background-color: #ffb400;
	}
	.leaflet-popup-content h1.gestaltung {
		background-color: #7eb33c;
	}
	.leaflet-popup-content h1.konflikte {
		background-color: #d10a00;
	}
	.leaflet-popup-content h1.sonstiges {
		background-color: #404041;
	}

/* Beteiligung Städte und Gemeinden	*/
	.leaflet-popup-content h1.default-v {
		background-color: #14394b;
	}
	.leaflet-popup-content h1.default-p {
		background-color: #67A5D6;
	}

	.leaflet-container a.leaflet-popup-close-button {
	    position: absolute;
	    top: 10px;
	    right: 10px;
	    padding: 4px 4px 0 0;
	    border: none;
	    text-align: center;
	    width: 24px;
	    height: 24px;
	    font-size: 20px;
	    font-weight: normal;
	    color: white;
	    text-decoration: none;
	    font-weight: bold;
	    background: transparent;
	}
	.leaflet-container a {
		color: #14394b;
	}
	.link-edit-marker {
		position: absolute;
		bottom: 10px;
		right: 15px;
		font-size: 14px;
		color: #14394b;
		cursor: pointer;
		-webkit-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}
	.link-edit-marker:hover {
		text-shadow: 0px 20px 20px 0px rgba(0,0,0,0.3);
		cursor: pointer;
		opacity: 0.6;
		-webkit-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}
	.popup-content-text {
		padding-bottom: 25px;
	}

/* Custom Chekboxen
------------------------------------*/
/* Custom Checkbox – technisch wie Radio (barrierefrei) */
input[type="checkbox"].custom-checkbox {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	-webkit-clip-path: inset(50%);
	        clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Label mit Platz für Kästchen links */
input[type="checkbox"].custom-checkbox + label {
	position: relative;
	display: block;
	padding-left: 28px; /* 18px + ~10px Abstand */
	line-height: 1.6;
	cursor: pointer;
}

/* das Kästchen */
input[type="checkbox"].custom-checkbox + label::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 18px;
	height: 18px;
	border-radius: 0; /* quadratisch */
	border: 1px solid #898989;
	background-color: #ffffff;
	transition: background-color 0.1s, box-shadow 0.1s;
}

/* Hover / Fokus */
input[type="checkbox"].custom-checkbox:hover + label::before,
input[type="checkbox"].custom-checkbox:focus-visible + label::before,
input[type="checkbox"].custom-checkbox:focus + label::before { /* Fallback */
	background: #CDCDCD;
	box-shadow: inset 0 0 0 3px #ffffff;
}

/* Checked */
input[type="checkbox"].custom-checkbox:checked + label::before {
	background: #14394b;
	border-color: #14394b;
	box-shadow: inset 0 0 0 3px #ffffff;
}

/* Checked + Hover/Fokus */
input[type="checkbox"].custom-checkbox:checked:hover + label::before,
input[type="checkbox"].custom-checkbox:checked:focus-visible + label::before,
input[type="checkbox"].custom-checkbox:checked:focus + label::before { /* Fallback */
	background: #14394b;
	box-shadow: inset 0 0 0 3px #ffffff, 0 0 3px #14394b;
}


/* Custom Radiobutton – mit hängendem Einzug
------------------------------------------------*/
	input[type="radio"].custom-radio {
		position: absolute;
		width: 1px;
		height: 1px;
		padding: 0;
		margin: -1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		-webkit-clip-path: inset(50%);
		      clip-path: inset(50%);
		white-space: nowrap;
		border: 0;
	}

/* Label bekommt Platz links -> hängender Einzug */
	input[type="radio"].custom-radio + label {
		position: relative;
		display: block;
		padding-left: 28px;   /* 18px Kreis + ~10px Abstand */
		line-height: 1.6;
		cursor: pointer;
	}

/* der „Kringel“ */
	input[type="radio"].custom-radio + label::before {
		content: "";
		position: absolute;
		left: 0;
		top: 9px;
		width: 18px;
		height: 18px;

	/* border-radius (mit Prefixes) */
		-webkit-border-radius: 50%;
		   -moz-border-radius: 50%;
			    border-radius: 50%;

		border: 1px solid #898989;
		background-color: #ffffff;

	/* Transition (mit Prefixes) */
		-webkit-transition: background-color .1s, -webkit-box-shadow .1s;
		 -moz-transition: background-color .1s,    -moz-box-shadow .1s;
		   -o-transition: background-color .1s,           box-shadow .1s;
		      transition: background-color .1s,           box-shadow .1s;
	}

/* Hover & Fokus */
	input[type="radio"].custom-radio + label:hover::before,
	input[type="radio"].custom-radio:focus-visible + label::before,
	input[type="radio"].custom-radio:focus + label::before { /* Fallback */
		-webkit-box-shadow: inset 0 0 0 3px #ffffff;
		 -moz-box-shadow: inset 0 0 0 3px #ffffff;
		      box-shadow: inset 0 0 0 3px #ffffff;
		background: #CDCDCD;
}

/* Checked */
	input[type="radio"].custom-radio:checked + label::before {
		-webkit-box-shadow: inset 0 0 0 3px #ffffff;
		 -moz-box-shadow: inset 0 0 0 3px #ffffff;
		      box-shadow: inset 0 0 0 3px #ffffff;
		background: #14394b;
		border-color: #14394b;
}

/* Checked + Hover/Fokus */
	input[type="radio"].custom-radio:checked + label:hover::before,
	input[type="radio"].custom-radio:checked:focus-visible + label::before,
	input[type="radio"].custom-radio:checked:focus + label::before { /* Fallback */
		background: #14394b;
		-webkit-box-shadow: inset 0 0 0 3px #ffffff, 0 0 3px #14394b;
		 -moz-box-shadow: inset 0 0 0 3px #ffffff, 0 0 3px #14394b;
		      box-shadow: inset 0 0 0 3px #ffffff, 0 0 3px #14394b;
	}

/* Media-Querys
------------------------------------*/
/* Entspricht Bootstrap Extra large .col-xl */
@media only screen and (max-width: 1199px) {
	.headline-logo {
		margin-left: 20px;
	}
	.headline-slogan {
	    line-height: 45px;
	    left: 20px;
	}
}
/* Entspricht Bootstrap Large .col-lg */
@media only screen and (max-width: 991px) {
	.header-colorline .hidden {
    display: inline;
  }
	.headline {
		height: 50px;
		font-size: 1.0rem;
		padding: 2px 0 0 110px;
	}
	.header-colorline {
		display: block;
		height: 40px;
		color: #fff;
		padding: 5px 5px 5px 20px;
		font-weight: bold;
	}
	.headline-logo {
		margin-left: 20px;
		height: 90px;
	}
	.headline-container,
	.headline-wrap {
		height: 125px;
	}
	.headline-slogan {
	  display: none;
	}
	.nav-item {
		background-color: #003;
	}
	.nav-item:hover, .nav-item.active {
		color: #fff;
		background-color: #003;
	}
	.headline-wrap,
	.nav-item:last-child {
		-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2);
		        box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.2);
	}
	.break-slogan {
		display: block;
	}
	.navbar-container {
		height: 0px;
		position: relative;
	}
	.navbar-expand-lg .navbar-nav .nav-link {
		font-weight: normal;
	  padding: 0;
		color: #fff;
	}
	.navbar-expand-lg .navbar-nav .nav-link:hover {
		color: #fff;
	}
	.nav-item:hover {
		background-color: #5D5C71;
	}
	.navbar-nav .nav-link.active {
/*		font-weight: bold;*/
		color: #fff;
	}
	.nav-item	{
		height: 45px;
		padding: 5px 35px 0 25px;
	}
	.content {
		width: 100%;
	}
	h1 {
	  font-size: 1.5rem;
	}
	.h_head {
		margin-top: 0;
	}

/* Accordeon */
	.bar {
		font-size: 1.2em;
	}
	.wrap-h-bar {
		margin-top: -32px;
	}

/* Footer */
	.footer-1-container {
		display: none;
	}
}

/* Entspricht Bootstrap Medium .col-md
----------------------------------------*/
@media only screen and (max-width: 767px) {
/* Header */
	.hidden-md {
		display: none;
	}
	.ip-txt-lg {
		width: 100%;
	}
/* Grafiken	*/
	.carousel-indicators li,
	.carousel-control-prev,
	.carousel-control-next {
		display: none;
	}
	.carousel-wrap {
		display: none;
	}
/* Footer */
	.copyright {
		display: none;
	}
	.logo-lka-footer {
		position: absolute;
		left: 10px;
	}
	.footer-back {
	  display: none;
	}

/* Schriften */
	h2 {
		font-size: 1.5em;
	}

/* Accordeon */
	.bar {
		font-size: 1.0em;
	}
	.wrap-h-bar {
		margin-top: -27px;
	}
	.accordion-pic {
		width: 50%;
	}

/* Dialogeauswahl */
	.dialog-wrap {
		margin-top: 25px
	}
}

/* Entspricht Bootstrap Small .col-sm
---------------------------------------------*/
@media only screen and (max-width: 575px) {
/* Header */
	.headline-slogan {
		display: none;
	}
	.headline-container,
	.headline-wrap {
		height: 90px;
	}
	.headline-logo {
		padding: 0;
  	height: 60px;
	}
	 .navbar-toggler {
		 	left: 25px;
			top: -80px;
	 }
	.container-xl {
		/*margin-top: 0;*/
	}
	.h_head {
		font-size: 24px;
	}
/* Schriften */
	h1, h2 {
		font-size: 1.2rem;
	}
	.margin-top-20 {
		margin-top: 20px;
	}

/* Kacheln */
	div.tile a, .tile-footer {
		display: none;
	}

/* Carousel */
/*	.carousel-wrap,
	.header-icons-container {
		display: block;
	}*/

/* Footer */
	.copyright {
		padding: 15px;
		width: 100%;
		height: 25px;
		text-align: center;
	}

/* logos-modal */
	.wappen img {
		display: none;
	}
	.logo-lka-kontakt img {
		display: none;
	}

/* Formulare */
	select {
	    width: 100%;
	}
	.btn {
		width: 100%;
	}

/* Dialograum */
	.dialog-tile {
		min-height: 100px;
	}
	.legende-radnetz {
		display: block;
	}
	.legende-radnetz-map {
		display: none;
	}

	.accordion-pic {
		width: 95%;
	}
}

/* Smartphone portrait
---------------------------------------------*/
@media only screen and (max-width: 400px) {
	.header-colorline {
		display: none;
	}
	.headline-slogan {
	    display: none;
	}
	.logo-lka-footer,
	.logo-plm-footer {
	    display: none;
	}
}