/*
hohenstein-ernstthal.de
mausgemacht in Deutschland von
HOTWeb.de
2015
*/

/* MAIN COLORS
blau: 		rgb(0, 108, 162);
blau dunkel:	#;
purple: #FC2765;
grey dark:	#202020;
grey mid:	#ddd;
grey light:	#f2f2f2;

*/

/* -------------------------------- FONTS -------------------------------- */

@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 100;
  src: url("../fonts/Roboto-Thin.woff2") format("woff2"), url("../fonts/Roboto-Thin.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 300;
  src:  url("../fonts/Roboto-Light.woff2") format("woff2"), url("../fonts/Roboto-Light.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 400;
  src: url("../fonts/Roboto-Regular.woff2") format("woff2"), url("../fonts/Roboto-Regular.woff") format("woff");
}
@font-face {
  font-family: "Roboto";
  font-style: normal;
  font-weight: 700;
  src: url("../fonts/Roboto-Bold.woff2") format("woff2"), url("../fonts/Roboto-Bold.woff") format("woff");
}
@font-face {
  font-family: 'FontAwesome';
  src: url('../fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.4.0') format('woff');
  font-style: normal;
  font-weight: normal;
}







/* -------------------------------- RESET -------------------------------- */

* {
	margin:0px;
    padding:0px;
    border:0px;
    outline:0px;
	box-sizing: border-box;
}







/* -------------------------------- MAIN -------------------------------- */

html {
	height:100%;
}
body {
	/* font: 15px/100% 'Roboto', Arial, helvetica, sans serif; */
	font: normal 15px Arial;
	font-weight:300;
	color:#202020;
	height:100%;
	background:#F6F6F6;
	padding-bottom:60px;
}







/* -------------------------------- MISC -------------------------------- */

.clear { clear: both;}
.float_right { float: right; margin-left:10px;}
.float_left { float: left; margin-right:10px;}
.align-center {	text-align:center;}
.inner { margin:0px auto; }
.graue-box { background:#f2f2f2; padding:15px; margin-bottom:20px; }
.green {color:Green;}






/* -------------------------------- HEADER - TOP-NAVI, SEARCH, LANGSWITCHER, LOGO, MAIN-NAVI -------------------------------- */

header {
	background:url(../images/header04.jpg) no-repeat center center;
	background-size:cover;
	height:251px;
}
	header .inner{

	}
		/* --- TOP-NAVI --- */

		header .inner ul.topnavi {
			list-style:none;
			float:right;
			background-color:rgba(255,255,255,.9);
			padding:0 10px;
		}
			header .inner ul.topnavi li {
				display:inline-block;
				position:relative;
			}
				header .inner ul.topnavi li a{
					color:#202020;
					padding:15px 15px 14px;
					margin:0;
					text-transform:uppercase;
					text-decoration:none;
					font-size:13px;
					display:block;
					transition:color ease 0.25s;
				}
				header .inner ul.topnavi li a:hover, ul.topnavi li.active a, ul.topnavi li a:focus{
					color:#FC2765;
					transition:color ease 0.25s;
				}


		/* --- SEARCH, LANGSWITCHER --- */

		header .inner div.search_lang_top {
			display:inline;
			vertical-align:top;
			float:right;
			background-color:rgba(255,255,255,.8);
			padding:1px 20px 2px 0px;
		}
			header .inner .search_lang_top p,
			header .inner .search_lang_top form {
				display:inline-block;
				vertical-align:middle;
				padding:5px 8px;
			}
				header button[type=submit] {
					font:14px 'FontAwesome';
					background:rgb(0, 108, 162);
					color:#fff;
					display:inline-block;
					margin-right:10px;
					cursor:pointer;
					padding:6px;
				}
			header .inner .search_lang_top #mailformsword {
				margin-bottom:0!important;
				width: 140px; /* needed because otherwise there will be a linebreak because we added "Datenschutz" to navigation */
			}
			header .inner .search_lang_top p {
				background:rgba(0,0,0,.05);
				padding:7px 8px 5px 8px;
				border-bottom:1px solid #dddddd;
			}
			/* SPRACHSWITCHER TEMPORÄR AUSGEBLENDET */
			header .inner .search_lang_top p {
				display:none;
			}
			/* */	
			
			header .inner .search_lang_top p img {
				height:16px;
				width:auto;
			}

		header .inner .search-lang-toggle {
			display:none;
			font:'FontAwesome';
		}
		header .inner .navi-toggle,
		header .inner .lang-toggle {
			display:none;
		}


		/* --- LOGO --- */

		header .inner a img.logo_gr {
			max-width:226px;
			height:auto;
			margin:20px 0px;
			width:17%;
		}
		header .inner a img.logo_kl {
			display:none;
		}


	/* --- MAIN-NAVI --- */

	header #navi {
		background-color:#000;
		margin-top:40px;
		position: relative;
	}
	header #navi.sticky {	/* visible only in desktop-view when scrolling */
		position:fixed;
		top:0;
		width:100%!important;
		margin-top:0!important;
		z-index:999;
		background:#000!important;
	}

		/* home-icon */

		header #navi .icon_navi {
			width:25px;
			float:left;
			margin: 10px 20px 0 0;
			height:20px;
		}
			header #navi .icon_navi img {
				height:20px;
			}


		/* navi lvl 1 */

		header #navi ul.mainnavi {
			list-style:none;
			float:left;
		}
			header #navi ul.mainnavi li {
				display:inline-block;
				position:relative;
			}
				header #navi ul.mainnavi li a{
					color:#e3e3e3;
					padding:15px 15px;
					margin:0;
					text-transform:uppercase;
					text-decoration:none;
					font-size:15px;
					display:block;
					transition:color ease 0.25s;
				}
					header #navi ul.mainnavi ul li a{
						color: #202020;
					}
				header #navi ul.mainnavi li a:hover {
					color:#fff;
				}
				header #navi ul.mainnavi > li:first-child a {
					padding-left:0px;
				}

				/* navi lvl 2 */

				header #navi ul.mainnavi ul {
					display:none;
				}
				header #navi ul.mainnavi li:hover > ul {
					position:absolute;
					top:100%;
					left:0px;
					padding:10px;
					margin:0px;
					border-top:1px solid #7d9f14;
					background: #fff;
					box-shadow:0px 10px 20px rgba(0,0,0,.15);
					z-index:100;
					display:block;
					border-radius:0px 0px 4px 4px;
					width:auto;
				}
					header #navi ul.mainnavi ul li{
						display:block;
						white-space:nowrap;
					}
					header #navi ul.mainnavi li ul li a{
						padding:10px;
						margin:0px;
						border: 0px;
						text-transform:none;
						text-decoration:none;
						display:block;
						transition:color ease 0.25s;
					}
					header #navi ul.mainnavi li ul li a:hover {
						color:#353535;
					}
					header #navi ul.mainnavi li ul li ul,
					header #navi ul.mainnavi li ul li:hover ul	{
						display:none;
					}







/* -------------------------------- CONTENT - BREADCRUMB, GRID, SUB-NAVI -------------------------------- */

#content {
	padding:20px 0px;
	background-color:#f7f7f7;
	background:url(../images/bg-content.jpg) fixed;
	background-size:cover;
	margin:0px;
}

	/* --- BREADCRUMB --- */

	#content .inner .breadcrumb {
		color:grey;
		font-size:11px;
		margin-bottom:20px;
		margin-left:-10px;
	}
	#content .inner .breadcrumb a{
		text-decoration:none;
		padding:5px 10px;
		color:#202020;
		text-transform:uppercase;
	}


	/* --- GRID - LAYOUT --- */

	#content > .inner > .cols2-75first {
		width:66.666666666666%;
		padding-right:1%;
		display:inline-block;
		vertical-align:top;
		position:relative;
	}
	#content > .inner > .cols2-25first,								/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first { 	/* location-detail-page */
		width:33%;
		display:inline-block;
		vertical-align:top;
		margin-right:1%;
		padding:20px 20px 0 20px;
		float:left;
		background:#fff;
	}
		#content > .inner > .cols2-25first li a,							/* normal page */
		#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first li a {	/* location-detail-page */
			line-height:200%!important;
		}

	#content > .inner > .cols2-75second,									/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-75second {			/* location-detail-page */
		width:65%;
		margin-left:1%;
		display:inline-block;
		vertical-align:top;
		position:relative;
		background:#fff;
		padding:20px 40px;
	}
	#content > .inner > .cols2-25second {
		width:33%;
		display:inline-block;
		vertical-align:top;
		margin-left:1%;
		padding:20px;
		background:#fff;
	}


	/* --- SUB-NAVI --- */

	/* navi lvl 1 */

	#content > .inner > .cols2-25first .nav-level-3-toggle {
		border-bottom:1px solid #fff;
		background:rgb(0, 108, 162);
		color:#fff;
		cursor:pointer;
		width:100%;
		padding:10px;
		line-height:200%;
		text-align:left;
		font-size:18px;
		margin-bottom:20px;
		display:none;
	}
	#content > .inner > .cols2-25first .nav-level-3-toggle:after {
		content:'';
		display:block;
		margin:0 20px 0 0;
		float:right;
		font-family:'fontawesome';
	}
	#content > .inner > .cols2-25first .nav-level-3-toggle:hover {
		background:#027ab5;
	}

	#content > .inner > .cols2-25first ul.subsubnavi {
		/* Susi commended out the line with the arrow */
		/*
		padding-top:20px;
		border-top:1px solid #ddd;
		background:url(../images/arrowdown.png) top center no-repeat;
		*/
		margin:0px 0px 20px 0px !important;
	}
		#content > .inner > .cols2-25first ul.subsubnavi li,
		#content > .inner > .cols2-25first ul.subsubnavi ul li	{
			position:relative;
			border-bottom:1px solid #fff;
			margin:0px !important;
			padding-left: 0px;
		}
		#content > .inner > .cols2-25first ul.subsubnavi li:before,
		#content > .inner > .cols2-25first ul.subsubnavi ul li:before	{
			content:none !important;
		}
			#content > .inner > .cols2-25first ul.subsubnavi li a,
			#content > .inner > .cols2-25first ul.subsubnavi ul li a{
				color:rgb(0, 108, 162);
				background:#f2f2f2;
				padding:3px 10px;
				text-decoration:none;
				display:block;
				transition:background ease 0.25s;
			}
			#content > .inner > .cols2-25first ul.subsubnavi li a:hover,
			#content > .inner > .cols2-25first ul.subsubnavi li a:focus,
			#content > .inner > .cols2-25first ul.subsubnavi li.active ul li:hover a,
			#content > .inner > .cols2-25first ul.subsubnavi li.active ul li:focus a{
				color:#fff;
				background:#202020;
				transition:background ease 0.25s;
			}
			#content > .inner > .cols2-25first ul.subsubnavi li a.active,
			#content > .inner > .cols2-25first ul.subsubnavi li.active ul li a.active {
				background:rgb(0, 108, 162);
				color:#fff;
			}
			#content > .inner > .cols2-25first ul.subsubnavi li.hassubitems > a:after {
				content:'';
				font-family:'fontawesome';
				margin-left:15px;
			}

			/* navi lvl 2 */

			#content > .inner > .cols2-25first ul.subsubnavi li.hassubitems ul {
				display:none;
			}
			#content > .inner > .cols2-25first ul.subsubnavi li ul,
			#content > .inner > .cols2-25first ul.subsubnavi ul li ul {
				margin:1px 0px 0px 0px !important;
			}
				#content > .inner > .cols2-25first ul.subsubnavi li ul li,
				#content > .inner > .cols2-25first ul.subsubnavi ul li ul li{
					position:relative;
					border-bottom:1px dotted #fff;
					margin:0px !important;
				}
				#content > .inner > .cols2-25first ul.subsubnavi li ul li:last-child{
					border-bottom:none;
				}
				#content > .inner > .cols2-25first ul.subsubnavi li ul li a{
					background:#e8e8e8;
					padding-left:20px;
				}
				#content > .inner > .cols2-25first ul.subsubnavi li.active ul li a{
					background:#e5e5e5;
				}
				#content > .inner > .cols2-25first ul.subsubnavi li ul li ul li a{
					padding-left:30px;
				}







/* -------------------------------- FOOTER -------------------------------- */

footer {
	margin-top:30px;
	clear:both;
}
	footer .inner{
		padding:50px 0px
	}
		footer .footerbox {
			display:inline-block;
			vertical-align:top;
			line-height:130%;
			font-size:13px;
			margin-right:20px;
		}







/* -------------------------------- GRID - CONTENT -------------------------------- */

.row {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	align-items: stretch;
	flex-direction:row;
	position: relative;
	width: 100%;
}
	.row label{
		display: inline-block !important;
		width: 150px !important;
	}
	.row textarea{
		height: 300px;
	}
	.row input[type=radio]{
		width: 30px !important;
		align-self: center;
	}
	.row .area{
		align-self: stretch;
		display: inline-block;
		background: #f5f5f5;
		width: 30%;
		margin-right: 5px;
		padding: 5px;
	}
	.row .description{
		display: inline-block;
		width: 70%;
		padding: 5px;
		line-height: 110%;
	}
	.row .row-group{
		flex-shrink: 40;
		position: relative;
		width: 80%;
	}
		.row .row-group select,
		.row .row-group input
		{
			width: 30% !important;
			float:left;
			margin-right:3%;
		}
		.row .row-group select#eventCategoryFilter {
			width:96%!important;
			float:none;
			margin-right:0;
		}
		.row .row-group .row{
			display: flex;
			margin-bottom: 5px;
			border: 1px solid #f5f5f5;
		}
		#area{
			display: none;
		}
.abs{
	position: absolute;
	left: 30000px;
}
.grid_10, .grid_20, .grid_25, .grid_33, .grid_40, .grid_50, .grid_55, .grid_60, .grid_66, .grid_60, .grid_75, .grid_80 {
	display:inline-block;
	vertical-align:top;
	flex-grow:1;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	/* padding: 20px; */
	margin: 0 1%;
	background:#fff;
	margin-right:20px;
}
.grid_first{	margin-left: 0px ;}
.grid_last{		margin-right: 0px ;}

.grid_10 {	width:9%;}
.grid_20 {	width:19%;}
.grid_25 {	width:24%;}
.grid_33 {	width:32%;}
.grid_40 {	width:39%;}
.grid_50 {	width:49%;}
.grid_55 {	width:54%;}
.grid_60 {	width:59%;}
.grid_66 {	width:65%;}
.grid_60 {	width:59%;}
.grid_75 {	width:74%;}
.grid_80 {	width:79%;}

.grid_10 .csc-frame-default,
.grid_20 .csc-frame-default,
.grid_25 .csc-frame-default,
.grid_33 .csc-frame-default,
.grid_40 .csc-frame-default,
.grid_50 .csc-frame-default,
.grid_55 .csc-frame-default,
.grid_60 .csc-frame-default,
.grid_66 .csc-frame-default,
.grid_60 .csc-frame-default,
.grid_75 .csc-frame-default,
.grid_80 .csc-frame-default {
	margin-bottom:25px;
}

.cols2-75first > .csc-frame-default ,
.cols2-25first > .csc-frame-default ,
.cols2-75second > .csc-frame-default ,
.cols2-25second > .csc-frame-default ,
.row .csc-frame-default {
	background:#fff;
	padding:0;
}

.cols2-75first .row .csc-frame-default ,
.cols2-25first .row .csc-frame-default ,
.cols2-75second .row .csc-frame-default ,
.cols2-25second .row .csc-frame-default {
	background:none;
	padding:0px;
	margin-bottom:0px;
	border-bottom:none;
}
.cols2-75second > .csc-frame-default{
	padding-top: 60px!important; 
	margin-top: -60px!important;
	background:none!important;
}

/* special style for homepage (c4 = homepage-layoutblock) */
#c4 .grid_50,
#c4 .grid_25{
	padding:20px!important;
}

/*
.csc-frame-default .grid_50 {
	padding:20px 0!important;
}
*/







/* -------------------------------- TEASER-BOX (can be set for each typo3-content in "border") -------------------------------- */

.teaser_box .grid_33 {
	border:1px solid #7d9f14!important;
	background:rgba(162,206,29,0.05)!important;
	padding:10px 20px;
	margin-bottom:20px;
}
	.teaser_box .grid_33 h2,
	.teaser_box .grid_33 h3 {
		color:#7d9f14;
	}

	.teaser_box .grid_33 a p{
		color: #202020;
	}







/* -------------------------------- TYPO -------------------------------- */

/* --- HEADLINES --- */

#content h1 {
	font-size:27px;
	font-weight:300;
	margin:0px 0 20px;
	line-height:125%;
	color:#7d9f14;
	font-weight:bold;
}

#content h2 {
	font-size:23px;
	font-weight:400;
	color:#000;
	margin:20px 0 10px;
	line-height:135%;
	display:block!important;
}
#content h3 {
	font-size:19px;
	font-weight:400;
	margin:20px 0 5px;
	line-height:135%;
	color:#202020;
}
#content h4,
#content h4 a {
	font-size:18px;
	font-weight:300;
	margin:10px 0px;
	line-height:135%;
}
#content h5,
#content h5 a {
	font-size:16px;
	font-weight:300;
	margin:10px 0px;
	line-height:135%;
}


/* --- PARAGRAPHS, LINKS, HR --- */

#content p {
	line-height:150%;
	margin-bottom:15px;
}
#content b{
	font-weight: bold;
}
#content a, #content .link {
	color:rgb(0, 108, 162);
	text-decoration:none;
	transition:color ease 0.25s;
	cursor:pointer;
}
#content a:hover, #content .link:hover {
	color:#01689b;
	transition:color ease 0.25s;
}

/*
#content a.external-link-new-window:after,
#content a.mail:after {
	content:'\f08e';
	font:13px 'FontAwesome';
	color:#202020;
	margin-left:5px;
}
*/

#content hr {
	border-bottom:1px solid #dddddd;
	height:1px;
	background:none;
	margin:20px 0px;
}
#content iframe {
  width: 100%    !important;
  border:0px;
}


/* --- LISTS --- */

#content ul,
#content ol {
	margin:15px 0 25px;
}
#content ol{
	margin-left: 15px;
}
	#content ul li,
	#content ol li{
		line-height:130%;
		position:relative;
		margin-bottom:10px;
	}
	#content ul li {
		list-style:none;
		padding-left: 15px;
	}
	#content ul li:before {
		content:'';
		font-family: "FontAwesome";
		font-size: 9px;
		display:block;
		position: absolute;
		left: 0;
	}
	#content ol li {
	}
		#content li ul{
			margin:10px 0px 10px 10px;
		}
		#content li ol{
			margin:10px 0px 10px 25px;
		}
			#content ul li ul li:before {
				content:'';
				font-family:'FontAwesome';
				position: absolute;
				left: 0;
				color:rgb(0, 108, 162);
			}







/* -------------------------------- TABLES -------------------------------- */

table {
	border: none;
	border-collapse: collapse !important;
	width:100%;
	margin-bottom:20px;
	border-bottom:1px solid #ddd;
	border-top:1px solid #ddd;
}
	table tr {
		border-bottom:1px solid #f2f2f2;
	}
	table tr:last-child {
		border:none;
	}
	table tr:nth-child(odd){
		background: #eee;
	}
		table thead th {
			background:#575757;
			color:#fff;
			text-align:left;
		}
		table tr td,
		table th{
			padding:5px 10px;
			line-height:130%;
			vertical-align:top;
		}
		table th {
			color:#fff;
			background:#575757;
			text-align: left;
		}
			table td p {
				margin:0;
				line-height:130%;
			}







/* -------------------------------- FORMS -------------------------------- */

#content .errors li{
	color: red;
}
input,
textarea,
#content form input,
#content form select,
#content form textarea {
	margin-bottom:10px;
	background:#f5f5f5;
	padding:6px 10px;
	font: 14px/135% 'Roboto', Arial, helvetica, sans serif;
	font-weight:400;
	color:rgb(0, 108, 162);
	border-bottom:1px solid #dddddd;
	width:68%;
}
input:focus {
	border-bottom:1px solid #dddddd;
}
select {
	border-bottom:1px solid #dddddd;
	font: 14px/135% 'Roboto', Arial, helvetica, sans serif;
	font-weight:400;
	color:rgb(0, 108, 162);
	padding:6px 10px;
}
select option {
	padding:6px 10px;
}
.button{
	background:rgb(0, 108, 162);
	color:#fff;
	display:inline-block;
	margin-right:10px;
	cursor:pointer;
	padding:8px;
	border-radius: 3px;
}
form fieldset {
	border-radius:3px;
	border:1px solid #dddddd;
	padding:20px;
}
form fieldset legend {
	border-radius:3px;
	border:1px solid #dddddd;
	padding:5px 15px;
	font-size:11px;
	text-transform:uppercase;
}
#content form label {
	width:30%;
	display:inline-block;
	vertical-align:top;
	font-size:12px;
}
#content input[type=submit] {
	border-radius:3px;
	font-size:18px;
	font-weight:700;
	color:#fff;
	background:rgb(0, 108, 162);
	border-bottom:1px solid #dddddd;
	margin:15px auto;
	padding:15px auto !important;
	display:block;
	width:30%;
	min-width:250px;
	cursor:pointer;
	transition:background ease 0.25s;
}
#content input[type=submit]:hover,
#content input[type=submit]:focus {
	background:#FC2765;
	transition:background ease 0.25s;
}
#content input {}







/* -------------------------------- IMAGES, MEDIA -------------------------------- */

img, embed, object, video {		/* flexible Medien*/
	/* max-width: 100%; */
	height: auto;
	width: auto;
	max-height:300px;
}
figure {
	display:block !important;
}
div.csc-textpic-center .csc-textpic-center-inner,
div.csc-textpic-center .csc-textpic-center-outer {
    position: relative;
	display:block;
	max-width:100%;
}
div.csc-textpic-intext-right .csc-textpic-imagewrap,
div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
    margin-left: 40px!important;
}
div.csc-textpic-border div.csc-textpic-imagewrap img {
	padding:5px;
	border:1px solid #ddd;
}
.csc-textpic-imagerow {
	display: flex;
	margin-bottom:10px;
}
/*
.csc-textpic {
	margin-bottom:20px;
}
*/
.csc-textpic-below .csc-textpic-imagewrap, .csc-textpic-above .csc-textpic-imagewrap{
	margin:20px 0;
	float:none!important;
}
.csc-textpic-image {
	margin:0!important;
}
.csc-textpic-center-inner .csc-textpic-imagecolumn {
	float:left!important;
}
figure.csc-textpic-image {
	position:relative;
}
figcaption {
	bottom: 0;
    transition: bottom 1s ease 0s;
	position:absolute;
	background: rgba(0, 153, 229, 0.95) none repeat scroll 0 0;
    font-size: 13px;
    padding: 10px;
    width: 100%;
	color:#fff;
}
figure.csc-textpic-image:hover figcaption {
	bottom: -100px;
}
div.csc-textpic-intext-left .csc-textpic-imagewrap,
div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
	margin:0 40px 30px 0;
	max-width: 50%;
}
div.csc-textpic-intext-right .csc-textpic-imagewrap,
div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
	margin:0 0 30px 40px;
	max-width: 50%;
}



/* ############### GALERIE ################## */


.data-images .csc-textpic, .data-images .csc-textpic div.csc-textpic-imagerow, .data-images ul.csc-uploads li {
	overflow:visible;
}
.data-images .csc-textpic div.csc-textpic-imagecolumn {
    float: left;
    width: 32%;
	overflow:hidden;
}
.data-images .csc-textpic-center .csc-textpic-center-outer,
.data-images .csc-textpic-center .csc-textpic-center-inner {
	float:left;
	right: auto;
	left:0;
	width:100%;
}
.data-images .csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
	border:5px solid #eee;
}
.data-images .csc-textpic .csc-textpic-imagewrap .csc-textpic-image img {
	height:auto;
	max-height:none!important;
	max-width:none!important;
	width:100%;
}




/* lightbox - ignore max-height for lightbox! */

.cboxPhoto {
	max-height:none!important;
}


.youtubevideo {
	position: relative;
}
.youtubevideo:before {
	display: block;
	content: "";
	width: 100%;
	padding-top: 56.25%;
}
	.youtubevideo > iframe {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		height:100% !important;
	}

/* delete if not needed anymore */
/*
.imageSlider{
	max-width: 100%;
	display: inline-block;
}
	.imageSlider .pallet{
		margin-bottom: 20px;
		display: flex;
		justify-content: center;
		max-width: 100%;
		position: relative;
	}
	.imageSlider .thumbnails{
	    height: 82px;
	    overflow-x: hidden;
	    overflow-y: hidden;
	    white-space: nowrap;
	    display: inline-block;
	}
	.imageSlider .pallet .thumbnails span{
	    height: 80px;
	    width: 80px;
	    display: inline-block;
	    margin: 0 5px 0 5px;
	    cursor: pointer;
	    border: 1px solid #878787;
	    opacity: .4;
	    background: center no-repeat;
	    background-size: cover;
	}
	.imageSlider .pallet .thumbnails .active{
		opacity: 1;
	}
	.imageSlider .bigImage .container{
		margin: 0 auto;
		position: relative;
	}
	.imageSlider .bigImage .container img{
		margin: 0 auto;
		border: 1px solid #c7c7c7;
	}
	.imageSlider .pallet .left-arrow,
	.imageSlider .pallet .right-arrow{
		display: inline-block;
		width: 35px;
		text-align: center;
		line-height: 500%;
		cursor: pointer;
		color: rgb(0, 108, 162);
	}
	.imageSlider .left-arrow:before{
		content:"\f053";
		font-family: FontAwesome;
	}
	.imageSlider .right-arrow:after{
		content:"\f054";
		font-family: FontAwesome;
	}
*/








/* -------------------------------- DATA-GRID (e.g. used for Behörden, Behördenwegweiser, News, Veranstaltungen) -------------------------------- */

/* --- DATA FILTER --- */

.data-filter{
	margin: 10px 0 20px 0;
	position: relative;
}
	.data-filter .submit button{
		border-radius:3px;
		font-size:14px;
		font-weight:700;
		color:#fff;
		background:rgb(0, 108, 162);
		border-bottom:1px solid #dddddd;
		padding:5px !important;
		display:block;
		width:100%;
		cursor:pointer;
		transition:background ease 0.25s;
	}
	.data-filter .data-alphabet{ /* e.g. used for Behörden, Behördenwegweiser */
		display: inline-block;
	}
		.data-filter span,
		.data-filter .data-alphabet span,	/* e.g. used for Behörden, Behördenwegweiser */
		.data-filter .day-filter span{		/* e.g. used for Veranstaltungen */
			background: #f2f2f2;
			display: inline-block;
			padding: 7px 10px;
			margin: 3px;
			border-radius: 3px;
			margin-top: -1px;
			margin-bottom: 10px;
			cursor: pointer;
			transition:background ease 0.25s;
			transition:border ease 0.25s;
			border: 1px solid #f2f2f2;
		}
		.data-filter .day-filter .active{
			background: #eee;
			border: 1px solid rgb(0, 108, 162);
		}
	.data-filter .button:hover,
	.data-filter .data-alphabet span:hover,
	.data-filter .day-filter span:hover{
		background: #eee;
		border: 1px solid rgb(0, 108, 162);
	}


/* --- DATA ROW --- */

.data-row{
	position: relative;
}
	.data-row label{
		display: inline-block;
		width: 120px;
		line-height: 130%;
	}
	.data-row select{
		width: 100% !important;
	}
	.data-row span{
		line-height: 130%;
		display: inline-block;
	}
	.data-row .full{
		line-height: 200%;
		display: block;
	}
	.data-row .header{
		font-size: 18px;
	}
	.data-row .btn{
		width: 100% !important;
		min-width: initial !important;
		margin: 0 !important;
		padding: 5px !important;
		font-size: 16px !important;
		font-weight: 500 !important;
	}


/* --- DATA LIST --- */

.data-list{
	position: relative;
}
	.data-list .dataTables_filter{
		margin-bottom: 10px;
	}
		.data-list .dataTables_filter label{
			display: block;
			width: 100%;
		}
		.data-list .dataTables_filter label input{
			margin-left: 10px;
			padding:10px;
		}

	.data-list .data-item {
		border-bottom: 1px solid #ddd;
		margin:10px 0;
		padding:10px 0;
	}
		.data-list .data-item .data-header{
			display: flex;
			flex-wrap: wrap;
		}
		.data-list .data-item .data-header > div{
			margin-right: 10px;
		}
		.data-list .data-item .data-location:before{
			content:"\f0ac";
			font-family: Fontawesome;
			margin-right: 3px;
		}
		.data-list .data-item .data-date:before{
			content:"\f073";
			font-family: Fontawesome;
			margin-right: 5px;
		}
		.data-item .teaser p {
			margin:0!important;
		}
		.data-list .data-item .data-content{
			display: flex;
			flex-direction: row;
			align-items: stretch;
		}

			.data-list .data-item .data-content .item{
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				min-width: 25%;
				max-width: 75%;
				margin-right: 15px;
			}
			.data-list .data-item .data-content .preview{
				align-items: flex-end;
				flex-grow: 2;
			}
			.data-list .data-item .data-content .preview img{
				max-width: 100%;
				border: 1px solid #ddd;
			}
			.data-list-preview{		/* preview-image e.g. /de/leben-und-wohnen/kultur-freizeit/rathauskonzerte/ */
				width: 150px;
			}

	.data-list h3.data-headline,
	.data-item h3,
	.data-list h2.data-headline,
	.data-item h2{
		font-size: 20px;
		padding: 0;
		margin:30px 0 5px;
		line-height: 120%;
	}
	.news .data-list h3.data-headline,
	.tx_hot .data-item h3,
	.news .data-list h2.data-headline,
	.tx_hot .data-item h2 {
		font-size: 20px;
		padding: 0;
		margin:5px 0;
		line-height: 120%;
	}

.data-list-tags {
	font-size:11px;
	margin: 10px 0;
}
	.data-list-tags .data-category {
		display: inline-block;
		padding-right: 8px;
		margin-right: 8px;
		border-right: 1px solid #ddd;
	}
	.data-list-tags .data-category:last-child {
		border: 0;
	}


/* --- DATA DETAIL --- */

.data-detail{
}
	.data-detail .teaser{
		margin: 0 0 20px 0 !important;
	}
	.data-detail .images img{
		max-width: 200px;
	}
	.data-detail .row {
		padding-bottom:20px;
	}
	.data-detail h2.data-headline{
		font-size: 24px;
		padding: 0 0 20px 0;
		line-height: 130%;
	}
	.data-detail .data-date{
		display: block;
		margin-bottom: 15px;
		border-top:none!important;
		font-size:20px;
	}
	.data-detail .data-date:before{
		content:"\f073";
		font-family: Fontawesome;
		margin-right: 10px;
	}
	.data-detail .data-content .preview{
		position: relative;
	}

.data-detail-tags {
	font-size:11px;
	margin-bottom:10px;
}
	.data-detail-tags .data-category {
		display: inline-block;
		padding-right: 8px;
		margin-right: 8px;
		border-right: 1px solid #ddd;
	}
	.data-detail-tags .data-category:last-child {
		border: 0;
	}

.icon:before{
	font-family: FontAwesome;
	font-style: inherit !important;
	margin-right: 15px;
	width: 10px;
	height: 10px;
	display: inline-block;
	font-size: 15px;
}
	.icon-e-mail:before{	content: "\f0e0";	}
	.icon-web:before{		content: "\f0ac";	}
	.icon-phone:before{		content: "\f095";	}
	.icon-mobile:before{	content: "\f10b"; /*font-size: 22px;*/	}
	.icon-fax:before{		content: "\f1ac";	}
	.icon-area:before{		content: "\f19c";	}







/* -------------------------------- NEWS -------------------------------- */

.news {
	margin:30px 0 10px;
}

.news-list-date,
.news-single-date,
.news-latest-date,
.news-list-category{
	font-size:11px;
	margin-bottom:10px;
}
.news-latest-item h2 {
}
.news-latest-item h2 a {
}
.news-latest-item p {
}
.news-list-morelink,
.news-single-backlink {
	font:13px 'FontAwesome';
	color:rgb(0, 108, 162);
	display:inline-block;
	margin-right:10px;
	cursor:pointer;
	padding:0px 5px;
}
.news-list-morelink  a,
.news-single-backlink a {
	text-decoration:none;
}
.news-latest-category {
	display:none;
}

.news-list-view a.more {
	margin-top:20px;
	display:inline-block;
}
.news-list-view .header h3 {
	margin-top:10px;
	display:block;
}







/* -------------------------------- ACCORDION -------------------------------- */

.accordion h2.accordion_header {
	cursor:pointer;
}
	.accordion .accordion_body {
		display:none;
	}







/* -------------------------------- EXPANDABLE-LIST -------------------------------- */

.expandable-list{
	width: 100%;
	margin-bottom: 5px;
	position: relative;
	background: rgb(240, 240, 240);
}
	.expandable-list .expandable-list-header{
		padding: 1px 10px 1px 10px;
		cursor: pointer;
		border-bottom: 1px solid grey;
	}
		.expandable-list .expandable-list-header h3{
			margin: 10px 0 10px 0 !important;
		}

	.expandable-list .expandable-list-body{
		padding: 10px 10px 10px 10px;
	}
	.expandable-list .expandable-list-body{
		display: none;
	}
		.expandable-list .expandable-list-body h4{
			/* color: rgb(0, 108, 162) !important; */
			font-size: 14px !important;
			font-weight: bold !important;
		}
		.expandable-list .expandable-list-body .content{
			margin-left: 10px;
		}
		.expandable-list .expandable-list-body .downloads > a{
			display: block;
		}
		.expandable-list .expandable-list-body .downloads > a:after {
			content:'';
			font-family:'fontawesome';
			margin-left:15px;
		}
		.expandable-list .expandable-list-body .data-row label {
		}
			.expandable-list .expandable-list-body .data-row .contactPersons .data-row label {
				font-weight: normal;
			}







/* -------------------------------- PROCESS-TABLE -------------------------------- */

.process-table{
}
	.process-table thead{
		display: none;
	}
	.dataTables_length,
	.dataTables_info,
	.dataTables_paginate{
		display: none !important;
	}







/* -------------------------------- AGENCY-TABLE -------------------------------- */

.agency-table{
}
	.agency-table th,
	.location-specialisation-table th{
		text-align: left !important;
	}

.agency-list{
}
	.agency-list .agency{
		margin-bottom: 10px;
		position: relative;
	}
		.agency-list .agency .title{
			font-weight: 500;
			padding: 15px;
			display: block;
			background: #575757;
			line-height: 130%;
			word-wrap: break-word;
			position: relative;
			color: white;
		}
		.agency-list .agency .title .contact span{
			margin-right: 15px;
			display: block;
		}
			#content .agency-list .agency  > .title a{
				color: white;
			}
			.agency-list .agency .contactPerson {
				font-weight:bold;
			}
	.agency-list .agency .subElements{
	}
	.agency-list .agency .subElements .subAgency{
		margin: 20px 0 20px 0;
	}
	.agency-list .agency .title,
	.agency-list .agency .subElements .subAgency .title{
		line-height: 130%;
		word-wrap: break-word;
		position: relative;
		display: flex;
		align-items: stretch;
	}
	.agency-list .agency .subElements .subAgency .title{
		color: #202020;
		background: #eee;
	}
		.agency-list .agency .subElements .subAgency .title .email-button a{
			color: #202020;
		}
		.agency-list .agency .subElements .subAgency .subElements .subAgency .title a,
		.agency-list .agency .subElements .subAgency .subElements .subAgency .title .information a,
		.agency-list .agency .subElements .subAgency .title .information a{
			color: rgb(0, 108, 162);
		-webkit-hyphens: auto!important;
		-moz-hyphens: auto!important;
		-ms-hyphens: auto!important;
		-o-hyphens: auto!important;
		hyphens: auto!important;
		}
		.agency-list .agency .title a:hover,
		.agency-list .agency .subElements .subAgency .title .email-button a:hover,
		.agency-list .agency .subElements .subAgency .title .information a:hover,
		.agency-list .agency .subElements .subAgency .subElements .subAgency .title a:hover{
			color: #FC2765;
		}
		.agency-list .agency .subElements .subAgency .title .contact{
			font-size: 14px;
		}
			.agency-list .agency .subElements .subAgency .title .contact span:before{
				font-size: 14px;
				margin-right: 10px;
			}

		.agency-list .agency .title .information,
		.agency-list .agency .subElements .subAgency .title .information{
			min-width: 90%;
		}
		.agency-list .agency .title .email-button,
		.agency-list .agency .subElements .subAgency .title .email-button{
			min-width: 10%;
			display: flex;
			flex-direction: column;
			justify-content: center;
		}
			.agency-list .agency .title .email-button a,
			.agency-list .agency .subElements .subAgency .title .email-button a{
				display: inline-block;
				font-size: 48px;
			}
			.agency-list .agency .title .email-button a span:before,
			.agency-list .agency .subElements .subAgency .title .email-button a span:before{
				font-size: 48px;
			}

		.agency-list .agency .subElements .subAgency .subElements{
			display: flex;
			flex-wrap: wrap;
			align-items: stretch;
			border-left: 1px solid #eee;
		}
			.agency-list .agency .subElements .subAgency .subElements .subAgency{
				width: 25%;
				margin: 0;
				padding: 10px 0 10px 0;
				border-right: 1px solid #eee;
				border-bottom: 1px solid #eee;
			}
				.agency-list .agency .subElements .subAgency .subElements .subAgency .title{
					background: none;
				}
				.agency-list .agency .subElements .subAgency .subElements .subAgency .subElements{
					border: none;
				}

/* delete if not needed anymore */
/*
.tree{
	padding: 7px;
	background: #f2f2f2;
}

.agency-tree{
	margin-top: 10px;
}
	.agency-tree #agency-tree-content-area{
		padding: 12px;
	}
	.agency-tree #agency-tree-content-area .expandable-list .expandable-list-header{
		background: #c2c2c2;
	}
	.agency-tree .content-area{
		background: #f2f2f2;
		padding: 7px;
		float: right;
	}
	.agency-tree .contactPerson{
		color:rgb(0, 108, 162);
	}
	.agency-tree .agency{
		color:rgb(0, 108, 162);
	}
		.agency-tree .agency .title{
			margin-left: 5px;
			height: 19px;
			display: inline-block;
			vertical-align: top;
			line-height: 145%;
		}

	.agency-tree-icon{
		width: 22px;
		height: 19px;
		display: inline-block;
		background-size: 22px 19px;
		background-repeat: no-repeat;
		vertical-align: top;
	}
		.agency-tree-icon-plus{
			background: url(/typo3/gfx/ol/plus.gif);
			background-size: 22px 19px;
			background-repeat: no-repeat;
			cursor: pointer;
		}
		.agency-tree-icon-minus{
			background: url(/typo3/gfx/ol/minus.gif);
			background-size: 22px 19px;
			background-repeat: no-repeat;
			cursor: pointer;
		}
		.agency-tree-icon-line{
			background: url(/typo3/gfx/ol/line.gif);
			background-size: 22px 19px;
			background-repeat: no-repeat;
		}
		.agency-tree-icon-joinbottom{
			background: url(/typo3/gfx/ol/joinbottom.gif);
			background-size: 22px 19px;
			background-repeat: no-repeat;
		}
		.agency-tree-icon-join{
			background: url(/typo3/gfx/ol/join.gif);
			background-size: 22px 19px;
			background-repeat: no-repeat;
		}
		.agency-tree-icon-house{
			background: url(/uploads/tf/images/Agency-Tree/house.png);
			background-size: 16px 16px;
			background-repeat: no-repeat;
		}
		.agency-tree-icon-personal{
			background: url(/uploads/tf/images/Agency-Tree/personal.jpg);
			background-size: 16px 16px;
			background-repeat: no-repeat;
		}

	.agency-tree-row .title{
		cursor: pointer;
	}
*/







/* -------------------------------- PHONE-LIST -------------------------------- */

.phone-list{
}
	.phone-list .agency,
	.phone-list .subAgency .information{
		margin-bottom: 10px;
		border-bottom:1px solid #eee;
	}
	.phone-list .agency .information
	.phone-list .subAgency .information{
		width: 100%;
		position: relative;
	}
		.phone-list .agency .information .title,
		.phone-list .subAgency .information .title{
			padding:20px;
		}
		.phone-list .agency .information .contactPersons,
		.phone-list .subAgency .information .contactPersons{
			padding: 0 20px 20px 20px;
		}
			.phone-list .agency .information .title a,
			.phone-list .subAgency .information .title a{
				font-size: 22px;
				font-weight: 500;
			}
			.phone-list .subAgency .information .title .fax span{
				line-height: 130%;
				font-size: 14px;
			}
				.phone-list .subAgency .information .title .fax span:before{
					font-size: 14px;
				}
			.phone-list .agency .information .contactPersons .contactPerson,
			.phone-list .subAgency .information .contactPersons .contactPerson{
				display: flex;
				align-items: stretch;
				padding:2px 0;
			}
				.phone-list .agency .information .contactPersons .contactPerson .name,
				.phone-list .subElements .subAgency .information .contactPersons .contactPerson .name
				{
					min-width: 33%;
				}
				.phone-list .agency .information .contactPersons .contactPerson .phone,
				.phone-list .subElements .subAgency .information .contactPersons .contactPerson .phone
				{
					min-width: 33%;
				}
				.phone-list .agency .information .contactPersons .contactPerson .area,
				.phone-list .subElements .subAgency .information .contactPersons .contactPerson .area
				{
					min-width: 33%;
				}










/* -------------------------------- SEARCH-RESULTS -------------------------------- */

.search-group{
	margin-bottom: 10px;
	width: 100%;
}
	.search-group .title{
		font-size: 23px;
		display: block;
		padding: 15px;
		width: 100%;
		background: #eee;
		margin: 20px 0 10px 0;
	}







/* -------------------------------- GOOGLE MAP -------------------------------- */

#map{
	margin-bottom: 10px;
	width: 100%;
	margin-top: 5px;
	height: 300px;
}
.google-div{
	margin-bottom: 10px;
}
.google-div-address{
	margin-top: 10px;
}
.google-maps-form{
	display: none;
}
#map.cityGuide {
	height:600px;
}

.location-maps{
    display: none;
}







/* -------------------------------- COOKIE-CONSENT -------------------------------- */

.waconcookiemanagement{
	z-index: 10000 !important;
}
	.cookieclose{
		margin: -30px !important;
	}
	.cookiemanagement h2{
		padding-top: 0px !important;
	}
	.cookie-accept{
		margin-top: 30px !important;
	}
	.cookie-legal{
		text-align: center !important;
		margin-top: 30px;
	}
		.cookie-legal a{
			color: #8ec100 !important;
		}
		.cookie-legal a:hover, .cookie-legal a:focus {
			color: #5A8E1E !important;
		}
	.cookie-info td{
		padding-left: 5px !important;
	}
	.cookie-set {
		position: fixed;
		bottom: 0px;
		background: #fff;
		padding: 5px 10px;
		border-radius: 10px 10px 0px 0px;
		box-shadow: 0px 0px 10px rgba(0,0,0,0.4);
	}
	.cookie-set.script{
		background: #ddd !important;
		padding: 20px;
		border-radius: 0;
		box-shadow: none;
	}
		.cookie-set.script p{
			position: relative !important;
		}
	.simplevideo-disclaimer.cookie-set.script{
		position: absolute !important;
		min-height: auto !important;
		background: rgba(255,255,255,0.5) !important;
		padding: 10px !important;
		bottom: inherit !important;
	}
	
























/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------- DESKTOP ----------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 1480px) {
	.inner {
		width:1440px;
	}
}
@media only screen and (max-width: 1479px) {
	.inner {
		width:1280px;
	}

	/* --- IMAGES, MEDIA --- */

	/* display floating images in a 2-col-content-layout in 100% width (otherwise the text wouldn't float nice next to the image) */

	#content .cols2-75second .row .grid_50 div.csc-textpic-intext-right .csc-textpic-imagewrap,
	#content .cols2-75second .row .grid_50 div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap{
		width: 100%;
		max-width: 100%;
	}

}







/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------- TABLET LANDSCAPE ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1280px) {
	.inner {
		width:95%;
	}


	/* --- TOP-NAVI --- */

	header .inner ul.topnavi{
		float:none;
		text-align:center;
		position:absolute;
		right:0px;
		top:0px;
	}
		header .inner ul.topnavi li a{
			padding:10px 10px;
			font-size:11px;

		}


	/* --- SEARCH, LANGSWITCHER --- */

	header .inner div.search_lang_top {
		display:block;
		position:absolute;
		top:50px;
		right:0px;
		float:none;
	}


	/* --- MAIN-NAVI --- */

	header #navi ul.mainnavi{
		float:none;
		text-align:center;
	}
		header #navi ul.mainnavi li a{
			padding:12px 8px;
			font-size:12px;
		}
		header #navi ul.mainnavi li:hover ul {
			padding:0px;
			display: none;
		}
		header #navi ul.mainnavi ul {
			text-align:left;
		}
			header #navi ul.mainnavi ul li a{
				padding:8px 10px;
				font-size:12px;
			}


	/* --- FORMS --- */

	#content form label {
		display:none
	}
	#content form label.labelvisible {
		display:inline-block !important;
	}
	#content form input,
	#content form select,
	#content form textarea {
		width:100%;
	}
}







/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- TABLET PORTRAIT ------------------------------------------------------------------------ */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 1100px) {

	/* --- MISC --- */

	.float_right,
	.float_left {
		float: none;
	}


	/* --- HEADER --- */

	header {
		background-position:right center!important;
		border:none;
	}
		header .inner {
			width:100%;
			z-index:1;
		}

			/* --- TOP-NAVI --- */

			header .inner ul.topnavi {
				float:none;
				display:block;
				margin:auto;
				text-align:center;
				position:absolute;
				top:0;
				width:100%;
				border-bottom:none;
			}
				header .inner ul.topnavi li a{
					margin:0;
					padding:5px;
				}


			/* --- SEARCH, LANGSWITCHER --- */

			header .inner div.search_lang_top {
				margin:0px;
				display:none;
				text-align:center;
			}

			header .inner .navi-toggle,
			header .inner .search-lang-toggle {
				display:inline-block;
				width:50%;
				font-family:'FontAwesome';
				font-size:25px;
				padding:20px 10px;
				text-align:center;
				color:rgb(0, 108, 162);
				cursor:pointer;
				background:rgba(255, 255, 255, 0.9);
				border-right:1px #d1d1d1 solid;
				box-sizing:border-box;
			}
			header .inner .lang-toggle {
				width:16%;
				box-sizing:border-box;
				display:none;
				font-family:'FontAwesome';
				font-size:25px;
				padding:20px 10px;
				text-align:center;
				color:rgb(0, 108, 162);
				cursor:pointer;
				background:rgba(255, 255, 255, 0.9);
			}
			header .inner .lang-toggle img {
				height:20px!important;
			}
			header .search_lang_top p {
				display:none!important;
			}
			header .inner .search_lang_top p, header .inner .search_lang_top form {
				display:block;
			}
			header .inner .search_lang_top #mailformsword {
				width:80%!important;
			}


			/* --- LOGO --- */

			header .inner a img.logo_gr {
				width:50%;
				height:auto;
				padding:35px 20px 20px;
				margin:0px auto;
				display:block;
				background:rgba(255,255,255,0.5);
			}


		/* --- MAIN-NAVI --- */

		header #navi {
			border:none;
			position:absolute;
			width:100%;
			z-index:2;
		}

		/* home-icon */

		header #navi .icon_navi {
			display:none!important;
		}

		/* navi lvl 1 */

		header #navi ul.mainnavi {
			float:none;
			display:none;
			margin-top:-40px;
			background:#353533;
			padding:0 20px;

		}
			header #navi ul.mainnavi li {
				display:block;
				position:relative;
				border:none!important;
			}
				header #navi ul.mainnavi li a{
					color:rgb(0, 108, 162);
					padding:20px 0px !important;
					margin:0;
					font-size:16px;
					font-weight:bold;
					border-bottom:1px solid rgba(255,255,255,0.1);
				}
				header #navi ul.mainnavi li a:last-child {
					border:none!important;
				}
				header #navi ul.mainnavi li a:hover {
					color:#fff;
					background:#353533;
				}

				/* navi lvl 2 */

				header #navi ul.mainnavi ul {
					display:none;
				}
				header #navi ul.mainnavi li:hover ul{
					position:relative;
					top:0%;
					padding:0px;
					display:block;
					border-top:none;
					box-shadow:none;
					border-bottom:20px solid #353533;
				}
					header #navi ul.mainnavi li ul li a {
						color:rgba(255,255,255,0.7);
						padding:10px 0px!important;
						font-size:16px;
						font-weight:normal;
						border-bottom:none!important;
						background:#353533;
					}
					header #navi ul.mainnavi li ul li a:before {
						content:'»';
						display:block;
						float:left;
						margin-right:10px;
					}
					header #navi ul.mainnavi li ul li a:hover {
						background:#353533;
						color:#fff;
					}
					header #navi ul.mainnavi li ul li ul {
						display:none!important;
					}


	/* --- BREADCRUMB --- */

	#content .inner .breadcrumb {
		display:none;
	}


	/* --- CONTENT --- */

	#content{
		padding: 0px;
	}


	/* --- GRID - LAYOUT --- */

	#content > .inner > .cols2-75first,
	#content > .inner > .cols2-25first,								/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first, 	/* location-detail-page */
	#content > .inner > .cols2-75second,							/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-75second,	/* location-detail-page */
	#content > .inner > .cols2-25second {
		width:100%;
		padding: 10px 2% 0px 2%;
		margin:0;
		display:inline-block;
	}
	.cols2-75second > .csc-frame-default{
	padding-top: 0!important; 
	margin-top: 0!important;
	}

	/* location-detail-page (change div-order so map is UNDER the text but the back-button is OVER the text) */

	#content > .inner > .csc-frame-default > .tx_hot{
		display: -webkit-flex; /* Safari */
		display: flex;
		flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		position: relative;
	}
		#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first{
			-webkit-order: 2;
			order: 2;
			width: 100%;
		}
			#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first > .csc-frame-default > .button{
				position: absolute;
				top: 10px;
				width: calc(100% - 30px) !important;
			}
		#content > .inner > .csc-frame-default > .tx_hot > .cols2-75second{
			-webkit-order: 1;
			order: 1;
			width: 100%;
			padding-top: 70px !important;
		}


	/* --- SUB-NAVI --- */
	#content > .inner > .cols2-25first .nav-level-3-toggle {
		display:block;
	}
	/* navi lvl 1 */
	#content > .inner > .cols2-25first ul.subsubnavi {
		display:none;
	}
	#content > .inner > .cols2-25first ul.subsubnavi li {
		display: none;
	}
	#content > .inner > .cols2-25first ul.subsubnavi li.active {
		display: block;
	}

		/* navi lvl 2 */

		#content > .inner > .cols2-25first ul.subsubnavi li.active ul,
		#content > .inner > .cols2-25first ul.subsubnavi li.active ul li {
			display: block;
		}

	/* hide content after subnavi for mobile */

	#content > .inner > .cols2-25first .csc-frame-default{
	}
	#content > .inner > .cols2-25first .csc-frame-default:first-child{
		display:block;
	}


	/* --- FOOTER --- */

	footer .footerbox:nth-child(odd) {
		width:15%;
		display:inline-block;
		margin:0 3% 20px 0;
	}
	footer .footerbox:nth-child(even) {
		width:82%;
		display:inline-block;
		margin:0 0 20px 0;
	}


	/* --- GRID - CONTENT --- */

	.row {
		width:100%;
		display:inline-block;
	}
		.row .row-group{
			width: 100%;
		}

	.grid_10, .grid_20, .grid_25, .grid_33, .grid_40, .grid_50, .grid_55, .grid_60, .grid_66, .grid_60, .grid_75, .grid_80 {
		display:block;
		width:100%;
		margin:0px;
		padding:0;
	}


	/* --- TABLES --- */

	table tr td,
	table th {
		display:block;
		padding:3px 8px;
	}
	
	/* special table-style for tables that shouldn't be wrapped like the other tables but need to be displayed 100% width (e.g. in de/wissenswertes/daten-fakten/) */
	#c1009,						/* de/wissenswertes/daten-fakten/ */
	#c1118,						/* de/wissenswertes/kehrbezirke/ */
	#c1226						/* de/wissenswertes/partnerstaedte/ */
	{
		overflow-x:auto;
		width:100%;
	}
	#c1009  tr td, #c1009  th,		/* de/wissenswertes/daten-fakten/ */
	#c1118  tr td, #c1118  th,		/* de/wissenswertes/kehrbezirke/ */
	#c1226  tr td, #c1226  th		/* de/wissenswertes/partnerstaedte/ */
	{
		display:table-cell;
	}


	/* ---  EXPANDABLE-LIST  --- */

	.expandable-list .expandable-list-body h3{
		margin-top: 10px;
		margin-bottom: 15px;
	}


	/* ---  DATA-LIST  --- */

	.data-list{
		position: relative;
	}
		.data-list .data-item{
			border-bottom: 1px solid #ddd;
			padding-bottom: 15px;
			margin-bottom: 25px;
			/* padding: 0 30px 10px 5px; */
			padding: 0 30px 10px 0px;
		}
			.data-list .data-item .data-headline{
				font-size: 24px;
				padding: 0 0 0 0;
				line-height: 130%;
			}
			.data-list .data-item .data-content{
				display: flex;
				flex-direction: column;
				align-items: stretch;
			}
				.data-list .data-item .data-content .item{
					order: 2;
					max-width: inherit;
					min-width: inherit;
					margin-right: 0;
					padding-right: 0;
				}
				.data-list .data-item .data-content .preview{
					align-items: flex-start;
					order: 1;
				}
					.data-detail .data-item .data-content .preview img{
						max-width: 100%;
					}
					.data-list-preview{		/* preview-image e.g. /de/leben-und-wohnen/kultur-freizeit/rathauskonzerte/ */
						display: none;
					}
	.data-row{
		margin-bottom: 5px;
	}


	/* ---  AGENCY-TABLE  --- */

	/*
	.agency-tree .tree{
		margin-bottom: 10px;
	}
	*/
	/*
	.icon-mobile:before{
		content: "\f10b";
		font-size: 20px;
	}
	*/
	.agency-list .agency .subElements .subAgency .subElements .subAgency{
		width: 100% !important;
	}
		.agency-list .agency .title .information,
		.agency-list .agency .subElements .subAgency .title .information{
			min-width: 85%;
		}
		.agency-list .agency .title .email-button,
		.agency-list .agency .subElements .subAgency .title .email-button{
			min-width: 15%;
		}
			.agency-list .agency .title .email-button a,
			.agency-list .agency .subElements .subAgency .title .email-button a{
				display: inline-block;
				/* font-size: 40px; */
			}
			/*
			.agency-list .agency .title .email-button a span:before,
			.agency-list .agency .subElements .subAgency .title .email-button a span:before{
				font-size: 40px;
			}
			*/


	/* ---  PHONE-LIST  --- */

	.phone-list .agency .information{
		flex-direction: column;
		line-height: 130%;
	}
	.phone-list .agency .information .title,
	.phone-list .subAgency .information .title,
	.phone-list .agency .information .contactPersons,
	.phone-list .subAgency .information .contactPersons	{
		min-width: 100%;
		padding: 10px 0;
	}
		.phone-list .agency .information .contactPersons .contactPerson,
		.phone-list .subAgency .information .contactPersons .contactPerson{
			flex-direction: column;
			padding: 5px 0;
		}
	.phone-list .subElements .subAgency{
		margin-bottom: 10px;
	}
	.phone-list .subElements .subAgency .information{
		flex-direction: column;
	}
	.phone-list .subElements .subAgency .information .contactPersons{
		padding: 0;
	}
		.phone-list .subElements .subAgency .information .contactPersons .contactPerson{
			flex-direction: column;
		}

	.mobileHidden{
		display: none !important;
	}

	/*
	.imageSlider{
		width: 100% !important;
	}

	.pgwSlider{
		max-width: 100% !important;
		width: 100% !important;
		margin-bottom: 10px;
	}
	*/
	
	.data-images .csc-textpic-imagerow {
		display:inherit!important;
	}
	.data-images .csc-textpic div.csc-textpic-imagecolumn {
		width: 48%;
		margin-bottom:10px;
	}
}







/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ----------------------------------------------------------------------------------- SMARTPHONE -------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 480px){
	body {
		position:relative;
		height:auto;
	}
	.inner {
		width:100%;
	}

	/* --- HEADLINES --- */

	h1 {
		font-size:23px!important;
	}
	h2, #content h2 {
		font-size:20px!important;
	}
	h3, #content h2 {
		font-size:17px!important;
	}


	/* --- HEADER --- */

	header{
		background-position: right center!important;
		background-size: 320% auto!important;
		display: inline-block;
		height: 140px;
		width: 100%;
	}
		header .inner .navi-toggle,
		header .inner .lang-toggle,
		header .inner .search-lang-toggle {
			padding:10px;
		}
		header .inner div.search_lang_top {
			top:0;
			width:100%;
			padding:25px 0;
			background-color:rgba(255,255,255,1);
			height:85px;
		}
		header .inner .search_lang_top p, header .inner .search_lang_top form {
			padding:2px 0;
		}
		header .inner .search_lang_top p {
			background:none;
			border-bottom:none;
		}
		header .topnavi {
			bottom:0!important;
			top:auto!important;
			background:rgb(0, 108, 162)!important;
		}
			header .topnavi li a {
				color:rgba(255,255,255,0.7)!important;
			}
				header .topnavi li a:hover {
					color:#fff!important;
		}


	/* --- LOGO --- */

	header .inner a img.logo_gr {
		display:none;
	}
	header .inner a img.logo_kl {
		display:block;
		width: auto;
		margin:5px auto;
		padding:5px;
		height:75px;
		background:rgba(255,255,255,0.5);
	}


	/* --- GRID - LAYOUT --- */


	#content > .inner > .cols2-75first,
	#content > .inner > .cols2-25first,								/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-25first, 	/* location-detail-page */
	#content > .inner > .cols2-75second,							/* normal page */
	#content > .inner > .csc-frame-default > .tx_hot > .cols2-75second,	/* location-detail-page */
	#content > .inner > .cols2-25second{
		padding: 10px 15px 0px 15px;
	}

	#c4 .grid_50, #c4 .grid_25 {
		padding:10px!important;
	}



	/* --- FOOTER --- */

	footer .inner {
		padding: 15px;
	}


	/* --- IMAGES, MEDIA --- */

	img, embed, object, video {
		max-height: none;
	}
	div.csc-textpic-intext-left .csc-textpic-imagewrap,
	div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
		max-width: 100%;
	}
	div.csc-textpic-intext-right .csc-textpic-imagewrap,
	div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap {
		max-width: 100%;
	}
	div.csc-textpic-intext-right .csc-textpic-imagewrap,
	div.csc-textpic-intext-right-nowrap .csc-textpic-imagewrap,
	div.csc-textpic-intext-left .csc-textpic-imagewrap,
	div.csc-textpic-intext-left-nowrap .csc-textpic-imagewrap {
		margin:0 0 20px 0!important;
		width:100%;
	}
	div.csc-textpic div.csc-textpic-imagecolumn {
		width:100%;
		float:none;
		margin:0 0 10px 0!important;
	}
	div.csc-textpic .csc-textpic-imagewrap img {
		width:100%;
	}
	.csc-textpic-intext-left-nowrap .csc-textpic-text {
		margin-left:0;
	}
	.csc-textpic-imagerow {
		display:block!important;
		margin:0;
	}
	/*
	.csc-textpic-below .csc-textpic-imagewrap,
	.csc-textpic-above .csc-textpic-imagewrap {
		margin:0;
	}
	*/
	.row .row-group select,
	.row .row-group input,
	.row .row-group select#eventCategoryFilter
	{
		width: 100% !important;
		float:0!important;
		margin-right:0!important;
	}
	.data-images .csc-textpic div.csc-textpic-imagecolumn{
		width:100%;
	}
	#c148 {
		display:none;
	}
}




#liste_abhol_und_lieferservices .sorting_asc{
	padding-left: 30px;
	background-image: url('../images/sort-up.png');
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: 8px 6px;
}
#liste_abhol_und_lieferservices .sorting_desc{
	padding-left: 30px;
	background-image: url('../images/sort-down.png');
	background-size: 18px;
	background-repeat: no-repeat;
	background-position: 8px 6px;
}
#liste_abhol_und_lieferservices .sorting_asc,
#liste_abhol_und_lieferservices .sorting_desc,
#liste_abhol_und_lieferservices .sorting{
	cursor: pointer;
}


#c2603 img{
	width: 100% !important;
}