/* ==========================================================================
   Header / Lgo
   ========================================================================== */

#header {
	color: #000;	
	background: #fff;
	position:relative;
	display: block;
	float: left;
	padding: 0;
	margin: 10px 0 10px 0;
	
	width: 100%;
}

#header a#lgo {
	width: 144px;
	height: 110px;
	display: block;
	float: left;
	margin: 0;
	border: 0;
	
	transition: all 0.145s ease-out 0s;
}

#header a#ic-menu-switch {
 	display: none;
	float: right;
	width: 60px;
	height: 20px;
	overflow: hidden;
	border: 0;
	margin-top: 22px;
	margin-right: 20px;
	
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 18px;
	text-transform: uppercase;
	
    transition: all 0.145s ease-out 0s;
}

#header a#ic-menu-switch span {
	float: left;
	padding: 0;
	margin: 0;
}

#header a#ic-menu-switch .ic-menu {
	float: left;
	width: 20px;
	height: 20px;
	border: 0;
	margin-right: 5px;
	overflow: hidden;
}

#header .ic-menu-bar {
    background: #000;
    height: 3px;
    margin-bottom: 3px;
}

#header a#ic-menu-switch:hover {
	color: #e4391d;
}

#header a#ic-menu-switch:hover .ic-menu-bar {
	background: #e4391d;
}

#header a#lgo img {
	width: 100%;
	height: auto;
}

#closeNavCont,
body.mainMenuOpen #closeNavCont,
#closeNavCont.open {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: fixed;
	z-index: 990;
	
	display: none;
	
	background: rgba(0,0,0, 0.2);
}



/* ==========================================================================
   Header -> Querie 1 -> Logo + IC Menu
   ========================================================================== */
   
@media only screen and (max-width: 940px) {

#header {		
	height: 80px;
	padding: 0;
	/*
	border-top: 10px solid #fff;
	margin: 0;
	*/
	margin: 10px 0 0 0;
	border-bottom: 10px solid #fff;
	z-index: 999;
	}
	
#header a#lgo {
	width: 79px;
	height: 60px;
	}

#header a#ic-menu-switch {
	display: block;
	}

body.mainMenuOpen #closeNavCont,
#closeNavCont.open {
	display: block;
	}
	
body.mainMenuOpen #content {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px); 
	-o-filter: blur(5px); 
	-ms-filter: blur(5px); 
	filter: blur(5px);
	
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
    }

} /* Querie END */


/* ==========================================================================
   Header / Nav #1
   ========================================================================== */

#nav-main {
}
   
#nav-1 {		
	display: block;
	height: 40px;
	float: right;
	margin-top: 10px;
}

#nav-1 ul {
	margin: 0;
	padding:0;
	height: 40px;
	display: inline-block;
}

#nav-1 li {	
	list-style-type: none;
	float: left;
	margin-left: 0;
}

#nav-1 li:first-child {	
	margin-left: 0;
}

#nav-1 li a {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	color: #4a4a4a;	
	
	text-align:center;
	display: block;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	
	padding: 10px 20px 8px 20px;
}

#nav-1 li a:hover {
	color: #e4391d;
}

#nav-1 li.current a {
	border-bottom: 2px solid #e4391d;
}


/* ==========================================================================
   Header / Nav #2
   ========================================================================== */

#nav-2 {		
	display: block;
	height: 40px;
	float: right;
	margin: 30px 0 0 0;
}

#nav-2 ul {
	margin: 0;
	padding:0;
	height: 40px;
	display: inline-block;
	background-color: #f2f2f2;
}

#nav-2 li {	
	list-style-type: none;
	float: left;
	margin-left: 0;
}

#nav-2 li:first-child {	
	margin-left: 0;
}

#nav-2 li a {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	text-transform: uppercase;
	color: #4a4a4a;	
	
	text-align:center;
	display: block;
	text-decoration: none;
	border-bottom: 0;
	
	padding: 10px 20px 10px 20px;
}

#nav-2 li a:hover {
	background-color: #e0e0e0;
}

#nav-2 li.current a {
	border-bottom: 0;
	color: #fff;
	background-color: #e4391d;
}

/* ==========================================================================
   Nav -> Querie 1 -> Main Menu
   ========================================================================== */
   
@media only screen and (max-width: 940px) {

#nav-main {
	display: none;
	position: absolute;
	z-index: 999;
	width: 50%;
	min-width: 300px;
	max-height: calc(100vh - 100px);
	overflow-y: auto;
	right: 0;
	top: 80px;
	background-color: #f2f2f2;
	}

#nav-main.open {
	display: block;
	}

#nav-1 {
	width: 50%;		
	display: block;
	height: auto;
	float: left;
	margin-top: 0;
	}

#nav-1 ul {
	margin: 10px;
	padding:0;
	height: auto;
	display: block;
	}

#nav-1 li {	
	list-style-type: none;
	float: none;
	margin-left: 0;
	}

#nav-1 li a {
	text-align: left;
	display: block;
	text-decoration: none;
	border-bottom: 0;
	
	padding: 10px 10px 8px 10px;
	}

#nav-1 li a:hover {
	color: #4a4a4a;
	background-color: #e0e0e0;
	}

#nav-1 li.current a {
	border-bottom: 0;
	color: #fff;
	background-color: #e4391d;
	}


#nav-2 {		
	display: block;
	width: 50%;
	height: auto;
	float: right;
	margin: 0 0 0 0;
	border-left: 1px solid #fff;
	}

#nav-2 ul {
	margin: 10px;
	padding:0;
	height: auto;
	display: block;
	}

#nav-2 li {	
	float: none;
	}

#nav-2 li a {
	text-align: left;	
	padding: 10px 10px 8px 10px;
	}
	
#nav-2 li a:hover {
	background-color: #e0e0e0;
	}

#nav-2 li.current a {
	border-bottom: 0;
	color: #fff;
	background-color: #e4391d;
	}

/* Menu IDs */
li#nav-home,
li#nav-ueber,
li#nav-vermietung,
li#nav-service,
li#nav-kontakt {
	}

li#nav-veranstaltungen,
li#nav-projekte,
li#nav-bildung,
li#nav-beratung,
li#nav-vereine,
li#nav-kunsthalle,
li#nav-fotogalerie {
	
	}


} /* Querie END */

/* ==========================================================================
   Menu -> 2. Ebene
   ========================================================================== */

#nav-sub {		
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: 0.2px;
	}

#nav-sub ul {
	display: block;
	margin: 0 0 10px 0;
	padding: 0;
	
	width: 100%;
	min-height: 60px;
	
	background: #484848;
}

#nav-sub ul li {	
	list-style-type: none;
	float: left;
	
	display: block;

		
	margin: 0 0 0 0;
	border-right: 1px dotted #fff;
}

#nav-sub ul li:first-child {

}

#nav-sub ul li a {
	
	text-align:center;
	
	display: inline-block;
	
	padding: 20px 20px 20px 20px;
	
	color: #fff;	
	text-decoration: none;
	border-bottom: 0;

	background: transparent;
	color: #fff;
	
	-ms-transition: all 0.75s;
	-o-transition: all 0.75s;
	-moz-transition: all 0.75s;
	transition: all 0.75s;
}

#nav-sub ul li a:hover,
#nav-sub ul li.current a {
	background: #e94d23;
	color: #fff;
}

/* ==========================================================================
   Menu / Sub -> 1. Ebene
   ========================================================================== */

#nav-sub-1 {
	float: left;
	display: block;
	width: 100%;
	max-height: 500px;
	margin-bottom: 10px;
	overflow-y: hidden;
	
	-webkit-transition: all 0.5s ease-in-out; 
	-moz-transition: all 0.5s ease-in-out; 
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}
   
#nav-sub-1 #nav-sub-ul-1 {
	color: #000;	
	/* background: #f8f8f8 url('../img/bg_sub_arrw.gif') center top no-repeat; padding: 10px 0 10px 0 */
	background: #f8f8f8;

	float: left;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0 0 10px 0;
}

#nav-sub-1 #nav-sub-ul-1 li {
	list-style-type: none;
	float: left;
	margin: 0;
	width: 20%;
}


#nav-sub-1 #nav-sub-ul-1 li a {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 13px;
	font-weight: 300;
	line-height: 32px;
	text-transform: uppercase;
	color: #4a4a4a;	
	
	text-align: left;
	display: block;
	text-decoration: none;
	border-bottom: 0;
	
	width: 100%;
	height: 40px;
	
	padding: 0 8px 0 8px;
	border: 10px solid #f8f8f8;
	border-bottom: 0;
	overflow: hidden;
	
	background: #f8f8f8;
}

#nav-sub-1 #nav-sub-ul-1 li a:hover {
	background: #e0e0e0;
}

#nav-sub-1 #nav-sub-ul-1 li.current a {
	color: #fff;
	background: #e4391d;
}



#nav-sub-1-toggle {
	float: left;
	width: 100%;
	height: 5px;
	display: none;
	background: #4a4a4a;
	border: 0;
	
	margin-top: -10px;
	margin-bottom: 50px;
}

#nav-sub-1-toggle:hover,
#nav-sub-1-toggle:hover .bt-sub-toggle {
	background: #e4391d;
}

#nav-sub-1-toggle .bt-sub-toggle {
	margin: 0 auto;
	display: none;
	width: 30px;
	height: 30px;
	border: 0;
	color: #fff;
	font-size: 25px;
	font-weight: normal;
	line-height: 30px;
	padding: 0;
	text-align:center;
	background: #4a4a4a;
}

#nav-sub-1-toggle .bt-sub-toggle:before { content: '+'; }
#nav-sub-1-toggle.open .bt-sub-toggle:before { content: '-'; }


/* ==========================================================================
   Menu / Sub -> 1. Ebene -> Querie 1
   ========================================================================== */
  
@media only screen and (max-width: 940px) {
 
#nav-sub-1 {
	max-height: 0;
	
	-webkit-transition: all 0.5s ease-in-out; 
	-moz-transition: all 0.5s ease-in-out; 
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

#nav-sub-1.open {
	max-height: 500px;
	
	-webkit-transition: all 0.5s ease-in-out; 
	-moz-transition: all 0.5s ease-in-out; 
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

#nav-sub-1 #nav-sub-ul-1 {
	color: #000;	
	background: #f8f8f8;

	float: left;
	display: block;
	width: 100%;
	margin: 0;
	padding: 0 0 10px 0;
	}

#nav-sub-1 #nav-sub-ul-1 li {
	list-style-type: none;
	float: left;
	margin: 0;
	width: 25%;
}


#nav-sub-1 #nav-sub-ul-1 li a {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 12px;
	font-weight: 300;
	line-height: 32px;
	text-transform: uppercase;
	color: #4a4a4a;	
	
	text-align: left;
	display: block;
	text-decoration: none;
	border-bottom: 0;
	
	width: 100%;
	height: 40px;
	
	padding: 0 8px 0 8px;
	border: 10px solid #f8f8f8;
	border-bottom: 0;
	overflow: hidden;
	
	background: #f8f8f8;
}

#nav-sub-1 #nav-sub-ul-1 li a:hover {
	background: #e0e0e0;
}

#nav-sub-1 #nav-sub-ul-1 li.current a {
	color: #fff;
	background: #e4391d;
}

#nav-sub-1-toggle a.open {
	display: block;
}

#nav-sub-1-toggle.open a.open {
	display: none;
}



#nav-sub-1-toggle a.close {
	display: none;
}

#nav-sub-1-toggle.open a.close {
	display: block;
}

#nav-sub-1.open {
	max-height: 500px;
	padding: 0;
	
	-webkit-transition: all 0.5s ease-in-out; 
	-moz-transition: all 0.5s ease-in-out; 
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}


#nav-sub-1-toggle,
#nav-sub-1-toggle .bt-sub-toggle {
	display: block;
}


} /* Querie END */


/* ==========================================================================
   Menu / Sub -> 1. Ebene -> Querie 2
   ========================================================================== */
  
@media only screen and (max-width: 740px) {

#nav-sub-1 #nav-sub-ul-1 li {
	float: left;
	width: 33.33333333%;
	}

} /* Querie END */

/* ==========================================================================
   Menu / Sub -> 1. Ebene -> Querie 3
   ========================================================================== */
  
@media only screen and (max-width: 480px) {

#nav-sub-1 #nav-sub-ul-1 li {
	float: left;
	width: 50%;
	}

} /* Querie END */



/* ==========================================================================
   Menu / Sub -> 2. Ebene
   ========================================================================== */

#nav-sub-2 {
	float: left;
	display: block;
	width: 100%;
	max-height: 500px;
	overflow-y: hidden;
	
	border-right: 10px solid transparent;
	border-left: 10px solid transparent;
	border-bottom: 10px solid transparent;
	
	background: #f8f8f8;
}
   
#nav-sub-2 #nav-sub-ul-2 {
	color: #000;	
	/* background: #f8f8f8 url('../img/bg_sub_arrw.gif') center top no-repeat; padding: 10px 0 10px 0 */
	background: #f2f2f2;

	float: left;
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0 0 10px 0;
	
}

#nav-sub-2 #nav-sub-ul-2 li {
	list-style-type: none;
	float: left;
	margin: 0;
	width: 20%;
}


#nav-sub-2 #nav-sub-ul-2 li a {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 12px;
	font-weight: 300;
	line-height: 32px;
	text-transform: uppercase;
	color: #4a4a4a;	
	
	text-align: left;
	display: block;
	text-decoration: none;
	border-bottom: 0;
	
	width: 100%;
	height: 40px;
	
	padding: 0 8px 0 8px;
	border: 10px solid #f2f2f2;
	border-bottom: 0;
	overflow: hidden;
	
	background: #f2f2f2;
}

#nav-sub-2 #nav-sub-ul-2 li a:hover {
	color: #e4391d;
	background: #f2f2f2;
}

#nav-sub-2 #nav-sub-ul-2 li.current a {
	color: #e4391d;
	background: #f2f2f2;
}

/* ==========================================================================
   Header / Nav ic 1
   ========================================================================== */

#nav-ic-1 {
	display: block;
	height: 40px;
	float: right;
	margin-top: 10px;
}

#nav-ic-1 a {
	color: #4a4a4a;
	border: 0;
}

#nav-ic-1 a:hover {
	color: #e94d23;
}

#nav-ic-1 a:before {
	font-family: "f15ticns";
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	text-align: center;
    font-size: 24px;
	speak: none;
 
	display: inline-block;
	text-decoration: none;
	width: 40px;
	line-height: 40px;
}



/* ==========================================================================
   Header / Anfahrt
   ========================================================================== */
   
#anfahrt-Cont {
	width: 100%;
	height: 0;
	overflow: hidden;
	display: block;
	
	-ms-transition: all 0.25s;
	-o-transition: all 0.25s;
	-moz-transition: all 0.25s;
	transition: all 0.25s;
	
	background: #f2f2f2;
}

#anfahrt-Cont.active {
	height: 400px;
	margin-top: 10px;
		
	-ms-transition: all 0.25s;
	-o-transition: all 0.25s;
	-moz-transition: all 0.25s;
	transition: all 0.25s;
	
	background: #f2f2f2 url(../img/ani-loader-1.gif) center center no-repeat;
}
   
   
.ic-anfahrt:before {
	content: '\e828'; 
}

a.ic-anfahrt-toggle {
	border: 0;
}

/* ==========================================================================
   Header / Suche
   ========================================================================== */
   
#suche-Cont {
	width: 100%;
	height: 0;
	overflow: hidden;
	display: block;
	
	-ms-transition: all 0.25s;
	-o-transition: all 0.25s;
	-moz-transition: all 0.25s;
	transition: all 0.25s;
	
	background: #f2f2f2;
}

#suche-Cont.active {
	height: auto;
	margin-top: 10px;
	
	-ms-transition: all 0.25s;
	-o-transition: all 0.25s;
	-moz-transition: all 0.25s;
	transition: all 0.25s;
	
	background: #f8f8f8;
}

#suche-Cont fieldset { 
	border: 1px solid #656565;
	padding: 5px;
}

#suche-Cont legend {
	display: block;
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 12px;
	text-transform: uppercase;
	color: #656565;
	padding: 10px 0 10px 12px;
}


#suche-Cont input {  
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	line-height: 14px;
	color: #656565;	
}

#suche-Cont.active input#search {
	width: 100%;
	padding: 10px;
	height: 38px;
	background: #fff;
	border: 0;
	border: 1px solid #e0e0e0;
	margin: 0;
}

#suche-Cont.active input#search:focus {  
	background: #f2f2f2;
	color: #000;
	border: 1px solid #656565;
}

.ic-suche:before {
	content: '\e834'; 
}

.sucheCol {
	border-right: 0;
	border-bottom: 10px solid #fff;
}

@media only screen and (min-width: 940px) {

.sucheCol {
	border-right: 10px solid #fff;
	border-bottom: 0;
	}

} /* end Querie */

.filterCol {

}

.filterCol select {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	line-height: 14px;
	color: #656565;	
	
	height: 38px;
	
   	padding: 6px;
	background: #fff;
	border: 1px solid #e0e0e0;
    margin: 0;
    
    width: 100%;

    outline:none;
    display: inline-block;
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    cursor:pointer;
}

select:-moz-focusring {
    color: transparent;
    text-shadow: 0 0 0 #000;
}

/* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
@media screen and (-webkit-min-device-pixel-ratio:0) {
    .filterCol select  {padding-right:18px}
}

label {position:relative}
label:after {
	font-family: "f15ticns";
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
    font-size: 18px;
    
    content: '\e80d'; 

    color: #000;

    right: 17px; 
    top: 0px;
    padding: 0;
    
    position: absolute;
    pointer-events:none;
}
label:before {
    content:'';
    right: 5px; 
    top: -7px;
    width: 36px; 
    height: 36px;
    background: transparent;
    position:absolute;
    pointer-events:none;
    display:block;
}

.filterCol select option {
	padding: 5px;
}

.filterCol .color-0 {
	color: #656565;
}

.filterCol .color-1 {
	color: #a93216;
}

.filterCol .color-2 {
	color: #3b4954;
}

.filterCol .color-3 {
	color: #9e3679;
}

.filterCol .color-4 {
	color: #ae9e17;
}

.filterCol .color-5 {
	color: #5f899a;
}

.filterCol .color-6 {
	color: #7b8082;
}

.filterCol .color-7 {
	color: #c5770d;
}

.filterCol .color-8 {
	color: #0c970f;
}

#suche-Cont input.btSearch,
#suche-Cont input.btFilter {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 14px;
	font-weight: 300;
	line-height: 14px;
	color: #4a4a4a;	
	
	height: 38px;
	width: 100%;
	
   	padding: 8px;
	background: #e0e0e0;
	border: 1px solid #e0e0e0;
}

#suche-Cont input.btSearch:active,
#suche-Cont input.btFilter:active {
	color: #fff;	
	background: #4a4a4a;
	border: 1px solid #4a4a4a;
}


.filtCont {
	margin-bottom: 10px;
} 

/* Letzten Eintrag in Monate ausblenden = Tickets */
.filtMonat option:last-child {
	display: none;
}


