@font-face {font-family: 'Open Sans';font-style: normal;font-weight: 400;  src: local(''),url('/data/webfonts/open-sans-v27-latin-regular.woff2') format('woff2'),url('/data/webfonts/open-sans-v27-latin-regular.woff') format('woff'); }
@font-face {font-family: 'Open Sans'; font-style: normal;font-weight: 700;src: local(''),url('/data/webfonts/open-sans-v27-latin-700.woff2') format('woff2'), url('/data/webfonts/open-sans-v27-latin-700.woff') format('woff'); }
@font-face {font-family: 'Roboto Slab';font-style: normal;font-weight: 400;src: local(''),url('/data/webfonts/roboto-slab-v22-latin-regular.woff2') format('woff2'),url('/data/webfonts/roboto-slab-v22-latin-regular.woff') format('woff'); }
@font-face {font-family: 'Roboto Slab';font-style: normal;font-weight: 700;src: local(''),url('/data/webfonts/roboto-slab-v22-latin-700.woff2') format('woff2'),url('/data/webfonts/roboto-slab-v22-latin-700.woff') format('woff'); }
@font-face {font-family: 'Roboto Slab';font-style: normal;font-weight: 500;src: local(''), url('/data/webfonts/roboto-slab-v22-latin-500.woff2') format('woff2'),url('/data/webfonts/roboto-slab-v22-latin-500.woff') format('woff');}
@font-face {font-family: 'fontello';src: url('/data/webfonts/fontello.eot?51585827');src: url('/data/webfonts/fontello.eot?51585827#iefix') format('embedded-opentype'),url('/data/webfonts/fontello.woff2?51585827') format('woff2'),url('/data/webfonts/fontello.woff?51585827') format('woff'),url('/data/webfonts/fontello.ttf?51585827') format('truetype'),url('/data/webfonts/fontello.svg?51585827#fontello') format('svg');font-weight: normal;font-style: normal;}


/*########## HTML Tags ########### */

html {
	text-rendering: optimizelegibility;
	scroll-behavior: smooth;}

body,p{ 
	font-size: 1.1rem;
	font-family: 'Open Sans';
	font-weight: 400;
	margin: 0;
	line-height: 1.6em;
	color: #58585a;}

.row .col-12  {padding-top: 15px;padding-bottom: 15px;}
.row .col-6   {padding-top: 15px;padding-bottom: 15px;}
.row .col-lg-6 {padding-top: 15px;padding-bottom: 15px;}

h1, h2, h3 {
	margin-top: 0;
	font-family:'Roboto Slab';
	font-weight: 400 }

h1 {
	font-size: 2em;
	line-height: 1.4em;
	margin-bottom: 0.8em;}

h2 {
	line-height: 1.4em;
	margin-bottom: 0.8em;}

h3 {
	font-size: 1.25em;
	margin-bottom: .8em; }

a {border-bottom: none;}

.underline,
.underline a {
	position: relative;
	margin-left: 1px;
	text-decoration: none;}

.underline:after,.underline a:after {
	content: "";
	position: absolute;
	bottom: -3px;
	left: 0;
	height: 1px;
	right: 0%;
	-webkit-transition: cubic-bezier(.165, .84, .44, 1) right .6s, cubic-bezier(.165, .84, .44, 1) background-color .6s;
	transition: cubic-bezier(.165, .84, .44, 1) right .6s, cubic-bezier(.165, .84, .44, 1) background-color .6s;}

.underline:hover:after,
.underline a:hover:after {
	right: 100%;}

.underline.fadeIn:after,
.underline a.fadeIn:after {
	right: 100%;}

.underline.fadeIn:hover:after,
.underline a.fadeIn:hover:after {
	right: 0%;}

button:active, button:focus {outline: none;}


img {
	max-width: 100%;height: auto;
	vertical-align:middle;
	border-style:none}

svg {
	overflow:hidden;
	vertical-align:middle}

img.dontfit {
	width: unset;
	height: auto;}

.hyphened {
	-webkit-hyphens: auto;
	-webkit-hyphenate-character: "\2010";
	-webkit-hyphenate-limit-after: 1;
	-webkit-hyphenate-limit-before: 3;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto; }


/*########## custom tiny styles ########### */
.orange {color:#ee7f00;}
.grau {color:#58585a;}
.gruen {color:#89ba16;}
.hellblau {color:#25baE2;}
.blau {color:#005da8;}
.weiss{color:#fff;}
.schwarz {color:#000;}
.hrline {border:1px solid #eee;margin: 0;}
.ausgeblendet {display: none;}
.ohneRand, .ohneRandnurDesktop {
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;}

.ImgTopOut {
	margin-top:70px;
}
.ImgTopOut div img {
	width: 87%;
	position: relative;
	top: -80px;}


.ImgOutText h3 {
	margin-top: 1.3rem;
}

.ImgOutText div img{
	width: 30px;
	position: unset;}


/* ########### Navigation ########### */
.mobile {display:none;}
.Navigation {
	margin-right:0px;
	margin-left:0px;
	padding: 0 15px 0 0;
	max-height:27px;}

a.TopNav  {border: none;}
a.TopNav:after {right: 100%;}

/* ########### iconNavi ########### */
.colNav {margin-top: 32px;padding: 0;}

#icon_menuName {
	position: relative;
	font-family:'Roboto Slab';
	font-weight: 400 ;
	font-size: 1.7rem;
	padding: 0 50px 0 0;
	margin-bottom: 25px;
	float: left;}

#icon_tel {	
	font-family:'Roboto Slab';
	position: relative;
	padding: 0 30px 0 0;
	height: 100px;
	margin-left: 40px;
	margin-top: -55px;
	float: left;}

#icon_mail {
	font-family:'Roboto Slab';
	position: relative;
	margin-top: -55px;
	padding: 0 30px 0 0;
	height: 100px;
	margin-top: -55px;
	float: left;}

#icon_search {
	font-family:'Roboto Slab';
	height: 100px;
	margin-top: -55px;
	width: 30%;
	float: left;}

#searchform {
	position: absolute;
	display: none;}

.colNav #icon_search {
	cursor: pointer}

.colNav #icon_search + form {
	display: none;
	position: absolute;
	top: 90px;
	right: 00px;
	z-index: 100;
	width: 0}

.colNav #icon_search + form input {
	line-height: 1;
	margin: 0 0 0 23px;
	padding: 0.15rem 0.25rem 0.2rem;
	width: 80%;}

/* ########### Logo ########### */
.fil1home {fill:#58585A}
.fil0home {fill:#58585A}
.Logo {margin-top:20px;}
.Logo svg {height: 120px;}
/* ########### Header ########### */
.colNavSearch {margin-top: 57px;padding: 0 2rem;}
.headbild {
	margin-top: 172px;
	position:relative}

.topnews {
	position:absolute;
	top:80px;
	right:262px;
	width:540px;
	height:315px}

.topnews div {display: inline-block;margin:0 35px; }
.topnews a {text-decoration: none;}
.topnews .BeschreibungTopNewsTitel p {font-family:'Roboto Slab';font-size:2.4em;margin-top:30px;line-height:2.8rem;}
.topnews .BeschreibungTopNewsAnleser {margin-top:34px;}
.mehrInfoTopNews a{font-family:'Roboto Slab';position: absolute; bottom: 0; margin-bottom:40px;padding:12px 20px;background: #58585a; color:#fff;}
.topnewsx .BeschreibungTopNewsTitelx p {font-family:'Roboto Slab';font-size:2.4em;line-height:2.8rem;}
.nurMobileNews {display:none;}
.mehrInfoTopNewsSlider a{font-family:'Roboto Slab';padding:12px 20px;background: #58585a; color:#fff;}
.topnewsLinex {margin-top: 3rem;}

/* ########### Content ########### */
.breadcrumb {background:none;font-size:0.85rem;padding:.75rem 0 0 0;}
.breadcrumbA {margin: 0;padding: 0;}
.mitAbstandA {padding: 2rem 0;}
.mitAbstandB {padding: 2rem 0;}

.container-fluid .row.headbild {
	margin-left: 0 !important;
	margin-right: 0 !important;}

.clear {clear: both;}

.container {max-width: 1500px;}

.nurPhone {display: none;}

.Newsvorschau, .Newsbildlinks {
	float:left;
	margin-right:10px;
	width:276px;}

table.datenfakten td:first-child {
	width:530px;}

.Karriere {margin:16px 0;}
.Karriere span {display: inline-block;vertical-align: top;}
.Karriere .KarriereArbeitgeber {width:180px;}
.KarriereTitel {width:650px;font-weight: 600}
.KarriereBewerbung, .KarriereInfos {width: 200px;}

/* ########### Freibad on/off ########### */
#FreibadOn {
	color: #88BA25;}

#FreibadOff {
	color: #EE7F00;}

#FreibadOn:before {
	text-decoration: none;
	font-family: fontello;
	content: "\e828\00a0\00a0\00a0";}

#FreibadOff:before {
	text-decoration: none;
	font-family: fontello;
	content: "\e827\00a0\00a0\00a0";}

/* ########### LinkInt ########### */
a.LinkInt {
	border: 1px solid #58585A;
	background: #58585A;
	font-family: 'Roboto Slab';
	color: #FFF;
	padding: 0.9rem 3rem;
	text-decoration: none;
	transition: all 0.5s ease-in-out;}

a.LinkInt:after {
	text-decoration: none;
	font-family: fontello;
	color: #EE7F00;
	content: "\00a0\e885\00a0\00a0\00a0";}

a.LinkInt:hover {
	transition: all 0.5s ease-in-out;}

a.LinkInt:hover:after{
	content: "\00a0\00a0\00a0\00a0\e885";
	transition: all 2.2s linear 0s;}


/* ########### LinkBack ########### */
a.LinkBack {
	border: 1px solid #58585A;
	background: #58585A;
	font-family: 'Roboto Slab';
	color: #FFF;
	padding: 0.9rem 3rem;
	text-decoration: none;
	transition: all 0.5s ease-in-out;}

a.LinkBack:before {
	text-decoration: none;
	font-family: fontello;
	color: #EE7F00;
	content: "\00a0\e887\00a0\00a0";}

a.LinkBack:hover {
	transition: all 0.5s ease-in-out;}

a.LinkBack:hover:before{
	content: "\e887\00a0\00a0\00a0";
	transition: all 2.2s linear 0s;}


/* ########### Suche ########### */
.searchcontainer {
	min-height: 500px;}


/* ########### Button ########### */
.button-effect a {
	background-color: #58585A;}

.effect {
	text-align: center;
	display: inline-block;
	position: relative;
	text-decoration: none;
	color: #fff;
	padding: 0.7rem 0px;
	width: 18rem;
	font-family:'Roboto Slab';
	overflow: hidden;}

.effect.effectswbc {
	transition: all 0.2s linear 0s;}

.effect.effectswbc:after {
	font-family: fontello;
	content: "\020\020\e885";}

.effect.effectswbc:before {
	font-family: fontello;
	content: "\e885";
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	left: 0px;
	width: 100%;
	height: 100%;
	text-align: center;
	font-size: 1.6rem;
	transform: scale(0, 1);
	transform-origin: left center;
	transition: all 0.2s linear 0s;}

.effect.effectswbc:hover {
	text-indent: -9999px;}

.effect.effectswbc:hover:before {
	transform: scale(1, 1);
	text-indent: 0;}


/* ########### Kategoriebox ########### */

.CatBox,.CatBox25 {
	overflow: hidden;}

.CatBox a img.CatBoxHG,.CatBox25 a img.CatBoxHG {
	-webkit-transform: scale(1);
	transform: scale(1);
	transition: all 0.5s ease-in-out;}

.CatBox a:hover > img.CatBoxHG, .CatBox25 a:hover > img.CatBoxHG  {
	scale: 1.2;
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	transition: all 0.5s ease-in-out;}

.CatBox .CatBoxVG svg, .CatBox25 .CatBoxVG svg {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 100% !important;}

.CatBox25 {/*! border-bottom: 20px solid #fff; */}
.CatBox25 svg {border-bottom: 20px solid #fff;}

.svgBox {
	height: max-content}

.str0 {stroke:white;stroke-width:0}
.fil2 {fill:#fff}
.fil0 {fill:none}
.fil1 {fill:white;fill-rule:nonzero}

/* ########### Accordion ########### */
.card {
	color: #4B555A;
	background-color: transparent;
	background-clip: border-box;
	border: none;
	border-radius: 0rem;
	border-bottom: 1px solid #fff !important;
	background: #fff;}

.last div.accordion .card {
	border-bottom: none !important;}

.card-header {
	border-radius: 0}

.card-header:focus {
	background: #f0f;}

.btn-link:hover {
	color: #fff;}

.btn-link {
	font-weight: 700;
	font-size: 1.4rem;
	color: #fff;
	padding:1.2em;}

.btn-link::before {
	font-size: 1.6rem !important;
	position: relative;
	top: 1px;
	color: #fff;}
.collapse {background:#eee;}

.card-body {
	background: #EEEEEE;
	padding:1.6em;
}

button.accordion {
	background: #58585a;
	width: 100%;
	text-align: left;}

button.accordion i {
	display: block;
	float: right;}

.btn-link::focus {
	text-decoration: none !important;}

.btn-link .icon-open, .btn-link .icon-close {font-size:2rem;line-height:1px;}

/*############ Widget im Accordion ########### */
.yolawo-widget {
height: 300px !important}

/*############ Tabelle ########### */
table {
	border: 1px solid #777;}

th {
	padding: 3px 10px;
	background: #ddd;}

td {
	padding: 3px 10px;
	border: 1px solid #777;}

table tr:nth-child(2n) {
	background: #ddd !important;}

table .sonderbreite td:nth-child(2), table .sonderbreite td:nth-child(3) {width:120px!important;text-align:right;}


/* ########### Formular ########### */ 

fieldset#formularA input:focus,fieldset#formularB input:focus {
	outline:2px solid silver;}

.selectWrapper {
	position: relative;
	z-index: 1;
}

.selectWrapper select {
	position: relative;
	z-index: 10;
}

.selectWrapper:after {
	content: '▼';
	color: orange;
	line-height: 2.9;
	position: absolute;
	right: .8em;
	cursor: pointer;
}

.error {color: red;font-size: 1.3rem;}
.code img {width: 120px;}

::-webkit-input-placeholder {font-size: 1rem;font-family: 'Open Sans';font-style: normal;color:#ee7f00!important}
:-ms-input-placeholder {font-size: 1rem;font-family: 'Open Sans';font-style: normal;}
::placeholder {font-size: 1rem;font-family: 'Open Sans';font-style: normal;}

fieldset#formularA,
fieldset#formularB {
	font-family: 'Open Sans';
	font-style: normal;
	width: 48%;
	border: none;
	padding: 0;
	overflow: hiddden;
	float: left;}

fieldset#formularA {margin-right: 1%}
fieldset#formularB  {margin-left: 1%}

div[class^="invalid_"] {
	background: #333;
	display: inline-flex;
	color: #fff;
	font-size: .8rem;
	border-radius: 4px;
	padding: 1rem;
	position: absolute;
	margin-top: -3rem;
	display: none;
	line-height: 1;
	z-index: 1; }

fieldset#formularA input,
fieldset#formularB input {
	border-radius: 0;
	width: 100%;
	border: 1px solid silver;
	padding: 10px;
	margin-bottom: 2%;
	height: 3rem;
	font-size: 1rem;}

fieldset#formularB input#datenschutz {width:20px;height:20px;padding:0;margin-bottom:-5px;;}

fieldset#formularA input:focus,fieldset#formularB input:focus {
	outline:2px solid silver;}

fieldset#formularA select {
	font-family: 'Open Sans';
	font-style: normal;
	margin-bottom: 2%;
	height: 3rem;
	border-radius: 0;
	-webkit-appearance: none;
	width: 100%;
	padding: 10px;
	border: 1px solid silver;
	color: rgba(238, 127, 0, .5);
	background: transparent !important;
	font-size: 1rem;}

fieldset#formularA select option  {	
	color: black;}

fieldset#formularA textarea, fieldset#formularB textarea {
	border-radius: 0;
	-webkit-appearance: none;
	width: 100%;
	padding: 10px;
	border: 1px solid silver;
	height: 100px;
	font-size: 1rem;}

fieldset#formularB .textareaform2 {height:172px;}

fieldset#formularA textarea:focus, fieldset#formularB textarea:focus {
	outline:2px solid silver;}

fieldset#formularA #Geburtsdatum {
	display: none;}

#formularB input#captcha {
	font-family: 'Open Sans';
	font-weight: 700;
	font-size: 1.4rem;
	letter-spacing: 0.2rem;}

#formularB .Datenschutz {
	font-size: 0.8rem;}

#formularB .sendform {
	margin-top: 20px;
	background: #0055a7;
	background: #fff;
	width: 50%;
	color: #ee7f00;
	border: 2px solid #ee7f00;
	outline: none;
	text-transform: uppercase;
	font-size: 1rem;
	border-radius: 0px;}

#formPartAfter .sendform {
	margin-top: 20px;
	background: #0055a7;
	background: #fff;
	width: 394px;;
	color: #ee7f00;
	border: 2px solid #ee7f00;
	outline: none;
	text-transform: uppercase;
	font-size: 1rem;
	border-radius: 0px;}

#formularB .sendform:hover, #formPartAfter .sendform:hover {
	background: #ee7f00;
	color: #FFF;}

.containerC {clear:both;}

.underlinebutton {
	background-color: #fff;
	border: none;
	color:#ee7f00;
	margin: 0;
	line-height: 1.3em;}


/* ########### Maps ########### */
.SVG-mapSVG-mapstr7 {stroke:#59585A;stroke-width:17.07}
.SVG-mapstr3 {stroke:#D8D6D7;stroke-width:34.15;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr8 {stroke:#FEFEFE;stroke-width:42;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr6 {stroke:white;stroke-width:68.3;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr5 {stroke:#B4B1B3;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr0 {stroke:#E0DEDF;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr2 {stroke:#C2E5F5;stroke-width:102.45;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr4 {stroke:#B4B1B3;stroke-width:239.04;stroke-linecap:round;stroke-linejoin:round}
.SVG-mapstr1 {stroke:#E0DEDF;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:256.350000 205.080000}
.SVG-mapfil0 {fill:none}
.SVG-mapfil3 {fill:#075EA8}
.SVG-mapfil6 {fill:#22BAE2}
.SVG-mapfil7 {fill:#37A2DC}
.SVG-mapfil5 {fill:#59585A}
.SVG-mapfil1 {fill:#88BA25}
.SVG-mapfil4 {fill:#EE8004}
.SVG-mapfil2 {fill:white}

.SVG-Pmap-str7 {stroke:#59585A;stroke-width:17.07}
.SVG-Pmap-str3 {stroke:#D8D6D7;stroke-width:34.15;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str8 {stroke:#FEFEFE;stroke-width:42;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str6 {stroke:white;stroke-width:68.3;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str5 {stroke:#B4B1B3;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str1 {stroke:#E0DEDF;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str2 {stroke:#C2E5F5;stroke-width:102.45;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str4 {stroke:#B4B1B3;stroke-width:239.04;stroke-linecap:round;stroke-linejoin:round}
.SVG-Pmap-str0 {stroke:#E0DEDF;stroke-width:85.37;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:256.350000 205.080000}
.SVG-Pmap-fil0 {fill:none}
.SVG-Pmap-fil1 {fill:#075EA8}
.SVG-Pmap-fil5 {fill:#37A2DC}
.SVG-Pmap-fil3 {fill:#59585A}
.SVG-Pmap-fil2 {fill:#EE8004}
.SVG-Pmap-fil4 {fill:white}

#map { width: 100%;margin: auto; text-align: center;margin: 10px;padding: 20px;height: 600px;}
#mapInfo {position: absolute;}


.infobox {
	position: absolute;
	top: -510px;
	padding: 0 10px;
	background: rgba(255,255,255,1);
	display: none;
	z-index: 100;
	box-shadow:2px 2px 6px 2px #888;
	width: 320px;}


.infoboxBeschreibung { 
	clear: both;
	float:left;
	width: 100%;
}

.infobox i {
	font-size: 1.4rem;}

.infoboxBeschreibung table,.infoboxBeschreibung td {	border: none;}
.infoboxBeschreibung td {vertical-align: top;;padding: 0 0 0 5px}
.infoboxBeschreibung td:first-of-type {width: 2.4rem;padding: 0;text-align: center;}

.infobox .infoboxBeschreibungImage		{margin-bottom: 1rem;}
.infobox .infoboxBeschreibungTitel		{font-family: 'Roboto Slab';font-size: 1.4rem;margin: 1rem 0 1rem 0;}
.infobox .infoboxBeschreibungStrasse		{border-bottom: 1px solid grey;line-height: 1.5rem;padding-bottom: 0.5rem;}
.infobox .infoboxBeschreibungInfo1		{border-bottom: 1px solid grey;;padding-top: 0.5rem;;padding-bottom: 0.5rem;}
.infobox .infoboxBeschreibungInfo2			{border-bottom: 1px solid grey;padding-top: 0.5rem;;padding-bottom: 0.5rem;}
.infobox .infoboxBeschreibungInfo3		{padding-top: 0.5rem;;padding-bottom: 0.5rem;}
.infobox .infoboxBeschreibungMehr			{}
.infobox .infoboxBeschreibung .icon-plug			{font-size: 1rem;}

.infobox.parkierung i {color: #075EA8;}
.infobox.swbc i {color: #EE8004;}
.infobox.grau i {color: #58585A;}
.infobox.bus i {color: #2FBEE3;}
.infobox.bad i {color: #88BA25;}

.infobox a.close {
	margin-top: 10px;
	margin-right: 10px;
	position: absolute;
	right: 0;
	display: block;
	border: none;
	float: right;}

a.LinkInfobox {
	border: 1px solid #58585A;
	background: #58585A;
	font-family: 'Roboto Slab';
	color: #FFF;
	padding: 0.8rem 2rem;
	width: 100%;
	display: block;
	text-decoration: none;
	margin-top: 1rem;
	margin-bottom: 1rem;
	transition: all 0.5s ease-in-out;}

a.LinkInfobox:after {
	text-decoration: none;
	font-family: fontello;
	color: #EE7F00;
	content: "\00a0\e885\00a0\00a0\00a0";}

a.LinkInfobox:hover {
	transition: all 0.5s ease-in-out;}

a.LinkInfobox:hover:after{
	content: "\00a0\00a0\00a0\00a0\e885";
	transition: all 2.2s linear 0s;}


/* ########### iFrame ########### */
iframe.ding {
	border: none;
	width: 100%;
	height: 700px;}


/* ########### Footer ########### */
.footer {background: #58585a;color:#fff;}
.footer a {color:#fff;text-decoration: none;}
.footerlogo {margin: 70px 0;}
.footerA, .footerB, .footerC {border-left:1px solid #fff;padding-left:30px;}
.Fuss_ende {margin-top:5%;
	text-align: center !important;
	font-size: 13px;}
.footername {font-family: 'Roboto Slab'}
.footer .helper {background: red;text-align: center;}