@import url(/media/system/css_1/normalize.css);
@import url(/media/system/bootstrap_1/3_3_5/css/bootstrapmin.css);

@import url(/media/system/css_1/font_awesome/font-awesome_min.css);

*{ /*schaltet orangene "active-Markierung" aus (unter Android)*/
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0); 
	-webkit-tap-highlight-color: transparent;  /* i.e. Nexus5/Chrome and Kindle Fire HD 7*/
    -webkit-focus-ring-color: rgba(255, 255, 255, 0);
    outline: none !important;
} 

html{
	font-size: 14px;/*?*/
	/* Alle weiteren Größenangaben in rem beziehen sich auf diese 14px */
}

body{
	font-family: "Arial", sans-serif;
	letter-spacing: 0.01rem; /*muss durch padding ausgeglichen werden? Wird Element ("wirklicher Inhalt") dadurch größer? In manchen Browsern?*/
	line-height: 1.5rem; /*21px bei Schrift 14px */
	padding-top: 70px;/*3.571rem;50px*/	
	background: #fff;
	-moz-hyphens: auto;
   	-o-hyphens: auto;
   	-webkit-hyphens: auto;
   	-ms-hyphens: auto;
   	hyphens: auto;
}

/* ###### Basics ##################################################*/

h1,h2,h3,h4,h5,h6{
	font-family: "Tahoma", sans-serif;
	/*-moz-hyphens: none; für #aufmacher-Headlines in MediaQueries ab MD eingebaut
   	-o-hyphens: none;
   	-webkit-hyphens: none;
   	-ms-hyphens: none;
   	hyphens: none;*/
}

ol,ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

ul.list-style{
	list-style: disc;
	margin-left: 1rem;
}
ul.list-style ul{
	list-style: circle;
	margin-left: 3.214rem;
}
ul.list-style ul ul{
	list-style: square;
}

ul.list-style li{
	position: relative;
	line-height: 1.5em;/*em!*/
}


ul li{
	line-height: 1.429rem;
}

/* ist in Bootstrap enthalten
.hidden{
	display: none;
}*/

.alert{/*Bootstrap-Überschreibung*/
	padding: 0.083rem 0.5rem;
	margin-bottom: 10px;
}

.rechtsbuendig{ /*=text-right in Bootstrap?*/
	text-align: right;
}

#unserBody{
	max-width: 100%;
	width: 100rem;
	margin: 0 auto;
	float: none;
}

#wrapper{ /*Inhalt (außer Werbebanner) in >=md*/
	position: relative;
	float: left;
}


/* ##### allgemeine Layoutklassen #################################### */

/*
.punkt{
	display: inline-block;
	position: relative;
    width: 1rem;
    height: 1rem;
    top: 0.143rem;
    left: -0.357rem;
    border-radius: 0.286rem;
}
*/

.bg-lebenInDortmund{
	background: #B12C19;
}
.bg-freizeitUndKultur{
	background: #6C9023;
}
.bg-wirtschaft{
	background: #63718B;
}
.bg-tourismus{
	background: #CC6633;
}
.bg-buergerserviceUndRathaus{
	background: #698175;
}
.bg-allgemein{
	background: #ccc;
}
.bg-home{
	background: goldenrod;
}

.bg-red{
	background: #ee0000;;
}

.bg-lightgrey{
	background: #e8e8e8;
}

.bg-lightergrey{
	background: #fafafa;
}

.bg-darkgrey{
	background: #666;
	color: #e8e8e8;
}

.bg-white{
	background: #fff;
}

.bg-twitter{
	background: #55acee;
}

.bg-twittertweets{
	background: url(/media/system/seitenelemente/background_twitter_DetailGross.jpg) repeat-y top left;
}

.bg-readspeaker{
	background: url(/media/system/seitenelemente/readspeaker.jpg) no-repeat top right;
}

.bg-facebook{
	background: #3b5998;
}

.bg-instagram{
	background: #517fa4;
}

.bg-youtube{
	background: #bb0000;
}

.bg-youtubevideo{
	background: url(/media/system/seitenelemente/background_youtubevideo_DetailNormal.jpg) repeat top left;
}

.bg-googleplus{
	background: #d34836;
}

.bg-googlemaps{
	background: url(/media/system/seitenelemente/background_googlemaps_DetailGross.jpg) repeat top left;
}

.bg-pinterest{
	background: #cb2027;
}

.bg-transparent{
	background: rgba(0, 0, 0, 0.5);
}

.fa.allgemein{
	background: transparent;
	color: #999;
	position: relative;
	left: -0.357rem;
}
.fa.home{
	background: transparent;
	color: goldenrod;
	position: relative;
	left: -0.357rem;
}

.dode-border{	/*(nur?) für h2*/
	margin-top: 1.429rem; /*20px*/
	margin-bottom: 0;
	border-top: 0.286rem solid #e8e8e8;
	line-height: 150%;
	padding-top: 0.5rem;
	padding-bottom: 0.714rem;
}

.dode-border-small{
	border-top: 0.143rem solid #e8e8e8;
}


.dode-box-border{
	border-top: 0.286rem solid #e8e8e8;
	border-right: 0.286rem solid #e8e8e8;
	border-bottom: 0.286rem solid #e8e8e8;
	border-left: 0.286rem solid #e8e8e8;
}

.dode-box-border-fine{
	border-top: 0.071rem solid #e8e8e8;
	border-right: 0.071rem solid #e8e8e8;
	border-bottom: 0.071rem solid #e8e8e8;
	border-left: 0.071rem solid #e8e8e8;
}

.dode-box-border-fine-grey-d{
	border-top: 0.071rem solid #ddd;
	border-right: 0.071rem solid #ddd;
	border-bottom: 0.071rem solid #ddd;
	border-left: 0.071rem solid #ddd;
}

.dode-border-left-grey-d{
	border-left: 0.286rem solid #ddd;
}


.dode-border-top-fine{
	border-top: 0.071rem solid #ddd;
}

.border-top-dotted{
	border-top: 0.071rem dotted #999;
}

.border-bottom-dotted{
	border-bottom: 0.071rem dotted #999;
}


.noborder{
	border-top: 0;
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
}

.col-nofloat, .col-xs-nofloat{
	float: none;
	clear: both;
}

.dode-box-padding{
	padding-top: 1.071rem;
	padding-right: 1.071rem;
	padding-bottom: 1.071rem;
	padding-left: 1.071rem;
}

.dode-box-padding-05x{
	padding-top: 0.5rem;
	padding-right: 0.5rem;
	padding-bottom: 0.5rem;
	padding-left: 0.5rem;
}

.nopadding{
	padding-top:0;
	padding-right:0;
	padding-bottom:0;
	padding-left:0;
}
.nopaddingTop{
	padding-top:0;
}
.nopaddingBottom{
	padding-bottom:0;
}

.nomargin{
	margin-top: 0;	
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

.nomargin-top{
	margin-top:0;
}
.nomargin-bottom, .hauptText p.nomargin-bottom, .hauptText ul.nomargin-bottom{
	margin-bottom:0;
}



.col-abstandOben{
	margin-top: 1.071rem;
}
.col-abstandOben-2x{
	margin-top: 2.143rem;
}
.col-abstandOben-2_5x{
	margin-top: 2.643rem;
}
.col-abstandOben-4x{
	margin-top: 4.286rem;
}


.col-abstandOben-4px{
	margin-top: 0.286rem;
}
.col-abstandOben-5px{
	margin-top: 0.357rem;
}


.col-abstandUnten{
	margin-bottom: 1.071rem;
}
.col-abstandUnten-2x{
	margin-bottom: 2.143rem;
}
.col-abstandUnten-2_5x{
	margin-bottom: 2.643rem;
}

.col-negAbstandUnten-2x{
	margin-bottom: -2.143rem;
}

.col-abstandRechts{
	margin-right: 1.071rem;
}
.col-abstandRechts-2x{
	margin-right: 2.143rem;
}
.col-abstandRechts-3px{
	margin-right: 0.214rem;
}

.col-abstandLinks{
	margin-left: 1.071rem;
}
.col-abstandLinks-2x{
	margin-left: 2.143rem;
}
.col-abstandLinks-3px{
	margin-left: 0.214rem;
}


.col-paddingTop{
	padding-top: 1.071rem;
}
.col-paddingTop-2x{
	padding-top: 2.143rem;
}
.col-paddingTop-1_5x{
	padding-top: 1.571rem;
}
.col-paddingBottom{
	padding-bottom: 1.071rem;
}
.col-paddingBottom-2x{
	padding-bottom: 2.143rem;
}
.col-paddingBottom-1_5x{
	padding-bottom: 1.571rem;
}

.col-paddingLeft{
	padding-left: 1.071rem;
}
.col-paddingRight{
	padding-right: 1.071rem;
}
.col-paddingRight-3px{
	padding-right: 0.214rem;
}
.col-paddingLeft-14px{
	padding-left: 1rem;
}


.width-xs-13pz{
	width: 13%;
}


.cols-equal-xs-2{
	width: 50%;
}
.cols-equal-xs-3{
	width: 33.333%;
}
.cols-equal-xs-4{
	width: 25%;
}
.cols-equal-xs-5{
	width: 20%;
}
.cols-equal-xs-6{
	width: 16.666%;
}
.cols-equal-xs-7{
	width: 14.285%;
}
.cols-equal-xs-8{
	width: 12.5%;
}
.cols-equal-xs-9{
	width: 11.1%;
}
.cols-equal-xs-10{
	width: 10%;
}
.cols-equal-xs-11{
	width: 9.09%;
}
.cols-equal-xs-12{
	width: 8.333%;
}


.relative{
	position: relative;
	display: block;
}

.left-2px{
	position: relative;
	left: 0.143rem;
}

.top-minus3px{
	position: relative;
	top: -0.214rem;
}

.top-15px{
	position: relative;
	top: 1.071rem;
}

.top-minus25px{
	position: relative;
	top: -25px;
}

.static{
position: static;
}

.absolut-rechts{
	position: absolute;
	right:0;
}

.absolut-mittig{ /*richtet Element horizontal und vertikal mittig aus an "umgebendem position: relative;"*/
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.absolut-unten-links{
	position: absolute;
	top: 100%;
	left: 0;
	-webkit-transform: translate(0%, -110%);
	-moz-transform: translate(0%, -110%);
	-ms-transform: translate(0%, -110%);
	-o-transform: translate(0%, -110%);
	transform: translate(0%, -110%);
}

.absolut-unten-rechts{
	position: absolute;
	top: 100%;
	left: 100%;
	-webkit-transform: translate(-110%, -110%);
	-moz-transform: translate(-110%, -110%);
	-ms-transform: translate(-110%, -110%);
	-o-transform: translate(-110%, -110%);
	transform: translate(-110%, -110%);
}



.absolut-oben-rechts{
	position: absolute;
	top: 0;
	left: 100%;
	-webkit-transform: translate(-110%, 10%);
	-moz-transform: translate(-110%, 10%);
	-ms-transform: translate(-110%, 10%);
	-o-transform: translate(-110%, 10%);
	transform: translate(-110%, 10%);
}

.absolut-oben-links{
	position: absolute;
	top: 0;
	left: 0;
/*
	-webkit-transform: translate(10%, 10%);
	-moz-transform: translate(10%, 10%);
	-ms-transform: translate(10%, 10%);
	-o-transform: translate(10%, 10%);
	transform: translate(10%, 10%);
*/
}

.absolut-oben-rechts-paddingBox{
	position: absolute;
	top: 0;
	left: 100%;
	-webkit-transform: translate(-85%, -30%);
	-moz-transform: translate(-85%, -30%);
	-ms-transform: translate(-85%, -30%);
	-o-transform: translate(-85%, -30%);
	 transform: translate(-85%, -30%);
}


.trennlinie{
    border-bottom: 0.071rem dotted #aaa;
    margin-bottom: 0.714rem;
    padding-bottom: 0.714rem;
}

.runde-ecken{
	-webkit-border-radius: 0.286rem;
	-moz-border-radius: 0.286rem;
	border-radius: 0.286rem;
}

.floatBox{
	/*float: left; Unnötig, da immer in Kombination mit col-xyz-123?*/
	margin-right: 2.143rem;
	margin-bottom: 2.143rem;
}

.dode-flexbox-container-multiline, .dode-flexbox-container-singleline{
	display: inherit;
	display: -webkit-box;
	display: -moz-box;
 	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	flex-direction: row;/*Elementanordnung in Zeile von links nach rechts*/
	align-items: stretch; /* default: alle Elemente bekommen gleiche Höhe*/
	justify-content: flex-start;/*default*/	
	flex-wrap: wrap;/*nicht alle Elemente in einer Zeile, sondern "wie's gebraucht wird"*/
	align-content: stretch;/*alle Zeilen bekommen gleiche Höhe (Höhe des Containers nötig)*/
}

}/*diese Klammer bitte stehenlassen, obwohl falsch. Gibt sonst einen Fehler in der Aufmacherdrehscheibe im IE. Grund unbekannt...*/
.dode-flexbox-container-singleline{
	flex-wrap: nowrap;/*default: alle Elemente in einer Zeile = gleichmäßige Aufteilung der Elemente: keine Elementbreite angeben!*/
    display: -webkit-flex;
    -webkit-flex-wrap: wrap;
}

/* nötig? --> Ohne flex:1 ist Drehscheiben-Fehler nicht mehr da
.dode-flexbox-container-singleline div:first-child{
    flex:1;
    -webkit-box-flex:1; 
    -webkit-flex:1;
}
*/


.dode-flexbox-element{
	flex-grow: 0; /*default: Element wird größer, wenn nötig*/
	flex-shrink: 1;/*default: Element wird kleiner, wenn nötig*/
	flex-basis: auto;/*?irgendwas mit Abständen*/
	/*flex: 0 0 1;*/
}

.transparent{
	opacity: 0.8;
}
.intransparent{
	opacity: 1;
}

.nowrap{
	white-space: nowrap;
}
.defaultwrap{
	white-space: normal;
}

.cursor-default{
	cursor: default;
}

.cursor-pointer{
	cursor: pointer;
}

/* ###################### */
/* ## Schrift ########### */

.font-bold{
	font-weight: bold;
}

.font-italic{
	font-style:italic;
}

.font-uppercase{
	text-transform: uppercase;
}

.font-normal{
	font-weight: normal;
	font-style:normal;
	text-transform: none;
}


.font-9{ /*alle auf rem, Basis html (14px)*/
	font-size: 0.643rem;
}
.font-10{
	font-size: 0.714rem;
}
.font-11{
	font-size: 0.786rem;
	line-height: 1.143rem;
}
.font-12{
	font-size: 0.857rem;
	/*line-height: 1.286rem; verschiebt u.a. Uhr-Symbol und Uhrzeit in VK. Warum?*/
}
.font-13, .hauptText p span.fa.fa-external-link, .listeAllgemein span.fa.fa-external-link, .themenUebersicht span.fa.fa-external-link{
	font-size: 0.929rem;
	line-height: 1.286rem;
}
.font-14, .hauptBox.font-16 span.fa{
	font-size: 1rem;
	line-height: 1.429rem;
}
.font-16{
	font-size: 1.143rem;
	line-height: 1.714rem;/*24px*/
}
.font-18{
	font-size: 1.286rem;
}
.font-20{
	font-size: 1.429rem;
	line-height: 2.143rem;/*30px*/
}
.font-22, .hauptBox.font-16 legend.font-22 span.fa{
	font-size: 1.571rem;
	line-height: 2.357rem;
}
.font-23{
	font-size: 1.643rem;
}
.font-24{
	font-size: 1.714rem;
}
.font-26{
	font-size: 1.857rem;
}
.font-28{
	font-size: 2rem;
	line-height: 2.714rem;
}
.font-30{
	font-size: 2.143rem;
}
.font-35{
	font-size: 2.5rem;
}
.font-40{
	font-size: 2.857rem;
}
.font-50, .hauptBox.font-16 span.fa.font-50{
	font-size: 3.571rem;
}
.font-80{
	font-size: 5.714rem;
}

.line-height-1rem{
	line-height:1rem;
}

.font-grey-e8{
	color: #e8e8e8;
}
.font-grey-3{
	color: #333;
}
.font-grey-6{
	color: #666;
}
.font-grey-7{
	color: #777;
}
.font-grey-9{
	color: #999;
}
.font-grey-b{
	color: #bbb;
}
.font-grey-d{
	color: #ddd;
}
.font-lightgrey{
	color: #e8e8e8;
}
.font-linkred{
	color: #ba4b3b;
}
.font-red{
	color: #ee0000;
}
.font-white{
	color: #fff;
}
.font-twitter{
	color: #55acee;
}
.font-facebook{
	color: #3b5998;
}
.font-instagram{
	color: #517fa4;
}
.font-youtube{
	color: #bb0000;
}
.font-googleplus{
	color: #d34836;
}
.font-pinterest{
	color: #cb2027;
}
.font-readspeaker{
	color: #ef6600;
}
.font-lebenInDortmund{
	color: #B12C19;
}
.font-freizeitUndKultur{
	color: #6C9023;
}
.font-wirtschaft{
	color: #63718B;
}
.font-tourismus{
	color: #CC6633;
}
.font-buergerserviceUndRathaus{
	color: #698175;
}
.font-allgemein{
	color: #ccc;
}
.font-home, font-maps{
	color: goldenrod;
}


.headline-detail{
	font-size: 2rem;/*wie .font-28*/
	line-height: 2.714rem;/*wie .font-28*/
}

.dachzeile-detail{
	font-size: 1.143rem;/*wie .font-16*/
	text-transform: uppercase;
}

.headline-large{
	font-size: 1.857rem;
}
.headline-medium{
	font-size: 1.429rem;
	line-height: 1.857rem;/*26px*/
}
.headline-small{
	font-size: 1rem;
	font-weight: bold;
	line-height: 1.429rem
}
.dachzeile{
	font-size: 1rem;
	text-transform: uppercase;
	margin-top: 0; /*z.T. Bootstrap-Überschreibung*/
}


/* ##################################################################### */
/* ## Links + Linkbereiche ############################################# */


a/*, a:link, a:visited, a:active*/{
	color: #ba4b3b;
	text-decoration: none;
	word-wrap: break-word;

}

a:link, a:visited, a:active{
	text-decoration: none;
	outline: 0 none;
}

a:hover, a:focus, a:hover span.fa, a:focus span.fa,
a:hover i.fa-stack-2x, a:focus i.fa-stack-2x{
	color: #ba4b3b;
}

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

a:focus{
	outline: none;
	text-decoration: underline;
}



.dode-btn-uebersicht, .dode-btn-uebersicht:link, .dode-btn-uebersicht:visited{
	margin-top: 0.714rem;
	margin-bottom: 0.714rem;
	float: right;	
	/*border: 0.071rem solid #666;
	color: #fff;
	background: #8e8e8e;
	font-weight: bold;*/
	
}

.dode-btn-linkstyle{
	color: #ba4b3b; /*linkred*/
	border: 0;
	background-image: none;
	background-color: transparent;
}

.dode-btn-linkstyle:hover, .dode-btn-linkstyle:focus{/*bootstrap-Überschreibung*/
	background-color: none;
	border-color: none;
	color: #ba4b3b; /*linkred*/
}
.dode-btn-linkstyle:hover, .dode-btn-linkstyle:active, .dode-btn-linkstyle:focus {
	outline:0 none;
}


/*
.dode-btn-uebersicht:hover, .dode-btn-uebersicht:focus{
	background: #aaa;
}*/

/* Button -> Knopf welcher kein Link ist aber mit Schaltfunktion!? */
.btn-blank {
background-color:transparent;
border:0 none;
padding-left: 0;
white-space: normal;
text-align:left;
}

.btn-blank[data-toggle="collapse"][aria-expanded="false"] .fa:before {
content: "\f107";
font-size: 1.2rem;
}

.btn-blank[data-toggle="collapse"][aria-expanded="true"] .fa:before {
content: "\f106";
font-size: 1.2rem;
}

.btn-blank:hover, .btn-blank:active, .btn-blank:focus {
outline: 0 none;
}

/* Button wie Überschrift */
.btn.h2 {
margin-bottom: 10px;
line-height: 1.1;
padding: 0px;
text-align:left;
}

.btn.h2 .fa {
display:none;
}

.btn[data-toggle="collapse"].h2 .fa {
display:inline-block;
}

/* Button autotoggle */
button.toggleOff, button.toggleOff:hover {
	background-color:transparent;
	border:0 none;
	padding-left: 0;
	white-space: normal;
	font-size: 1.571rem;
	cursor:default;
}


li a, li a:link, li a:visited{
	position: relative;
	display: block;
	margin-left: 1.333rem; /*1.857rem;*/
}
ul.linkListe li a, ul.linkListe li a:link, ul.linkListe li a:visited,
ul.linkListe li div.azBeschreibung{
	margin-left: 1.857rem;
}


ul.list-style li a, ul.list-style li a:link, ul.list-style li a:visited{
	display: inline;
}


li a span.fa, li a:link span.fa, li a:visited span.fa{
	position: absolute;
	top: 0.286rem;
	left: -1.5rem; /*--1.333rem; 1.857rem;*/
}
ul.linkListe li a span.fa, ul.linkListe li a:link span.fa, ul.linkListe li a:visited span.fa{
	left: -1.857rem;
}


ul.list-style li a span.fa, ul.list-style li a:link span.fa, ul.list-style li a:visited span.fa,
.hauptBox.font-16 span.fa{
	top: 0;
}




/* mik */
#navMeta li a span.fa, #navMeta li a:link span.fa, #navMeta li a:visited span.fa{
	position: relative;
	top: 0;
	left:0;
}

a.element, a.element:link, a.element:visited{
	display: block;
	overflow: auto;
	padding-bottom: 0.357rem;
	border-bottom: 0.071rem dotted #ddd;
}

a.elementHorizontal, a.elementHorizontal:link, a.elementHorizontal:visited{
	display: block;
	overflow: auto;
}
.elementHorizontal{
	border-left: 0.071rem dotted #ddd;
}
.elementHorizontal img{
	width: 100%;
}
.elementMarker{
	margin-top: 1.419rem;
}

.elementHorizontal:nth-of-type(1){
	border-left: none;
}

.bilderstrecke .linkElement{
	height: 100%;
}

a.element:hover, a.element:focus,
a.elementHorizontal:hover, a.elementHorizontal:focus,
a.listeElement:hover, a.listeElement:focus,
a.linkElement:hover, a.linkElement:focus{
	background: #fafafa;
	text-decoration: none;
	color: #333;
}

a.linkElement:hover .fa.font-home, a.linkElement:focus .fa.font-home{
	color: goldenrod;/*wird sonst rot*/
}
a.linkElement:hover .fa.lizenz, a.linkElement:focus .fa.lizenz{
color: #999;
}

a .hover-underline:hover, a .hover-underline:focus{
	text-decoration: underline;
}

/*
.element{
	padding-top: 1.071rem;
}*/
.element:nth-of-type(1){
	padding-top: 0;
}
.themenUebersicht .element{
	padding-top: 0;
}

.bg-lightgrey a.element, .bg-lightgrey a.element:link, .bg-lightgrey a.element:visited{
	border-bottom: 1px dotted #aaa;	
}
.bg-lightgrey a.element:hover, .bg-lightgrey a.element:focus,
.bg-lightgrey a.listeElement:hover, .bg-lightgrey a.listeElement:focus,
a.galeriebox.bg-lightgrey:hover, a.galeriebox.bg-lightgrey:focus,
.btn.bg-lightgrey:hover, .btn.bg-lightgrey:focus{
	background: #eee;
}
.btn.bg-lightgrey:hover, .btn.bg-lightgrey:focus{
	background: #e5e5e5;
}


.pagination > li > a, .pagination > li > span{
	margin-left: -1px; /*Rücksetzung auf Bootstrap-Angaben*/
	color: #333;/*=default, Bootstrap-Überschreibung*/
	background-color:#eee; /*Bootstrap-Überschreibung*/
}
/*Bootstrap-Überschreibung*/
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover{
	background-color: #e5e5e5;
	color: #ba4b3b;/*=font-linkred*/
	border-color: #999;
}

/*Bootstrap-Überschreibung*/
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: #bbb;
	border-color: #999;
}
/*Bootstrap-Überschreibung*/
.pagination > .disabled > a, .pagination > .disabled > a:focus, .pagination > .disabled > a:hover, .pagination > .disabled > span, .pagination > .disabled > span:focus, .pagination > .disabled > span:hover{
	color: #bbb;
}

.pagination > li > span.hellip, .pagination > li > span.hellip:hover, .pagination > li > span.hellip:focus{
	border: 0;
	background: none;

}

/* -- Font-Awesome-Erweiterung ------------- */

/*Vergrößerungen*/
.fa-1_2x, .hauptBox.font-16 span.fa.fa-1_2x{
	font-size: 1.286em;
}
.fa-1_5x, .hauptBox.font-16 span.fa.fa-1_5x{
	font-size: 1.5em;
}
.fa-2_5x, .hauptBox.font-16 span.fa.fa-2_5x{
	font-size: 2.5em;
}
.fa-3_5x, .hauptBox.font-16 span.fa.fa-3_5x{
	font-size: 3.5em;
}
.fa-4_5x, .hauptBox.font-16 span.fa.fa-4_5x{
	font-size: 4.5em;
}

.fa-inverse{/*Überschreibung des original fa-Styles*/
	color: #e8e8e8;
}

.fa-rotate-45{
	transform: rotate(45deg)
}

/*Zusätzlich kombinierte Icons */
.fa-vcard{
	padding-left: 0.286rem;
}
.fa-vcard:before {
    content:'\f007';
}
.fa-vcard:after {
    content:'\f036';
    padding-left:0.286rem;
}

.fa-ics:before {
    content:'\f178';
}
.fa-ics:after {
    content:'\f073';
    padding-left:0.286rem;
}

.fa-bilderstrecke:before {
    content:'\f03e';
	font-size: 1rem;

}
.fa-bilderstrecke:after {
    content:'\f03e';
	font-size: 1rem;
}
.fa-bilderstrecke2:before {
    content:'\f03e';
	font-size: 1.143rem;
	position:relative;
	top:-0.786rem;
	left:0.143rem;
}
.fa-bilderstrecke2:after {
    content:'\f03e';/*fa-picture*/
	font-size: 1.143rem;
	position:relative;
	top:0.214rem;
	left:-0.214rem;
}
.fa-bilderstrecke2-zusatz:before {
    content:'\f07b';/*fa-folder*/
	font-size: 1.143rem;
	position:relative;
	top:-0.786rem;
	left:0.143rem;
}
.fa-bilderstrecke2-zusatz:after {
    content:'\f07b';
	font-size: 1.143rem;
	position:relative;
	top:0.214rem;
	left:-0.214rem;
}

span.fa{
margin-right: 0.214rem;
}
li span.fa, .adresse span.fa{
margin-right: 0.5rem;
}
span.fa.lizenz, li span.fa.lizenz, .adresse span.fa.lizenz,
.adresse span.fa.kkMarker, .listeAllgemein span.fa.kkMarker{ /*unterstrichene/dotted kk-Buttons*/
margin-right: -0.143rem;
}




/*KlippKlapp-Knöpfe / Collapse*/

*[aria-expanded="true"] > .fa.kkMarker,
*[aria-expanded="true"] > span > .fa.kkMarker,/*für A-Z*/
*[aria-expanded="true"] > div > .fa.kkMarker,/*für bspw. VK-Collection sm/md/lg*/
*[aria-expanded="true"] > div > div > .fa.kkMarker/*für bspw. VK-Collection xs*/
{
	transform: scale(1, -1);/* oder transform: rotate(180deg);*/
}



/* ##################################################################### */
/* ## Kopf ############################################################# */

#dued_banner {
	background-color:#7c7c7c;
	padding:2px 0;
	margin:8px 0;
}

#dued_banner a {
	display:block;
}

#kopf{ /*Logo + MetaNavi*/
	background: #fff;
	box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.5); /* wo ist das zu sehen?*/
}

#kopf .wappen{
	/*position: absolute;*/
	top: 1.786rem; /*25px*/
	left: 1.429rem;/*20px*/
	height: 3.571rem;/*50px*/

}

#kopf .urlPfadBild{
	/*position: absolute;*/
	top: 3.929rem;/*55px*/
	left: 15rem;/*210px*/
	height: 2.143rem;/*30px*/
}

#topNavbar{
	height: 5.714rem;
	margin-bottom: 0;
	border:0;
	border-radius: 0;
	background: transparent;
}

#topNavbar, #topNavbar > div.container-fluid {
height:auto;
}

.container-fluid > .navbar-header {
width:100%;
margin-left:0;
margin-right:0;
}

/***** Das Logo  *****/
.navbar-brand {
padding:0;
margin:0;
height:auto;
position:relative;
}

.navbar-brand a {
display:block;
} 

/* Große Kiste Logo */
#topNavbarlogoBox > a > figure, #kopf .wappen {
width:54px;
height:54px;	
}

/* Wortmarke dortmund.de -> ist immer da */
/* Große Kiste Wortmarke dortmund.de */
#topNavbarlogoBox > div > a:first-child {
width:107px;/*82px*/
height:20px;/*14px*/
float:left;
}

/* Zusätzliche Wortmarke -> optional! */
/* Große Kiste zusätzliche Wortmarke */
#wortmarke_2{
	height: 20px;
	margin-left:107px;
}


/* Logo einpassen */
#topNavbarlogoBox figure, #topNavbarlogoBox figure img {
width:100%;
height:100%;
}

/* Die Kiste mit den Wortmarken */
#topNavbarlogoBox > div {
position:absolute;
left:54px;
top:2px;
width:360px;
}

/* Das Logo -> Wappen */
#topNavbarlogoBox > a > figure {
background: url(/media/system/seitenelemente/logos/dortmund_de/wappenstadtdortmund.png);
background: url(/media/system/seitenelemente/logos/dortmund_de/wappenstadtdortmund.svg),linear-gradient(transparent, transparent);
background-repeat:no-repeat;
}

/* Wortmarke dortmund.de */
#topNavbarlogoBox > div > a:first-child figure {
background: url(/media/system/seitenelemente/logos/wortmarken/v2/dortmundDE.png);
background: url(/media/system/seitenelemente/logos/wortmarken/svg_wortmarken/dortmund_de.svg),linear-gradient(transparent, transparent);
background-repeat:no-repeat;
background-size: 115%/*contain*/;
}

#wortmarke_2 figure {


background-repeat:no-repeat;
background-size: contain;
}

/* Wenn eine zusätzliche Wortmarke kein Link ist, ist sie ein span */
span#wortmarke_2 {
display:block;
}

/***** Die Schalter *****/
#topNavbarMeta {
margin-top: 20px;
}

#topNavbarMeta .navbar-nav {
margin:0;
}

#topNavbarMeta  li {
float: left;
margin-left: 3px;
}

#topNavbarMeta li a {
min-width: 38px;
padding: 6px 0/*12px*/;
margin: 0;
text-align: center;
background-color:transparent;
color: #999;
width: 50px;
}

#topNavbarMeta li a:hover, #topNavbarMeta li a:focus,
#topNavbarMeta li a:hover span.fa, #topNavbarMeta li a:focus span.fa{
/*background-color:#666; TL auskommentiert 16.1.17*/
background: transparent;
color:#ba4b3b;
}
#topNavbarMeta li.active a, #topNavbarMeta li.active a:link, #topNavbarMeta li.active a:visited, #topNavbarMeta li.active a:focus span.fa, #topNavbarMeta li.active a:active span.fa,
a#mainNav-tab[aria-expanded="true"] > span.fa{
background: #ddd;
color: #fff;
}

#topNavbarMeta li .fa, .metaBoxClose .fa {
font-size:2rem;
}

/* Die Icons müssen hier nicht absolut sein */
#topNavbarMeta li a span.fa, #topNavbarMeta li a:link span.fa, #topNavbarMeta li a:visited span.fa {
	position: relative;
	top: 0;
	left: 0;
	margin-left:auto;
	margin-right: auto;
}

/* --- Der Suchschlitz --- */
/*Placeholder-Farbe ändern*/
imput#searchquery_1.form-control::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color:    #bbb;
}
input#searchquery_1.form-control:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #bbb;
    opacity:  1;
}
input#searchquery_1.form-control::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #bbb;
    opacity:  1;
}
input#searchquery_1.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color:    #bbb;
}

ul.ui-autocomplete, .ui-widget.ui-widget-content{ /*in Ergänzung zum Bootstrap-Plugin und zu den Inline-Styles*/
	z-index:2000;
	border:0.071rem solid #ebebeb;
}
ul.ui-autocomplete li.ui-menu-item{
	color: #666;
}

.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active,a.ui-button:active,.ui-button:active,.ui-button.ui-state-active:hover{
	background: #ebebeb;
	border:0.071rem solid #ebebeb;
	color: #666;
}


/* --- Das Suchformular! --- */
#topNavbarMeta form {
padding: 0 15px;
}

#topNavbarMeta .form-group {
margin-bottom: 0;
}

#topNavbarMeta .input-group {
width:250px;
border-bottom: 1px solid #ebebeb;
}

#topNavbarMeta .form-control {
height:auto;
}

#topNavbarMeta form input, #topNavbarMeta form button {
border: 0;
box-shadow: none;
padding: 6px 5px 6px 10px;/*6px 15px*/
border-radius: 0;
background:transparent;
}

#topNavbarMeta form button {
width: auto;
}

#topNavbarMeta form button:hover, #topNavbarMeta form button:focus,
#topNavbarMeta form button:hover span.fa, #topNavbarMeta form button:focus span.fa{
/*background-color:#666;TL auskommentiert 16.01.17*/
background: transparent;
/*color:#FFF;*/
color: #ba4b3b;
}

/***** Die Meta-Box *****/
#metaBox {
background-color: transparent;
margin-bottom: 0;
border-radius: 0;
min-height: 0;
}

/* Der Link zum Schließen der Box bei deaktiviertem JS */
#metaBox .metaBoxClose a {
display:block;
height:100%;
}

#metaBox > div, #metaBox > nav {
position:relative;
border-top: 4px solid #ebebeb;
padding-top:0;
/*margin-bottom: 15px;*/
}

/***** Der Box-Schließer *****/
/*#metaBox .metaBoxClose, #hauptMenu .metaBoxClose*/ .metaBoxClose{
position: absolute;
width: 50px;
right: 0;
left: auto;
top: 0;
bottom: 0;
background-color: #ebebeb;
text-align: center;
cursor:pointer;
}


/***** Der Box-Inhalt *****/
#metaBox .metaBoxContent {
padding-right: 15px;
padding-left: 15px;
padding-top: 15px;
padding-bottom: 15px;
margin-right:50px;
}

html.fixedHeader #metaBox .metaBoxContent {
background-color: #fafafa; /*#f2f2f2;*/
}

html.fixedHeader #metaBox .navTabContent {
padding-top:1px; /* Collapsing Margins verhindern */
padding-right:15px; /* Abstand zum Scrollbalken */
}

/***** A-Z *****/
ul.az > li > a, ul.az > li > span {
width: 2em;
height: 2em;
display: table-cell;
/*vertical-align: middle; TL auskommentiert 16.1.17*/
padding: 0;
/*border: none; TL auskommentiert 16.1.17*/
/*border-radius: 0; TL auskommentiert 16.1.17*/
font-size: 1.167rem;
/*background-color: #F5F5F5;*/
/*background-color: #999; TL auskommentiert 16.1.17*/
/*color:#f5f5f5; TL auskommentiert 16.1.17*/
color:#666;
}



/* ## MetaNavi ######################################################### */

#metaNavi{
	position: absolute;
	top: 0;
	right:1.071rem;/*15px*/
	color: #7e7e7e;
	z-index: 100;
	padding-left: 0;
	padding-right: 0;
}

#metaNavi ul li{
	float: right;
}

#metaNavi .nav-tabs{ /*Bootstrap-Überschreibung*/
	border-bottom: none;
}

/*
ul#metaNavi li{
	float: right;
}

ul#metaNavi li a{
	padding: 0 6px 0 5px;
	color: #7e7e7e;
}

ul#metaNavi li:first-child{

	margin-left: 1.571rem;
}

a.language, a.language:link, a.language:visited{
	z-index: 11;
	position: relative;
	top: -6px;
	color: #fff;
}

*/


/* ## PreWrapper / Anzeigen ############## */

#preWrapper{
		margin-bottom: 1.071rem;
}

/* ## Kopfpanoramen ############################################################# */

#kopfPanorama, #kopfPanoramaKlein{
	position: relative;
}

#kopfPanorama {
	margin-top: 1.071rem;
}
/* in col-xs-12 enthalten
#kopfPanorama > div {
	padding-left: 1.071rem;
	padding-right: 1.071rem;
}
*/
#kopfPanoramaKlein > div{
	padding-left: 0;
	padding-right: 0;
}


	#kopfPanorama .absenderKennungEnclosure{
		position: absolute;
		bottom: 0;
		left: 0;
		height: 100%;
		z-index: 30;
	}
	
	#kopfPanorama #absenderKennung{
		height: 100%;
	}

#kopfPanoramaKlein #absenderKennung{
	position: relative;
	padding-left: 0;
	padding-right: 0;
}
#kopfPanoramaKlein #absenderKennung.lebenInDortmund,
#kopfPanoramaKlein #absenderKennung.lebenInDortmund h1{
	background: #B12C19;
	border-bottom: 0.357rem solid #B12C19;/*5px*/
}
#kopfPanoramaKlein #absenderKennung.freizeitUndKultur,
#kopfPanoramaKlein #absenderKennung.freizeitUndKultur h1{
	background: #6C9023;
	border-bottom: 0.357rem solid #6C9023;	
}
#kopfPanoramaKlein #absenderKennung.wirtschaft,
#kopfPanoramaKlein #absenderKennung.wirtschaft h1{
	background: #63718B;
	border-bottom: 0.357rem solid #63718B;	
}
#kopfPanoramaKlein #absenderKennung.tourismus,
#kopfPanoramaKlein #absenderKennung.tourismus h1{
	background: #CC6633;
	border-bottom: 0.357rem solid #CC6633;	
}
#kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus,
#kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus h1{
	background: #698175;
	border-bottom: 0.357rem solid #698175;	
}
#kopfPanoramaKlein #absenderKennung.allgemein,
#kopfPanoramaKlein #absenderKennung.allgemein h1{
	background: #333333;
	border-bottom: 0.357rem solid #333333;	
}

#kopfPanoramaKlein #absenderKennung h1, #kopfPanorama #absenderKennung h1{
	color: #fff;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1rem;
	padding-left: 0.357rem;
	padding-right: 0.357rem;
	padding-top: 0.357rem;
	padding-bottom: 0.357rem;
	position: absolute;
	bottom: -0.786rem;
}

	#kopfPanorama #absenderKennung h1{
		font-size: 1.071rem;
		line-height: 1.429rem;
		text-align: right;
		right: 0;
		left: 0;
		padding-top: 1.071rem;
		padding-bottom: 1.071rem;
		padding-left: 1.071rem;
		padding-right: 1.071rem;
		bottom: -0.429rem;
	}


.kopfPanoramaImg{
	padding-left: 0;
	padding-right: 0;
}

/*..oder <img class="img-responsive"...: ABER da "nur" max-width:100%; statt width:100%; --> Bild skaliert nur bis Originalgröße*/
.kopfPanoramaImg img{
	width: 100%;
	height: auto;
}


/* --- Carousel / PanoramaSlider (Bootstrap) ------------ */

#carousel-top-slider picture {
	display:block;
}

#kopfPanorama .carousel-content > div{
	position: absolute;
	top:0;
	left:0;
	height: 100%;
	bottom: 0;
	/*background: blue;*/
}

#kopfPanorama .carousel-content a{
	position: relative;	
	left:-1.071rem;
	display: block;
	background: /*red;*/rgba(0, 0, 0, 0.5);
	height: 100%;
}

#kopfPanorama .carousel-content a h2 span{
	border-bottom: 0.286rem solid #ba4b3b;
}

#kopfPanorama .carousel-caption,
#kopfPanorama .carousel-caption a {
    text-align: right;
    width: 100%;
	position: relative; /*bootstrap-Überschreibung*/
	left: 0;/*bootstrap-Überschreibung*/
	right: 0; /*bootstrap-Überschreibung*/
	bottom: 0; /*bootstrap-Überschreibung*/
	padding-top: 0; /*bootstrap-Überschreibung*/
	padding-bottom: 0; /*bootstrap-Überschreibung*/
	color: #333;
	text-shadow: none; /*bootstrap-Überschreibung*/
}

#kopfPanorama .carousel-caption span.mediaInfo a,
span.mediaInfo a{
	color: #999;
} 

#kopfPanorama .carousel-caption a:hover,
#kopfPanorama .carousel-caption a:focus,
#kopfPanorama .carousel-caption span.mediaInfo a:hover,
#kopfPanorama .carousel-caption span.mediaInfo a:focus,
span.mediaInfo a:hover, span.mediaInfo a:focus{
	color: #ba4b3b;
	text-decoration: underline;
}


#kopfPanorama div.dode-carousel-control{
	transform: translate(-99%, -110%);/*Anpassung von .absolut-unten-rechts*/
}

#kopfPanorama .carousel-control{
	opacity: 1;/*bootstrap-Überschreibung*/
	text-shadow: none; /*bootstrap-Überschreibung*/
	position: relative;/*bootstrap-Überschreibung*/
	background: rgba(0, 0, 0, 0.5);
	width: 30%;
	margin-right:3%;
}

#kopfPanorama div.dode-carousel-control:hover .carousel-control{
	background: rgba(0, 0, 0, 0.6);
}

#kopfPanorama div.dode-carousel-control .carousel-control.btn{
padding: 0.429rem 1.286rem 0.286rem 1.286rem;
border: 0;
}
/*
	#kopfPanorama div.dode-carousel-control:hover .carousel-control.btn{
	border: #bbb;
}*/

#kopfPanorama .carousel-control.pause span.fa{
	position: relative;
	bottom: 0.143rem;
}

#kopfPanorama  a.carousel-control span.fa, #kopfPanorama a.carousel-control:hover span.fa, #kopfPanorama a.carousel-control:focus span.fa, #kopfPanorama a.carousel-control:active span.fa,
#kopfPanorama a[data-slide="pause"] span.fa {
	color: #ccc;
	opacity: 1;
}

#kopfPanorama a[data-slide="pause"] span.fa.pause{
	display: none;
}
#kopfPanorama a[data-slide="run"] span.fa.run{
	display: none;
}
/*
#kopfPanorama a[data-slide="pause"] span.fa{
	color: #f5f5f5;
}*/
/*
#kopfPanorama a[data-slide="pause"]{
	background: rgba(255, 0, 0, 0.4);
}*/

#kopfPanorama a.carousel-control:hover span.fa, #kopfPanorama a.carousel-control:focus span.fa{
	color: #f5f5f5;
}

#kopfPanorama .carousel-indicators{/*Bootstrap-Überschreibungen*/
	bottom: 0.357rem;
    left: 32%;
    margin-left: 0;
    width: 36%;
}

#kopfPanorama .carousel-indicators li,
#kopfPanorama .carousel-indicators .active {
    height: 0.857rem; /*Bootstrap-Überschreibungen*/
    width: 0.857rem; /*Bootstrap-Überschreibungen*/
}

.carousel-indicators .active {
    background-color: #ccc; /*Bootstrap-Überschreibungen*/
    margin: 0 0.5rem 0 0; /*Bootstrap-Überschreibungen*/
}
.carousel-indicators li {
    background-color: rgba(204, 204, 204, 0); /*Bootstrap-Überschreibung*/
    border: 0.143rem solid #ccc; /*Bootstrap-Überschreibung*/
    border-radius: 0.857rem; /*Bootstrap-Überschreibung*/
    margin: 0 0.5rem 0 0; /*Bootstrap-Überschreibung*/
}




#fussDortmundDe{
	/*font-size: 0.833rem;*/
	background: #f5f5f5;
}

#fussDortmundDe a, #fussDortmundDe a:link,#fussDortmundDe a:visited,
#fussDortmundDeProjekt a, #fussDortmundDeProjekt a:link,#fussDortmundDeProjekt a:visited{
	color: #666;
}
#fussDortmundDe a:hover, #fussDortmundDe a:focus,
#fussDortmundDeProjekt a:hover, #fussDortmundDeProjekt a:focus{
	color: #ba4b3b;
}

#fussDortmundDe ul.az > li > a, #fussDortmundDe ul.az > li > span {
font-size: 1em;
}

/* ############################################################################################################### */
/* ##   Menu   ################################################################################################### */


#hauptMenu{ /*oben*/
	z-index: 9; /*damit �ber SuchenUNdFinden und �ber FlashElemente*/
}

.navbar-fixed-top-sm {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
}

/* ---------------------------------------------------------- */
/* dode-Einstellungen für Hauptmenü+Menü sichtbar/non-collapsed */

.navbar-header{
	background: #fff;
	/* mik */
	/*
	border-bottom: 1px solid #ccc;
	background-image: linear-gradient(to bottom, #fff 5px, #ddd 100%);
    background-repeat: repeat-x;
	*/
}

.navbar-fixed-top-xs{
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
}



.navbar-fixed-left-xs, .navbar-fixed-left-sm{
    position: fixed;
    top: 25vh;
    left: 0;
    z-index: 1999;
    width: 3vw;
    padding-top: 0;
    padding-left: 0;
    padding-bottom: 0;
    padding-right: 0;
}

.navbar-fixed-left-xs .navbar-header, .navbar-fixed-left-sm .navbar-header{
	width: 3vw;
	padding-top: 0;
    padding-left: 0;
    padding-bottom: 0;
    padding-right: 0;
    background: goldenrod;
    margin-top: 0;
    margin-left: -1.071rem;/*15px*/
	margin-bottom: 0;
}

/*mik - auskommentiert*/
/*
.navbar-left{
	width: 3vw;
	height: 50vh;
	margin-top: 0;
	margin-bottom: 0;
}
*/




/* #################################################### */
/* #### HauptMenu ##################################### */
/* #################################################### */


.nav-tabs li a, .nav-tabs li button { /*Bootstrap-Erweiterung: button wie a*/
    border: 0;
    border-radius: 0;
    line-height: 1.42857;
    margin-right: 2px;
}
.nav li a, .nav li button { /*Bootstrap-Erweiterung: button wie a*/
    display: block;
	width: 100%;
    padding: 10px 15px;
    position: relative;
	text-align: left;
	background: transparent;
}

.nav-tabs { /*Bootstrap-Überschreibung*/
    border-bottom: 0;
}

/*
Eine Klasse, die aus einem "relativen" Collapse ein absolutes macht?! -> Ist das sinnvoll?
Unterschied zur BS-Klasse "dropdown-menu": Hier fehlt die Eigenschaft "display". Das wird
ja von Collapse übernommen! float ist wohl auch nicht notwendig.
*/
.dropdown-menu-collapse {
	position: absolute;
	top: 100%;
	right: 0px;
	z-index: 1000;
	min-width: 160px;
	padding: 5px 0px;
	margin: 2px 0px 0px;
	font-size: 14px;
	text-align: left;
	list-style: outside none none;
	background-color: #FFF;
	background-clip: padding-box;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 4px;
	box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.176);
}

#mainNav.dropdown-menu-collapse {
	width: 70%;
	right: 0;
	left: auto;
	position: fixed;
	top: 54px;
	overflow: auto;
}

/* #hauptMenu ist nicht mehr die Collapse-Box! Die ist jetzt eine Ebene höher -> #mainNav */
#hauptMenu{
	z-index:100;
	/*position: fixed;*/ /*mik*/
	right: 0;
    top: 5.571rem;/*Abstand so groß wie fixed-header hoch*/
    box-shadow: 0 0.214rem 0.5rem rgb(150, 150, 150);
    height: auto;
    max-height: 100vh;
    min-width: 50vw;
   	padding-left:0;
	padding-right:0;
}

#hauptMenu .nav-tabs li { /*Bootstrap-Überschreibung*/
    float: none;
	margin-bottom:0;
}

#hauptMenu .btn{/*bootstrap-Überschreibung: Umbrüche möglich*/
	white-space: normal;
}

#hauptMenu ul.menulayer > li button, #hauptMenu ul.menulayer > li a{
	/*background: #f5f5f5;*//*#e8e8e8;*/
	border-bottom: 0.071rem solid #ebebeb;
	}


#hauptMenu li a, #hauptMenu li a:link, #hauptMenu li a:visited, #hauptMenu li button{
	color: #666;
	margin-left: 0;/*sont Einrückung wie in allgemeinen Listen wg Icon*/
	padding-left: 4px;
	padding-right: 4px;
}

#hauptMenu ul li button:hover, #hauptMenu ul li button:focus,
#hauptMenu ul li a:hover, #hauptMenu ul li a:focus{
	background: #fff;
	color: #333;/*#fafafa;*/
	text-decoration: none;
}


#hauptMenu ul li#hauptMenu_lebenInDortmund.showSubmenu, #hauptMenu ul li#hauptMenu_lebenInDortmund.showSubmenu > button, #hauptMenu ul li#hauptMenu_lebenInDortmund > button:hover, #hauptMenu ul li#hauptMenu_lebenInDortmund > button:focus{
	background: #B12C19;
	color: #fafafa;
}
#hauptMenu ul li#hauptMenu_freizeitUndKultur.showSubmenu, #hauptMenu ul li#hauptMenu_freizeitUndKultur.showSubmenu > button, #hauptMenu ul li#hauptMenu_freizeitUndKultur > button:hover, #hauptMenu ul li#hauptMenu_freizeitUndKultur > button:focus{
	background: #6C9023;
	color: #fafafa;
}
#hauptMenu ul li#hauptMenu_wirtschaft.showSubmenu, #hauptMenu ul li#hauptMenu_wirtschaft.showSubmenu > button, #hauptMenu ul li#hauptMenu_wirtschaft > button:hover, #hauptMenu ul li#hauptMenu_wirtschaft > button:focus{
	background: #63718B;
	color: #fafafa;
}
#hauptMenu ul li#hauptMenu_tourismus.showSubmenu, #hauptMenu ul li#hauptMenu_tourismus.showSubmenu > button, #hauptMenu ul li#hauptMenu_tourismus > button:hover, #hauptMenu ul li#hauptMenu_tourismus > button:focus{
	background: #CC6633;
	color: #fafafa;
}
#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus.showSubmenu, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus.showSubmenu > button, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus > button:hover, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus > button:focus{
	background: #698175;
	color: #fafafa;
}
#hauptMenu ul li.home a:hover, #hauptMenu ul li.home a:focus{
	background: goldenrod;
	color: #fafafa;
}

#hauptMenu ul .menulayer .list-group{
	padding-right: 0;
}

#hauptMenu ul .menulayer .list-group .list-group-item{
	border-bottom: 0.071rem solid #eee;
	margin-bottom: 1px;
}

#hauptMenu ul ul > li.showSubmenu > button:first-of-type {
	background: #e8e8e8;
	border-top: 0.071rem solid #ddd;
}
#hauptMenu ul li#hauptMenu_lebenInDortmund.showSubmenu ul > li.showSubmenu > button:first-of-type {
	border-top: 0.071rem solid #B12C19;
}
#hauptMenu ul li#hauptMenu_freizeitUndKultur.showSubmenu ul > li.showSubmenu > button:first-of-type {
	border-top: 0.071rem solid #6C9023;
}
#hauptMenu ul li#hauptMenu_wirtschaft.showSubmenu ul > li.showSubmenu > button:first-of-type {
	border-top: 0.071rem solid #63718B;
}
#hauptMenu ul  li#hauptMenu_tourismus.showSubmenu ul > li.showSubmenu > button:first-of-type {
	border-top: 0.071rem solid #CC6633;
}
#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus.showSubmenu ul > li.showSubmenu > button:first-of-type {
	border-top: 0.071rem solid #698175;
}

#hauptMenu a span.fa, #hauptMenu button span.fa{
position: relative;
top: 0;
left: 0;/*5px;*/
margin-right: 0.714rem;
}
/*später wieder rein für Icons linkExtern?
#hauptMenu button span.fa:last-child{
margin-left: 0.714rem;
}
#hauptMenu a span.fa:last-child{
margin-left: 0.714rem;
}
*/

/*=Icon "linkIntern": muss aus dem HTML raus!*/
#hauptMenu ul li a span.fa-sign-in{
	display: none;
}
#hauptMenu ul li a[target=_blank] span.fa{
	display: inline;
	color: #aaa;
	margin-left: 0.357rem;
}
#hauptMenu ul li a[target=_blank]:hover span, #hauptMenu ul li a[target=_blank]:focus span, #hauptMenu ul li a[target=_blank]:active span{
	color: #aaa;
}

#hauptMenu ul li.home a:hover span.fa, #hauptMenu ul li.home a:focus span.fa,
#hauptMenu ul li#hauptMenu_lebenInDortmund.showSubmenu > button span.fa, #hauptMenu ul li#hauptMenu_lebenInDortmund button:hover span.fa, #hauptMenu ul li#hauptMenu_lebenInDortmund button:focus span.fa,
#hauptMenu ul li#hauptMenu_freizeitUndKultur.showSubmenu > button span.fa, #hauptMenu ul li#hauptMenu_freizeitUndKultur button:hover span.fa, #hauptMenu ul li#hauptMenu_freizeitUndKultur button:focus span.fa,
#hauptMenu ul li#hauptMenu_wirtschaft.showSubmenu > button span.fa, #hauptMenu ul li#hauptMenu_wirtschaft button:hover span.fa, #hauptMenu ul li#hauptMenu_wirtschaft button:focus span.fa,
#hauptMenu ul li#hauptMenu_tourismus.showSubmenu > button span.fa, #hauptMenu ul li#hauptMenu_tourismus button:hover span.fa, #hauptMenu ul li#hauptMenu_tourismus button:focus span.fa,
#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus.showSubmenu > button span.fa, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus button:hover span.fa, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus button:focus span.fa{
	color: #fafafa;
}
#hauptMenu ul li#hauptMenu_lebenInDortmund.showSubmenu .menulayer > button span.fa, #hauptMenu ul li#hauptMenu_lebenInDortmund .menulayer button:hover span.fa, #hauptMenu ul li#hauptMenu_lebenInDortmund .menulayer button:focus span.fa,
#hauptMenu ul li#hauptMenu_freizeitUndKultur.showSubmenu .menulayer > button span.fa, #hauptMenu ul li#hauptMenu_freizeitUndKultur .menulayer button:hover span.fa, #hauptMenu ul li#hauptMenu_freizeitUndKultur .menulayer button:focus span.fa,
#hauptMenu ul li#hauptMenu_wirtschaft.showSubmenu .menulayer > button span.fa, #hauptMenu ul li#hauptMenu_wirtschaft .menulayer button:hover span.fa, #hauptMenu ul li#hauptMenu_wirtschaft .menulayer button:focus span.fa,
#hauptMenu ul li#hauptMenu_tourismus.showSubmenu .menulayer > button span.fa, #hauptMenu ul li#hauptMenu_tourismus .menulayer button:hover span.fa, #hauptMenu ul li#hauptMenu_tourismus .menulayer button:focus span.fa,
#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus.showSubmenu .menulayer > button span.fa, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus .menulayer button:hover span.fa, #hauptMenu ul li#hauptMenu_buergerserviceUndRathaus .menulayer button:focus span.fa{
	color: #999;
}

/* ..."Laden"-Symbol...*/
#hauptMenu ul ul > li.messageLoading{
	text-align: center;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	color: #666;
}
#hauptMenu ul ul > li.messageLoading span.fa{
	margin-right: 0.357rem;
	font-size: 1.5rem;
}

#hauptMenu span.fa-level-up{/*später aus Quelltext raus*/
display: none;
}



/* ----- #hauptMenu-Styles aus tmp7.css ---------------------------------------*/
				/*** AJAX-Infobox Hauptmenü ***/
				#hauptMenu li[id^="hauptMenu"] {
				/*position:relative;*/
				}
				
				#hauptMenu .ajaxInfo{
				position: absolute;
				top: 100%;
				left: 0;
				right:auto;
				width:100%;
				}
				
				#hauptMenu #hauptMenu_buergerserviceUndRathaus .ajaxInfo {
				right: 0;
				left:auto;
				}
				
				html.fixedHeader #hauptMenu .ajaxInfo {
				position: relative;
				width:100%;
				left: 0;
				}
				
				#hauptMenu .alert {
				padding: 15px;
				}
				
				#hauptMenu .alert button {
				width:auto;
				padding:0;
				}
				
				#hauptMenu .alert-dismissible {
				padding-right: 35px;
				}
				
				#hauptMenu ul ul.ajaxInfo > li {
				position:relative;
				}
				
				#hauptMenu {
				margin-bottom:15px;
				}
				
				/*** Das "tab-bare" Hauptmenü darf bei nicht fixiertem Header nicht wie ein Tab aussehen! ***/
				#mainNav.changedTabView {
				border:0;
				}
				
				#mainNav.changedTabView #metaBox .metaBoxClose {
				display:none;
				}
				
				#mainNav.changedTabView .metaBoxContent {
				padding:0;
				margin:0;
				}
				
				/*** Das Hauptmenü - Version 2 ***/
				#hauptMenu li[id|="hauptMenu"] {
				position:relative;
				}
				
				#hauptMenu ul.menulayer div.menulayer {
				position:absolute;
				top:5px;
				left:0;
				width:100%;
				z-index:10;
				}
				
				#hauptMenu ul.menulayer li > .menulayer {
				top: calc(100% + 10px);
				}
				
				#hauptMenu ul.menulayer li > .menulayer div.menulayer {
				left:24px;
				}
				
				
				html.fixedHeader #hauptMenu .menulayerContainer {
				overflow:hidden;
				}
				
				html.fixedHeader #hauptMenu {
				box-shadow: none;
				}
				
				html.fixedHeader #hauptMenu .sibMenuPrev, html.fixedHeader #hauptMenu .sibMenuNext {
				display:none;
				visibility:hidden;
				position:absolute;
				left:-9999px;
				top:0px;
				}
				
				html.fixedHeader #hauptMenu ul.menulayer div.menulayer {
				position:relative;
				top:0;
				left:0;
				width:100%;
				z-index:10;
				border: 0 none;
				}


				html.fixedHeader #hauptMenu ul.nav .menulayer.activeMenu {
				padding-left: 2rem;
				}
				
				html.fixedHeader #hauptMenu ul.nav .menulayer.activeMenu > li:last-child{
				border-bottom:0 none;
				}
/* ----- Ende aus tmp7.css ----------------------------------------------------------*/



/* #################################################### */
/* #### MarginalMenü ################################## */
/* #################################################### */

#menu, #subNavMenu{ /*subNavMenu ist für externe Projekte in xs/sm*/
	padding-left: 0;
	padding-right: 0;
}

#menu nav, #subNavMenu nav{
	padding-top: 1.429rem;/*20px*/
	padding-left: 0;
	padding-bottom: 1.429rem;
	margin-top: 2rem;
	border-top: 4px solid #ebebeb;
}

#menu nav li, #subNavMenu nav li{
	position: relative;
}

.nav-tabs li a{ /*bootstrap-überschreibung*/
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

#menu li a, #subNavMenu li a{
	margin-left: 0;
}

#menu li.menuPath > a, #subNavMenu li.menupath > a{
	color: #999;
	padding-left: 0;
}

#menu li.menuPath li.menuPath > a, #subNavMenu li.menuPath li.menuPath > a{
	padding-left: 0;
	color: #999;
}

#menu li.menuPath > a:hover, #menu li.menuPath > a:focus,
#menu li.menuPath li.menuPath > a:hover, #menu li.menuPath li.menuPath> a:focus,
#subNavMenu li.menuPath > a:hover, #subNavMenu li.menuPath > a:focus,
#subNavMenu li.menuPath li.menuPath > a:hover, #subNavMenu li.menuPath li.menuPath> a:focus{
	color: #ba4b3b;
	background: transparent;
	text-decoration: underline;
}

#menu li.menuPath > ul > li:not(.menuPath):first-of-type,
#subNavMenu li.menuPath > ul > li:not(.menuPath):first-of-type{
	margin-top: 1.429rem; /*20px*/
}

#menu li:not(.menuPath),
#subNavMenu li:not(.menuPath){
	line-height: 2.5rem;
}

#menu li:not(.menuPath) a,
#subNavMenu li:not(.menuPath) a{
	color: #666;/*später über font-grey-6-Klasse?*/
	padding-left: 2.143rem;/*30px*/
	border-bottom: 0.071rem solid #ebebeb;
	line-height: 1.5rem;
	padding-top: 0.5rem;
	padding-bottom: 0.5rem;
	}
/*padding bei externen Menülinks, damit Icon nicht überschrieben wird*/
#menu li:not(.menuPath) a[target="_blank"],
#subNavMenu li:not(.menuPath) a[target="_blank"]{
	padding-right: 3.214rem;
}

#menu li:not(.menuPath) li a,
#subNavMenu li:not(.menuPath) li a{
	padding-left: 4.286rem;/*60px*/
}
#menu li:not(.menuPath) li li a,
#subNavMenu li:not(.menuPath) li li a{
	padding-left: 6.429rem;/*90px*/
}
#menu li:not(.menuPath) li li li a,
#subNavMenu li:not(.menuPath) li li li a{
	padding-left: 8.571rem;/*120px*/
}

#menu li:not(.menuPath) a:hover, #menu li:not(.menuPath) a:focus,
#subNavMenu li:not(.menuPath) a:hover, #subNavMenu li:not(.menuPath) a:focus{
	color: #333;
	background: #fff;
	text-decoration: none;
}

#menu li span.fa, #subNavMenu li span.fa{
	position: absolute;
	left: 0.714rem;
	top: 0.5rem;
	display: none;
}


#menu li.selected > a.anzeigePunkt,#subNavMenu li.selected > a.anzeigePunkt{
	background: #fff;
}
#menu li.selected > a.anzeigePunkt span.fa, #subNavMenu li.selected > a.anzeigePunkt span.fa{
	display: inline;
}

#menu li a[target=_blank] span.fa, #subNavMenu li a[target=_blank] span.fa{
	display: inline;	
	position: absolute;
	left: auto;/*überschreibt die anderen left-Angaben, damit right funktioniert*/
	right: 0.714rem;
	top: 0.857rem;
	color: #aaa;
}

#menu li a[target=_blank]:hover span.fa, #menu li a[target=_blank]:focus span.fa, #menu li a[target=_blank]:active span.fa,
#subNavMenu li a[target=_blank]:hover span.fa, #subNavMenu li a[target=_blank]:focus span.fa, #subNavMenu li a[target=_blank]:active span.fa{
color: #aaa;
}






/* ################################################################### */
/* ## Inhaltsbereich ################################################# */

/*** Tab-Box  ---------------------------------------------------------------------------------------------------------------***/

[data-control="tabcontentBox"] > div{
	padding-bottom: 0;
}

[data-control="tabcontentBox"] > div ul.nav-tabs{
	margin-top:1.429rem; /* wie h2*/
}

[data-control="tabcontentBox"] > div li .badge{
	position:relative;
	top: -6px;
}


[data-control="tabcontentBox"] > div .nav-tabs > li a {
	font-size: 1.571rem; /* wie h2*/
	line-height: 150%; /* wie h2*/
	font-family:'Tahoma',sans-serif; /* wie h2*/
	font-weight:500; /* wie h2*/

}

/* reset */
[data-control="tabcontentBox"] li a span.fa, [data-control="tabcontentBox"] li a:link span.fa, [data-control="tabcontentBox"] li a:visited span.fa {
	position:static;
	margin-right: 0; /*Überschreibung "normaler" li span.fa-Anweisung*/
}


[data-control="tabcontentBox"] > div .nav-tabs > li a,
[data-control="tabcontentBox"] > div .nav-tabs > li a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li a:focus{
	padding-left: 0.357rem;
	padding-right: 0.286rem;	
	padding-top: 0.357rem;
	padding-bottom:0.071rem;
	border-top: 0.071rem solid #999;
	border-left: 0.071rem solid #999;
	border-right: 0.071rem solid #999;
	color: #333;
}

[data-control="tabcontentBox"] > div .nav-tabs > li{
	padding-left: 0.143rem;
	padding-right: 0.143rem;
	border-bottom: 0.214rem solid #fff;
}

[data-control="tabcontentBox"] > div .nav-tabs > li.active{
	border-bottom: 0;
}

[data-control="tabcontentBox"] > div .nav-tabs > li:first-of-type{
	padding-left: 0;
}
[data-control="tabcontentBox"] > div .nav-tabs > li:last-of-type{
	padding-right: 0;
}

/*
----- default -----
... wenn keine (Farb-) Klassen angegeben: grauer Hintergrund, graues Symbol, active=weiß
*/
[data-control="tabcontentBox"] > div .nav-tabs > li.active a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:focus {
	color: #fff;
	background-color: #afafaf;
	border-top: 0.071rem solid #afafaf;
	border-left: 0.071rem solid #afafaf;
	border-right: 0.071rem solid #afafaf;
	border-bottom: 0.357rem solid #afafaf;
}

[data-control="tabcontentBox"] > div .nav-tabs > li.active a span,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:link span,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:visited span,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:hover span,
[data-control="tabcontentBox"] > div .nav-tabs > li.active a:focus span{
	color: #fff;
}

[data-control="tabcontentBox"] > div .nav-tabs > li > a {
	text-align: left;
	margin-left: 0;
}

[data-control="tabcontentBox"] > div .nav-tabs > li > a.text-center-xs{
	text-align: center;
}

/* ---- dode-Tabs ---- */

/* News */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-news a span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-news a:link span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-news a:visited span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-news a:hover span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-news a:focus span.font-lebenInDortmund{
	color:#B12C19;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news {
	/*background-color: #B12C19;*/
	/*border-bottom: 0.214rem solid #55acee;*/
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:focus{
	background-color: #B12C19;
	border-top: 0.071rem solid #B12C19;
	border-left: 0.071rem solid #B12C19;
	border-right: 0.071rem solid #B12C19;
	border-bottom: 0.357rem solid #B12C19;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:link span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:visited span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:hover span.font-lebenInDortmund,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-news a:focus span.font-lebenInDortmund{
	color: #fff;
}

/* VK */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk a span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk a:link span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk a:visited span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk a:hover span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk a:focus span.font-freizeitUndKultur{
	color:#6C9023;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:focus{
	background-color: #6C9023;
	border-top: 0.071rem solid #6C9023;
	border-left: 0.071rem solid #6C9023;
	border-right: 0.071rem solid #6C9023;
	border-bottom: 0.357rem solid #6C9023;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:link span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:visited span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:hover span.font-freizeitUndKultur,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk a:focus span.font-freizeitUndKultur{
	color: #fff;
}

[data-control="tabcontentBox"] > div .nav-tabs > li.tab-vk .badge{
	background: #6C9023;
	color: #fff;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-vk .badge{
	background: #fff;
	color: #6C9023;
}

/* ---- SocialMedia-Tabs ---- */

/* Twitter */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-twitter a span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-twitter a:link span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-twitter a:visited span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-twitter a:hover span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-twitter a:focus span.font-twitter{
	color:#55acee;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:focus{
	background-color: #55acee;
	border-top: 0.071rem solid #55acee;
	border-left: 0.071rem solid #55acee;
	border-right: 0.071rem solid #55acee;
	border-bottom: 0.357rem solid #55acee;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:link span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:visited span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:hover span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-twitter a:focus span.font-twitter{
	color: #fff;
}


/* Facebook */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-facebook a span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-facebook a:link span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-facebook a:visited span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-facebook a:hover span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-facebook a:focus span.font-facebook{
	color: #3b5998;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:focus{
	background-color: #3b5998;
	border-top: 0.071rem solid #3b5998;
	border-left: 0.071rem solid #3b5998;
	border-right: 0.071rem solid #3b5998;
	border-bottom: 0.357rem solid #3b5998;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:link span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:visited span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:hover span.font-facebook,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-facebook a:focus span.font-facebook{
	color: #fff;
}


/* Instagram */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-instagram a span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-instagram a:link span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-instagram a:visited span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-instagram a:hover span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-instagram a:focus span.font-instagram{
	color:#517fa4;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:focus{
	background-color: #517fa4;
	border-top: 0.071rem solid #517fa4;
	border-left: 0.071rem solid #517fa4;
	border-right: 0.071rem solid #517fa4;
	border-bottom: 0.357rem solid #517fa4;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:link span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:visited span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:hover span.font-instagram,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-instagram a:focus span.font-instagram{
	color: #fff;
}


/* Youtube */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-youtube a span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-youtube a:link span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-youtube a:visited span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-youtube a:hover span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-youtube a:focus span.font-youtube{
	color: #bb0000;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:focus{
	background-color: #bb0000;
	border-top: 0.071rem solid #bb0000;
	border-left: 0.071rem solid #bb0000;
	border-right: 0.071rem solid #bb0000;
	border-bottom: 0.357rem solid #bb0000;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:link span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:visited span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:hover span.font-youtube,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-youtube a:focus span.font-youtube{
	color: #fff;
}


/* Google+ */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-googleplus a span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-googleplus a:link span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-googleplus a:visited span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-googleplus a:hover span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-googleplus a:focus span.font-googleplus{
	color: #d34836;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:focus{
	background-color: #d34836;
	border-top: 0.071rem solid #d34836;
	border-left: 0.071rem solid #d34836;
	border-right: 0.071rem solid #d34836;
	border-bottom: 0.357rem solid #d34836;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:link span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:visited span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:hover span.font-googleplus,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-googleplus a:focus span.font-googleplus{
	color: #fff;
}


/* Pinterest */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-pinterest a span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-pinterest a:link span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-pinterest a:visited span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-pinterest a:hover span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-pinterest a:focus span.font-pinterest{
	color: #cb2027;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:focus{
	background-color: #cb2027;
	border-top: 0.071rem solid #cb2027;
	border-left: 0.071rem solid #cb2027;
	border-right: 0.071rem solid #cb2027;
	border-bottom: 0.357rem solid #cb2027;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:link span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:visited span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:hover span.font-pinterest,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-pinterest a:focus span.font-pinterest{
	color: #fff;
}

/* Karten */
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-maps a span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-maps a:link span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-maps a:visited span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-maps a:hover span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.tab-maps a:focus span.font-maps{
	color:goldenrod;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:link,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:visited,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:hover,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:focus{
	background-color: goldenrod;
	border-top: 0.071rem solid goldenrod;
	border-left: 0.071rem solid goldenrod;
	border-right: 0.071rem solid goldenrod;
	border-bottom: 0.357rem solid goldenrod;
}
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a span.font-twitter,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:link span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:visited span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:hover span.font-maps,
[data-control="tabcontentBox"] > div .nav-tabs > li.active.tab-maps a:focus span.font-maps{
	color: #fff;
}

.tab-content > div{
	padding-top: 1.071rem;
}

.tab-content div.tab-allgemein{
	border-top: 0.357rem solid #afafaf;
}
.tab-content div.tab-news{
	border-top: 0.357rem solid #B12C19;
}
.tab-content div.tab-vk{
	border-top: 0.357rem solid #6C9023;
}
.tab-content div.tab-twitter{
	border-top: 0.357rem solid #55acee;
}
.tab-content div.tab-facebook{
	border-top: 0.357rem solid #3b5998;
}
.tab-content div.tab-youtube{
	border-top: 0.357rem solid #bb0000;
}
.tab-content div.tab-instagram{
	border-top: 0.357rem solid #517fa4;
}
.tab-content div.tab-googleplus{
	border-top: 0.357rem solid #d34836;
}
.tab-content div.tab-pinterest{
	border-top: 0.357rem solid #cb2027;
}
.tab-content div.tab-maps{
	border-top: 0.357rem solid goldenrod;
}


.tab-content h2.dode-border{
	border-top:0;
}

.tab-content .element:nth-of-type(1){ /*Überschreibung der allgemeinen Anweisung auf Wert "wie alle Elemente"*/
	padding-top: 1.071rem;
}

.tab-content .listeAllgemein{
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
}
.tab-content .listeAllgemein h2.dode-border{
	margin-top:0;
}

/*-- ENDE Tab-Box  ---------------------------------------------------------------------------------------------------------------*/


.col-inhalt{/*= ehem. rasterSpalte7inhalt*/
	margin-top: -1.429rem;/*dode-border-margin zurücksetzen*/
}

h2{
	font-size: 1.571rem;/*22px*/
}



/* #### Absätze / Boxen / Module ##################################### */




img.collection{ /*Collectionbilder*/
	padding-left: 0; /*Bootstrap-Überschreibung rasterKlassen*/
}


.vkBox form legend{
	display: none;
}


.themenBox2 ul {
    padding: 1.071rem;
}

/*** Kalender ***/
.we button, .we span {
	background-color: silver;
}

.today button, .today span {
	background-color: cornflowerblue;
}

.from button, .from span {
	background-color: cadetblue;
}

.to button, .to span {
	background-color: lightskyblue;
}

.calendarBox {
position: absolute;
right: 0;
background-color: #fff;
z-index: 1000;
border-left: 1px solid #aaa;
box-shadow: 2px 2px 2px;
border-top: 1px solid #aaa;	
}

html.fixedHeader .calendarBox {
position:relative;
}

.calendarBoxInner {
	text-align:center;
}

.boxContent {
	padding-right: 5px;
	padding-left: 5px;
	padding-top: 15px;
	padding-bottom: 15px;
	display:inline-block;		
}

.boxContent button {
	width:28px;
	height:28px;
	padding:0;
}

.boxContent td button {
	margin:2px;
}

.boxContent th {
	text-align:center;
	background-color:#aaa;
	color:#fff;
	height:38px;
}

.boxContent td {
	height:32px;
}

.calLeaf table col {
	width:32px;
}

.calInnerBoxTopBar {
	text-align: left;
	overflow:hidden;
}

.calInnerBoxTopBar h3 {
	margin:0;
	font-size:1rem;
}

.calHeadline {
	text-align:center;
}


.themenUebersicht .element{
border-left: 0.286rem solid #e8e8e8;
padding-left: 0.714rem;
margin-top: 1rem;
}


.themaLinkListe h3:first-of-type{
	margin-top: 0.357rem;
}


.infoBox div.logoSchutzraum{
	border-bottom: 0.143rem solid #e8e8e8;
	padding-bottom: 1.071rem;
}

.infoBox div.logoSchutzraum img{
	display: block;
	text-align: center;
	margin: 0 auto;
	vertical-align: middle;
	max-width: 100%;
}

.infoBox .adresse h3{ /*kein Zeilenumbruch in Adressbezeichnung Infobox*/
	-moz-hyphens: none;
   	-o-hyphens: none;
   	-webkit-hyphens: none;
   	-ms-hyphens: none;
   	hyphens: none;
}

.drehscheibe {	
	overflow:hidden;
}

.drehscheibeFenster {
	float:left;
	overflow:hidden;
	/*background-color:#EEE;*/
}

.drehscheibeElementLeiste {
	position:relative;
	margin-left:0;
	/*background-color: #fff;*/
}

.drehscheibenelement a{
	height: 100%;
}

.drehscheibeMarkerBox{
	clear:both;
	overflow:hidden;
	padding-left:15px;
	padding-right:15px;
	/*background-color:#EEE;*/
}

.drehscheibeMarkerBox .btn{
	cursor:pointer;
	background: transparent;
	border: none;
	padding: 0;
}
.dode-btn-marker{
	cursor:pointer;
	background: transparent;
	border: none;
	padding: 0 0.143rem;
}

.drehscheibeMarkerBox .btn:hover, .drehscheibeMarkerBox .btn:focus,
.drehscheibeMarkerBox .btn:hover span.fa, .drehscheibeMarkerBox .btn:focus span.fa{
	background: transparent;
	color: #999;
}

.drehscheibeMarkerBox .btn:active, .drehscheibeMarkerBox .btn.active {
	box-shadow:none;
	/*cursor:pointer;*/
	/*color:#ba4b3b;*/
}

.drehscheibeMarker {
	width:80%;
	text-align:center;
	margin:12px auto;
}

.drehscheibeMarker > span {
	padding:0 7px;
}

/*u.a. für GalerieBox / Youtube-Video-Einbindung*/
.video-container{
	position:relative;
	margin-bottom: 20px;/* für alle in .bildBoxXYZ, für in .galeriebox zusätzlich Klasse nomargin-ow nutzen */
	padding-bottom: 56.25%;
	padding-top: 25px;
	height: 0;
	max-width: 100%;
	overflow: hidden;
}

.video-container iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.galeriebox .video-container, .bilderstrecke .video-container{
	margin-bottom: 0;
}

/* Weiterempfehlen */

h2.dode-border.formId-weiterempfehlen.iFrame-noborder{
	border-top: 0;
	margin-top: 0;
}

/* Volltextsuche / Import Dosys */
.volltextSuchErgebnis .suchergebnis em{
	font-style: normal;
}
.volltextSuchErgebnis .suchergebnis p em{
	font-weight: bold;
}



/* VK-Services, News-Services */
/*#vkServices dd, #newsServices dd,*/
#vkServices dd a, #newsServices dd a {
display:inline;
margin-left:0;
}


#fussDirektzugaenge a, #fussDirektzugaenge a:link, #fussDirektzugaenge a:visited, #fussDirektzugaenge a:hover, #fussDirektzugaenge a:focus{
color: #e8e8e8;
}
#fussDirektzugaenge a .fa{
color: #bbb;
}
#fussDirektzugaenge a:hover .fa{
color: #e8e8e8;
}

/*
.fussMarktplatz li a{
	margin-left: 0;
}*/


.fussMarktplatz .btn{
	white-space: normal; /*=btn mehrzeilig*/
	min-height: 4.286rem;
	border: 1px solid #fafafa;
}
.fussMarktplatz .btn:hover, .fussMarktplatz .btn:focus{
	border: 1px solid #ba4b3b;	
}


.fussMarktplatz img{
	width: 100%;
}
/*
.bildBox, .bildBoxKlein, .bildBoxGross, .linkBox, .linkBoxBreit, .linkBoxVier, .zitatBox{
	background: #e8e8e8;
}
*/
/*nicht in xs-Version? Also besser in MediaQuery ab sm; ggf besser Klasse für "umflossene Boxen" anlegen? Bildbox, Linkbox, Video, ...*/
/*.bildBox, .bildBoxKlein, .linkBox, .zitatBox{
	margin-right: 0.714rem;
	margin-bottom: 0.714rem;
}
*/

/*oder besser Klasse für 100% anlegen? Oder .col-xs-12 mit .nopadding?*/

.bildBox img, .bildBoxKlein img, .bildBoxGross img, .bildBoxVier img, .bildBoxSieben img, .listeAllgemein img, .bilderstrecke img, .adressServices img, .drehscheibenelement img, .kooperationsprojekt img{
	width: 100%;
}

.bildBox span img, .bildBoxKlein span img, .bildBoxGross span img, .bildBoxVier span img, .bildBoxSieben span img, .listeAllgemein span img,
.bildBox img.lupe, .bildBoxKlein img.lupe, .bildBoxGross img.lupe, .bildBoxVier img.lupe, .bildBoxSieben img.lupe, .listeAllgemein img.lupe{
	width: auto;
}


/* Bilder einpassen */
picture {
display:block;
}

figure, picture, figure > img, figure > a > img, picture > img {
width:100%;
height:auto;
}

figcaption img  {
width:auto !important;
}


ul.linkbox {
padding:15px;
background-color:#e8e8e8;
}

/*Wird das noch genutzt?:*/
		.elementListItem  {
		border-bottom: 0.071rem dotted #999;
		margin-bottom:1.071rem;
		margin-left:0;
		margin-right:0;
		}
		.elementListItem h3 {
		margin-top:0;
		}


 /*oder besser .font-11 in jedes .fa?*/
/*
.hauptText p .fa, .hauptText li .fa{
	font-size: 0.786rem;
}
*/


.sitemap ul li{
	line-height: 1.714rem;
}

.sitemap > ul > li{
	padding-top: 1.071rem;
}

.sitemap > h3{
	margin-top: 2.143rem;
	margin-bottom: 0;
}

.sitemap > ul > li ul{
	border-left: 0.286rem solid #f5f5f5;
	margin-left: 0.214rem;
	padding-left: 1.071rem;
}

/* #### Adressen #################################################### */

/*".neuerBlock" ersetzt durch --> ".col-abstandOben"*/

/*Zeilenumbruch in Öffnungszeiten + Freitext*/
.adresse p, .geoInfoContent p{
	margin-bottom: 0;
}


/* #### Formulare #################################################### */

fieldset{
	border: none;
}

.control-label{ /*bootstrap-Klasse: Ergänzung*/
	/*margin-top: 1.071rem;*/
	text-align: left;
}

.form-horizontal .form-group{ /*bootstrap-Überschreibung*/
	margin-left: 0;
	margin-right: 0;

}

.form-control.formHinweis{
	box-shadow: 0 0 0.1rem red;
}

/* ##### Textlayout ################################################## */

.hauptText p.lead, .hauptText p.vorspann{
	font-weight: bold;
	/*margin-top: 2.857rem;*/
	margin-bottom: 2.857rem;

}

.hauptText{
	
	/*-moz-column-width: 21.429rem; 300px
	-webkit-column-width: 21.429rem;
	column-width: 21.429rem;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
	orphans: 3;
	widows: 3;
	-moz-column-rule-color: #ddd;
  	-moz-column-rule-width: 0.071rem;
  	-moz-column-rule-style: dotted;
  	-webkit-column-rule-color: #ddd;
  	-webkit-column-rule-width: 0.071rem;
  	-webkit-column-rule-style: dotted;
  	column-rule-color: #ddd;
  	column-rule-width: 0.071rem;
  	column-rule-style: dotted;*/
}

.hauptText p, .hauptText ul,.hauptText table{
	margin-bottom: 1.714rem;
}
.hauptText ul ul{
	margin-bottom: 0;
}

.hauptText ul.list-style li{/*Bei umflossenen Linkboxen sind Links sonst nicht klickbar, wenn daneben eine List steht...*/
	position: static;
}


.hauptText h4{
/*	margin-top: 2.5rem;
	margin-bottom: 2rem;
	
	-moz-column-break-before: column;
	-webkit-column-break-before: column;
	column-break-before: column;
	-moz-column-span: all;
	-webkit-column-span: all;
	column-span: all;*/
}

.hauptText .bildBox{
	/*
	-moz-column-break-after: column;
	-webkit-column-break-after: column;
	column-break-after: column;*/
}


.beitragDetail{ /*ohne Zusatzboxen (Veranstalter, ...), nur Text + RulerSymbole*/
/*padding-top: 0.714rem;
font-size: 1.143rem;

border-left: 0.286rem solid #f5f5f5; 
border-right: 0.286rem solid #f5f5f5;
padding: 0 100px;
*/
}

.beitragDetail h2{
/*font-size: 1.143rem;*/
/*text-transform: uppercase;*/
/*position: relative;*/
}

.beitragDetail .datum, .beitragDetail .eventHinweis, .beitragDetail a.eventHinweis{
/*float: right;
text-transform: none;
margin-left: 2rem;*/
margin-bottom: 2rem;
}

.beitragDetail h3{
/*	font-size: 2rem;
	margin-top: 1.5rem;
	margin-bottom: 2rem;*/
}

.textServices.col-sm-1 span{
	display: block;
	line-height: 2rem;
	color: #999;
}


/* --- Ruler ----------------- */
#ruler .btn-group .btn{
	padding-top: 0.143rem;
	padding-bottom: 0.143rem;
	border-color: #999;
}

#ruler .btn-group a.btn:hover, #ruler .btn-group a.btn:focus,
#ruler .btn-group button.btn:hover, #ruler .btn-group button.btn:focus{
	background: #fff;
}
#ruler .btn-group a.btn:hover span.fa, #ruler .btn-group a.btn:focus span.fa,
#ruler .btn-group button.btn:hover span.fa, #ruler .btn-group button.btn:focus span.fa{
	color: #ba4b3b;
}

/* Button Readspeaker Ruler */
#ruler .btn-group .btn.rs_skip{
	border: 0;
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 0;
	margin-bottom: 0;
	height:auto;
}




/* tmp7 Sonstiges */

	.navbar .nav li a{
	padding: 1.071rem;
	margin: 0;
}

.list-inline > li > a{
	margin-left: 0;
}

.navbar-header{
	background: transparent;
}


.fs-info-box {
border: 1px solid rgb(0, 0, 0);
margin: 0px 0px 16px;
padding: 6px;
}






/* #################################################################################################### */
/*                      MEDIA QUERIES                                                                   */
/* #################################################################################################### */


/* ############################ */
/* dode-ZwischenAuflösung xs-s */
/* ############################ */

@media (max-width: 479px){
	
	.hidden-xs-s{
		display: none !important;
	}

	.col-xs-s-3{
		width: 25%;
	}

	.col-xs-s-9{
		width: 75%;
	}
	.col-xs-s-12{
		width: 100%;
	}

	.nopadding-xs-s{
		padding-left: 0;
		padding-right: 0;
		padding-top: 0;
		padding-bottom: 0;
	}

	.col-xs-s-paddingLeft{
		padding-left: 1.071rem;
	}
	.col-xs-s-paddingRight{
		padding-right: 1.071rem;
	}

	.col-xs-s-abstandOben{
		margin-top: 1.071rem;
	}
}

/* ############################ */
/* dode-ZwischenAuflösung xs-m */
/* ############################ */

@media (min-width: 480px) and (max-width: 599px){
	
	.hidden-xs-m{
		display: none !important;
	}

	.col-xs-m-2{
		width: 16.666%;
	}

	.col-xs-m-6{/*momentan nur für #kopfPanorama .absenderKennungEnclosure genutzt */
		width: 50%;	
	}

	.col-xs-m-9{
		width: 75%;	
	}

	.col-xs-m-10{
		width: 83.333%;	
	}

	.col-xs-m-12{
		width: 100%;
	}


	#kopfPanorama #absenderKennung h1{
		font-size: 1.286rem;
		font-weight: normal;
		line-height: 1.571rem;
	}
	
	.nopadding-xs-m{
		padding-left: 0;
		padding-right: 0;
		padding-top: 0;
		padding-bottom: 0;
	}

	.col-xs-m-paddingLeft{
		padding-left: 1.071rem;
	}
	.col-xs-m-paddingRight{
		padding-right: 1.071rem;
	}


}

/* ############################ */
/* dode-ZwischenAuflösung xs-l */
/* ############################ */

@media (min-width: 600px) and (max-width: 767px){
	
	.hidden-xs-l{
		display: none !important;
	}

	.col-xs-l-4{/*momentan nur für #kopfPanorama .absenderKennungEnclosure genutzt */
		width: 33.33333333%;
	}

	.col-xs-l-10{
		width: 83.33333333%;
}

	#kopfPanorama #absenderKennung h1{
		font-size: 1.286rem;
		font-weight: normal;
		line-height: 1.571rem;
	}



}


/* ########## */
/*     SM     */
/* ########## */


/*@media (min-width: @screen-sm-min) LESS-Variable*/
@media (min-width: 768px){ 
/*
body{
	padding-top:61px;
}
*/
.nopadding-sm{
	padding-top:0;
	padding-right:0;
	padding-bottom:0;
	padding-left:0;
}

.nopaddingTop-sm{
	padding-top:0;
}
.nopaddingBottom-sm{
	padding-bottom:0;
}

.col-sm-abstandOben{
	margin-top: 1.071rem;
}

.col-xs-nofloat{ 
	float: left;
	clear: none;
}

.width-sm-6pz{
	width: 6%;
}

.cols-equal-sm-2{
	width: 50%;
}
.cols-equal-sm-3{
	width: 33.333%;
}
.cols-equal-sm-4{
	width: 25%;
}
.cols-equal-sm-5{
	width: 20%;
}
.cols-equal-sm-6{
	width: 16.666%;
}
.cols-equal-sm-7{
	width: 14.285%;
}
.cols-equal-sm-8{
	width: 12.5%;
}
.cols-equal-sm-9{
	width: 11.1%;
}
.cols-equal-sm-10{
	width: 10%;
}
.cols-equal-sm-11{
	width: 9.09%;
}
.cols-equal-sm-12{
	width: 8.333%;
}


.cursor-sm-default{
	cursor: default;
}

.cursor-sm-pointer{
	cursor: pointer;
}


	#kopfPanorama .absenderKennungEnclosure{
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		z-index: 30;
	}
	
	#kopfPanorama #absenderKennung{
		height: 100%;
	}


	#kopfPanoramaKlein > div{
		padding-left: 1.071rem;
		padding-right: 1.071rem;
	}

	#kopfPanoramaKlein .absenderKennungEnclosure{
		position: absolute;
		bottom: 0;
		height: 100%;
	}

	#kopfPanoramaKlein #absenderKennung{
		position: relative;
		padding-left: 1.071rem;
		padding-right: 1.071rem;
		height: 100%;
	}
	
	
	/*#kopfPanoramaKlein #absenderKennung.lebenInDortmund,*/
	#kopfPanoramaKlein #absenderKennung.lebenInDortmund h1{
		border-bottom: none;
	}
	/*#kopfPanoramaKlein #absenderKennung.freizeitUndKultur,*/
	#kopfPanoramaKlein #absenderKennung.freizeitUndKultur h1{
		border-bottom: none;
	}
	/*#kopfPanoramaKlein #absenderKennung.wirtschaft,*/
	#kopfPanoramaKlein #absenderKennung.wirtschaft h1{
		border-bottom: none;
	}
	/*#kopfPanoramaKlein #absenderKennung.tourismus,*/
	#kopfPanoramaKlein #absenderKennung.tourismus h1{
		border-bottom: none;
	}
	/*#kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus,*/
	#kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus h1{
		border-bottom: none;
	}
	/*#kopfPanoramaKlein #absenderKennung.allgemein,*/
	#kopfPanoramaKlein #absenderKennung.allgemein h1{
		border-bottom: none;
	}


	#kopfPanoramaKlein #absenderKennung h1, #kopfPanorama #absenderKennung h1{
		font-size: 1.571rem;
		font-weight: normal;
		line-height: 1.714rem;
		text-align: right;
		position: absolute;
		padding-top: 1.071rem;
		padding-bottom: 1.071rem;
		padding-left: 1.071rem;
		padding-right: 1.071rem;
		bottom: -0.786rem;
		right: 0;
		left: 0;
	}

	#kopfPanorama #absenderKennung h1{
		bottom: -0.429rem;
	}

	.navbar-fixed-top-xs { /*alles auf "normal" setzen*/
    position: static;
    top: auto;
    left: auto;
    right: auto;
    z-index: auto;
	}


	#topNavbarlogoBox {
		margin-left:0;
	}	


#fussDortmundDe{
	background: transparent;
}


/*### Absätze / Boxen / Module (ab sm)  ###*/
.sitemap > ul{
	padding-left: 1.071rem;
}

.sitemap > ul > li ul{
	margin-left: 1.857rem;
}

[data-control="tabcontentBox"] > h2 .nav-tabs > li > a.text-left-sm{
	text-align: left;
}

}
/* ---- SM Ende ------------------------------------------------------ */



/* ########## */
/*     MD     */
/* ########## */

@media (min-width: 992px){

.navbar-fixed-top-sm {
	position:relative;
}


	
body {
	padding-top:0;
}
	
#dued_banner {
	margin-top:8px;
	padding-left:15px;
}

#kopf {
	box-shadow: none;	
}

#topNavbar {
	margin-top:15px;
}

#topNavbarlogoBox {
	margin-left:0;
}

#topNavbarlogoBox > div {
    top: 36px;
}

#topNavbarMeta {
	margin-top: 27px;
}

#metaBox {
	background: transparent;
}

#metaBox .metaBoxContent {
	padding-left:0;
	padding-top:0;
	margin-right: 38px;
}

#metaBox .metaBoxClose, #recommendForm .metaBoxClose{
	width:38px;
}

#metaContentConfig, #metaContentMeta, #metaContentLang, #metaContentAdditional{
	padding-left: 1.071rem;
}

#topNavbarMeta li .fa, .metaBoxClose .fa {
	font-size:1.286rem;/*geändert von 1rem, TL 16.01.17*/
}
#topNavbarMeta li a {
	width: 38px;
	padding-top: 6px;
	padding-bottom: 6px;
	margin-bottom: 15px;
}

#topNavbarMeta li.active a {
	margin-bottom: 0;
	padding-bottom: 21px;
}

#topNavbarMeta li a.navbar-link {
	width:auto;
}	

#preWrapper{
	margin-bottom: 0;
}

#kopfPanorama {
	margin-top: 0;
}

.cols-equal-md-2{
	width: 50%;
}
.cols-equal-md-3{
	width: 33.333%;
}
.cols-equal-md-4{
	width: 25%;
}
.cols-equal-md-5{
	width: 20%;
}
.cols-equal-md-6{
	width: 16.666%;
}
.cols-equal-md-7{
	width: 14.285%;
}
.cols-equal-md-8{
	width: 12.5%;
}
.cols-equal-md-9{
	width: 11.1%;
}
.cols-equal-md-10{
	width: 10%;
}
.cols-equal-md-11{
	width: 9.09%;
}
.cols-equal-md-12{
	width: 8.333%;
}

.cursor-md-default{
	cursor: default;
}

.cursor-md-pointer{
	cursor: pointer;
}

/*------------- Hauptmenu ab MD --------------*/
#hauptMenu{
	z-index:100;
	position: relative;    
	right: 0;
    top: 0;
    box-shadow: none;
    height: auto;
    max-height: 100vh;
    min-width: auto;
   	padding-left:0;
	padding-right:0;
}

#hauptMenu .nav-tabs > li{ /*Bootstrap-Überschreibung / Wiederherstellung /xs 1.Ebene */
    float: left;
	margin-bottom:0;

}

#hauptMenu .nav > li{ /*Bootstrap-Überschreibung*/
	position: static;
}


#hauptMenu ul li{
	background: #f5f5f5;
	
	}

	#hauptMenu ul li#hauptMenu_lebenInDortmund{
		border-top: 0.286rem solid #B12C19; /*5px*/
	}

	#hauptMenu ul li#hauptMenu_freizeitUndKultur{
		border-top: 0.286rem solid #6C9023;
	}

	#hauptMenu ul li#hauptMenu_wirtschaft{
		border-top: 0.286rem solid #63718B;
	}

	#hauptMenu ul li#hauptMenu_tourismus{
		border-top: 0.286rem solid #CC6633;
	}
	#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus{
		border-top: 0.286rem solid #698175;
	}

#hauptMenu > ul > li{
	width: 24.9%;/*bei 5 Hauptmenüpunkten: 19.9%*/
	margin-left: 0.1%;
	/*-webkit-border-top-left-radius: 0.286rem;
	-webkit-border-top-right-radius: 0.286rem;
	-moz-border-radius-topleft: 0.286rem;
	-moz-border-radius-topright: 0.286rem;
	border-top-left-radius: 0.286rem;
	border-top-right-radius: 0.286rem;*/
}

	#hauptMenu > ul > li > button {
		height: 3.214rem;/*45px ?*/
 		padding-bottom: 0.214rem;
   		padding-top: 0.214rem;
   		padding-left: 0.357rem;
   		padding-right: 0.357rem;
   		font-weight: 600;
	}

	#hauptMenu > ul > li:nth-of-type(3){ /*2. li = Leben in Dortmund*/
		width: 25%;/* bei 5 Hauptmenüpunkten: 20%*/
		margin-left: 0;
	}

	#hauptMenu > ul > li > button > span:first-of-type{ /*farbige Punkte ausblenden*/
		display: none;
	}


#hauptMenu ul .menulayer .list-group{
	position: inherit;/*Überschreibung der Bootstrap col-xs-12-Angabe*/
	padding-right: 1.071rem;
}
	
/*
#hauptMenu ul .menulayer .list-group .list-group-item{
	border-bottom: 0.071rem solid #eee;
	margin-bottom: 1px;
}
*/


#hauptMenu ul.menulayer div.menulayer{
	position: absolute;
	left: 0;
	margin-left: 0;
	background: #fafafa;
	box-shadow: 0 0.5rem 0.5rem rgb(150,150,150);
	border-top: 0.286rem solid #ebebeb;
}

#hauptMenu ul.menulayer div.menulayer .menulayer{
	top: 5rem;
	width: 97.5%;
	box-shadow: 0 0.214rem 0.714rem rgb(150,150,150);
}

#hauptMenu ul .menulayer .menulayer{
	padding-left: 0;/*Überschreibung xs*/
}

#hauptMenu li a, #hauptMenu li a:link, #hauptMenu li a:visited, #hauptMenu li button{
	padding-left: 15px;
	padding-right: 15px;
}

#hauptMenu ul ul{/*1. Ebene = volle "Seiten"-Breite*/
	width: 100%;
}


/* ..."Laden"-Symbol...*/
#hauptMenu ul ul > li.messageLoading{
	text-align: center;
	padding-top: 1rem;
	padding-bottom: 1rem;
	color: #333;
}
#hauptMenu ul ul > li.messageLoading span.fa{
	margin-right: 0.357rem;
	font-size: 1.5rem;
}

#hauptMenu ul ul > li:first-of-type,
#hauptMenu ul ul ul.single-col > li:first-of-type,
#hauptMenu ul ul ul.double-col > li:first-of-type,
#hauptMenu ul ul ul.triple-col > li:first-of-type{
	background: #e8e8e8;
	position: absolute;
	top: 0;/*0.357rem;*/
	left: 0;/*0.357rem;*/
	width: 100%;
	border-bottom: 0.071rem solid #ddd;/*default*/
/*	-webkit-border-top-left-radius: 0.286rem;
	-webkit-border-top-right-radius: 0.286rem;
	-moz-border-radius-topleft: 0.286rem;
	-moz-border-radius-topright: 0.286rem;
	border-top-left-radius: 0.286rem;
	border-top-right-radius: 0.286rem;*/
}
#hauptMenu ul li#hauptMenu_lebenInDortmund .menulayer .submenuName{
	border-bottom: 0.071rem solid #B12C19;
}
#hauptMenu ul li#hauptMenu_freizeitUndKultur .menulayer .submenuName{
	border-bottom: 0.071rem solid #6C9023;
}
#hauptMenu ul li#hauptMenu_wirtschaft ul .menulayer .submenuName{
	border-bottom: 0.071rem solid #63718B;
}
#hauptMenu ul li#hauptMenu_tourismus .menulayer .submenuName{
	border-bottom: 0.071rem solid #CC6633;
}
#hauptMenu ul li#hauptMenu_buergerserviceUndRathaus .menulayer .submenuName{
	border-bottom: 0.071rem solid #698175;
}
#hauptMenu ul .menulayer .submenuName {
	background: #e8e8e8;
	border-top: 0.071rem solid #ddd;
}

/*Überschreibung xs*/
	#hauptMenu ul .menulayer .submenuName {
		background: #f5f5f5;
		border-top: none;
	}

/*Ende Überschreibung xs*/


#hauptMenu ul .menulayer .submenuName{ /*Menüebene-Überschrift*/
	height: 4.214rem;
	font-weight: 600;
	color: #666;
	padding-top: 0;
	padding-bottom: 0;
/*	-webkit-border-top-left-radius: 0.286rem;
	-moz-border-radius-topleft: 0.286rem;
	border-top-left-radius: 0.286rem;*/
}


#hauptMenu ul .menulayer{
	z-index: 300;
}
#hauptMenu ul .menulayer .menulayer{
	z-index: 310;
}
#hauptMenu ul .menulayer .menulayer .menulayer{
	z-index: 320;
}
#hauptMenu ul .menulayer .menulayer .menulayer .menulayer{
	z-index: 330;
}
#hauptMenu ul .menulayer .menulayer .menulayer .menulayer .menulayer .menulayer{
	z-index: 340;
}
#hauptMenu ul .menulayer .menulayer .menulayer .menulayer .menulayer .menulayer .menulayer{
	z-index: 350;
}




#menu, #subNavMenu{
	padding-left: 1.071rem;
	padding-right: 1.071rem;
}

#menu nav, #subNavMenu nav{
	background: #f2f2f2;
	padding-left: 2rem;
	margin-top: 0;
	border-top: 0;
}

#aufmacher .headline-large{
	-moz-hyphens: none;
   	-o-hyphens: none;
   	-webkit-hyphens: none;
   	-ms-hyphens: none;
   	hyphens: none;
}

}


/* ---- MD Ende ------------------------------------------------------ */


/* ########## */
/*     LG     */
/* ########## */


/*@media (min-width: @screen-lg-min) LESS-Variable*/
@media (min-width: 1200px){ 

/*noch nix*/

}

/* ---- LG Ende ------------------------------------------------------ */


/* #################################################################################################### */
/* ----------- ENDE MEDIA QUERIES ----------------------------------------------------------------------*/
/* #################################################################################################### */



/*
doppelte Styleangaben, damit für bestimmte Fälle in falscher Reihenfolge deklarierte Angaben überschrieben werden können..
Angaben mit ...-ow versehen ("overwrite")
*/

.font-grey-3-ow{
color: #333;
}
.font-grey-6-ow{
color: #666;
}

.font-grey-9-ow{
color: #999;
}
.font-grey-b-ow{
color: #bbb;
}
.font-grey-d-ow{
color: #ddd;
}

.nomargin-ow{
	margin-top: 0;	
	margin-right: 0;
	margin-bottom: 0;
	margin-left: 0;
}

.border-bottom-dotted-ow{
	border-bottom: 0.071rem dotted #999;
}

.top-minus25px-ow{
	top: -25px;
}

.top-100minus25px-ow{
	top: calc(100% + 25px);
	z-index: 50;
}


/* ######################################################################### */
/* ##### Druckansicht ###################################################### */
/* ######################################################################### */

@media print {/*Hochformat und Querformat*/
	
	body{
		padding-top: 0;
	}

	#wrapper:before {/*Wappen+dortmund.de in einbauen, da Hintergrundbilder initial nicht gedruckt werden*/
		
		
			content: url(/media/system/seitenelemente/logos/dortmund_de/wappenstadtdortmund.svg)"dortmund.de"
			
			
			;
		
		position: relative;
		top: 0rem;
	}

	.absenderKennungEnclosure{
		right: 0;
		width: 100%;
		margin-bottom: 2.186rem;		
	}

	#kopfPanorama .absenderKennungEnclosure{
		margin-bottom: 0;
		bottom: 0.214rem;
	}

	#kopfPanoramaKlein #absenderKennung.lebenInDortmund, #kopfPanoramaKlein #absenderKennung.lebenInDortmund h1,
	#kopfPanoramaKlein #absenderKennung.freizeitUndKultur, #kopfPanoramaKlein #absenderKennung.freizeitUndKultur h1,
	#kopfPanoramaKlein #absenderKennung.wirtschaft, #kopfPanoramaKlein #absenderKennung.wirtschaft h1,
	#kopfPanoramaKlein #absenderKennung.tourismus, #kopfPanoramaKlein #absenderKennung.tourismus h1,
	#kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus, #kopfPanoramaKlein #absenderKennung.buergerserviceUndRathaus h1,
	#kopfPanoramaKlein #absenderKennung.allgemein, #kopfPanoramaKlein #absenderKennung.allgemein h1,
	#kopfPanorama #absenderKennung, #kopfPanorama #absenderKennung h1{
		background: transparent;
		border-bottom: 0;
		width: 100%;
		height: auto;
	}

	#kopfPanoramaKlein #absenderKennung h1, #kopfPanorama #absenderKennung h1{
		color: #000;
		font-size: 1.5rem;
		bottom: 0;
		top: -2.857rem;
		right: 0;
		background: transparent;
		border-top: 0;
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
		padding-top:0;
		width: 100%;
		height: auto;
		text-align: right;
		font-weight: normal;
	}


	#dued_banner, #preWrapper, #topNavbarMeta, #metaBox, .kopfPanoramaImg, #kopfPanoramaKlein+div.row/*BU*/,
	#hauptMenu, #menu,
	.fa-stack, .fa-times, .adresse a[rel=nofollow]/*= vcf-Logo+Link*/,
	#ruler, .vk_form, video, .dode-btn-uebersicht, .drehscheibeMarkerBox,
	#fussDortmundDe > div > div, #cookieNoteBox
	{
		display: none;
	}
	
	#topNavbarlogoBox,
	#fussDortmundDe > div > div.rechtsbuendig{
		display: block;
	}
	a, table{
		page-break-inside: avoid;
	}

	h2.dode-border{
		page-break-inside:avoid;
		page-break-after: avoid;
	}


	#aufmacher > div > div{
		display: block !important;
	}
	
	#aufmacher .drehscheibeElementLeiste{
		width: 100% !important;
	}

	#aufmacher .drehscheibenelement{
		width: 100% !important;
		display: block !important;
		float: none;
	}

	#aufmacher .dode-flexbox-container-singleline{
		flex-wrap: wrap;
	    display: block;
	    -webkit-flex-wrap: wrap;
	}

	#aufmacher .drehscheibenelement:first-child{
		display: none !important;
	}

	#aufmacher .drehscheibenelement > a div{
			border-top: 1px dotted #bbb;
			float: right;
			padding: -30px 0 0 0;
			margin-top: 15px;
	}

	#aufmacher .drehscheibenelement > a > div{
			width: 50%;
			float:left;
			padding: 15px 15px 0 0;
			margin-top: 15px;
	}


	a[href^=http]:after  {
      content:" <" attr(href) "> ";
	}

	a:after > img{
   		content: "";
	}

	iframe{
		display: none;
		width: 0;
		height: 0;
	}
	
	div.hauptBox.font-16{
		font-size: 1rem;
		line-height: 1.429rem;
	}
	
}

@media print AND (min-width: 800px){/*Querformat drucken*/
	
	#wrapper:before {/*Wappen+dortmund.de in einbauen, da Hintergrundbilder initial nicht gedruckt werden*/
		top: 0rem;
	}

	.col-inhalt{
		width: 100%;
	}
	
	#kopfPanoramaKlein #absenderKennung h1, #kopfPanorama #absenderKennung h1{
		color: #000;
		font-size: 1.5rem;
		bottom: 0;
		top: -3.214rem;
		right: 0;
		background: transparent;
		border-top: 0;
		padding-left: 0;
		padding-right: 0;
		padding-bottom: 0;
		padding-top:0;
		width: 100%;
		height: auto;
		text-align: right;
		margin-bottom: 0;
	}

}

/* ### ENDE Druckansicht @media print ########################## */
/* ############################################################# */