/*********************  CSS Aufteilung  ***************
	control buttons & brandname 
	category selection tabpanes
	category icons
	poi table styling
	topcat panel: other container(s) (and their subcat panels if existing)
	styling rules for sidemenu markerinfo
	styling rules for sidemenu routing
	added after Veronika left (new)
*******************************************************/

.container{
	height: 100%;
}
.off{
	display: none!important;
}
i{
	font-size: 150%;
	vertical-align: text-bottom; /*or sub*/
}
#sideLeft_panes{
	position: relative;
	z-index: 1000;
	display: none;
}
a:focus{
	outline: none;
}
a:hover{
	cursor: pointer;
}

/* control buttons & brandname */

#sideLeft_buttons{
	position: relative;
	float: left;
	width: 60px;
	z-index: 1000;
}
#sideLeft_buttons span{
	display: none;
}
#nav_pills_nav > li > a{
	background: rgb(28,64,58); /* CHANGE HERE */
	margin: 5px;
	color: #fff;
}
.nav > li > a{
	padding: 10px 15px;
}
#nav_pills_nav > li.active > a{
	background: rgb(28,64,58); /* CHANGE HERE */
	outline: none;
}
#brandName img{
	width: 50px;
	margin: 5px;
	margin-bottom: 0;
	padding: 5px 10px;
	background: rgb(28,64,58); /* CHANGE HERE */
	border-radius: 10px;
	cursor: pointer;
}
.up_on_subcatPanel li{
	display: inline-block;
	width: 50%;	
}
.up_on_subcatPanel.fullwidth li{
	width: 100%;	
}
.up_on_poisPanel,
.up_on_subcatPanel li.responsive{
	display: inline-block;
}
.up_on_poisPanel,
.up_on_infoPanel{
	width: 100%;
}
.up_on_subcatPanel li i{
	font-size: 100%;
	vertical-align: unset;
}
/* category selection tabpanes */
#tabs_topcats,
#tabs_subcats{
	color: #fff;
	position: relative;
	float: left;
	background: #4E8FC8;
	height: 100%;
	overflow:hidden;
	width: 240px;
	margin-left: -250px;
	opacity: 0;
	-webkit-transition: margin-left 0.5s ease-in-out, opacity 0.5s ease;
	-moz-transition: margin-left 0.5s ease-in-out, opacity 0.5s ease;
	-o-transition: margin-left 0.5s ease-in-out, opacity 0.5s ease;
	transition: margin-left 0.5s ease-in-out, opacity 0.5s ease;
}
#tabs_topcats{
	z-index: 3100;
}
#tabs_subcats{
	z-index: 3010;
}
.subcat .subAll i{
	visibility: hidden;
} 
.subcat.active .subAll i{
	visibility: visible;
} 
.subcat.invisible{
	display: none;
}

#tabs_pois{
	position: relative;
	z-index: 3000;
	float: left;
	background: #4E8FC8;
	height: 100%;
	overflow:hidden;
	width: 240px;
	margin-left: -240px;
	opacity: 0;
	-webkit-transition: margin-left 0.5s ease, opacity 0.5s ease;
	-moz-transition: margin-left 0.5s ease, opacity 0.5s ease;
	-o-transition: margin-left 0.5s ease, opacity 0.5s ease;
	transition: margin-left 0.5s ease, opacity 0.5s ease;
}
#tabs_topcats.open{
	opacity: 1;
	margin-left: 0px;
	max-width: 250px;
}
#tabs_subcats.open{
	opacity: 1;
	margin-left: -240px;
	z-index: 3200;
}
#tabs_pois.open{
	opacity: 1;
	margin-left: -240px;
	z-index: 3150;
}
#tabs_pois.open.responsive{
	z-index: 3300;		
}
#tabs_topcats a,
#tabs_subcats a,
#tabs_pois a{
	color: #fff;
}
#tabs_topcats a:hover,
#tabs_subcats a:hover,
#tabs_pois a:hover{
	background: #f7cb24; /* CHANGE HERE: main and sub categories on hover*/
	color: black; /* CHANGE HERE */
	font-weight: bold; /* CHANGE HERE */
}

/* the activated menu items: category and subcategory */
#tabs_topcats li.active a,
#tabs_subcats li.active a{
	color: #f7cb24; /* CHANGE HERE main and sub categories activated */
	background: #5b8971; /* CHANGE HERE */
	font-weight: bold;
	outline: none;
}
.list-group{
	margin-bottom: 0px;
}
.list-group-item{
	padding: 0;
	background-color:  rgb(28,64,58);
	border: 1px solid #d0e2d2 !important; /* CHANGE HERE */
}
.list-group-divider{
	width: 100%;
	height: 5px;
	background: #f7cb24; /* CHANGE HERE */
	border-radius: 2px;
}
#categories li{
	margin: 0px;
}

/* to make scrollbars always visible */
.scrollbarVis.ps-container > .ps-scrollbar-x-rail,
.scrollbarVis.ps-container > .ps-scrollbar-y-rail {
  opacity: 0.6;
  z-index: 40000;
}

/* scrollbar */
.ps-container>.ps-scrollbar-y-rail>.ps-scrollbar-y {
	background-color: #f7cb24 !important;
}

/* category icons */
#categories .topcat-list a{
	padding: 0px 10px!important;
}
.iconBack{
	background: #fff; /* CHANGE HERE */
	padding: 4px;
	margin: 2px;
	border-radius: 50%;
}

/* poi table styling */
table{
	font-size: 11px;
}
tr{
	display: table-row;
	color: #fff; 
	cursor: pointer;
}
tr:hover{
	color: #30689a; /* the standard bootstrap-hover-on-a-link color*/
}
tr.hidden{
	display: none;
}






#promotion_pics a{
	display: none;
}
#promo_pics{
	height: 100px!important;
	background: transparent;
	border: 0px;
}

#promotion_pics,
#promotion_pics img{
	position: fixed;
	z-index:10000;
	max-width: 230px!important;
	max-height: 100px!important;
	bottom:5px;
	left:5px;
}





/* the inline forms search and openingHours */
#searchBoxDIV form{
	width: 100%;
	height: 34px;
}
#searchBoxDIV input{
	vertical-align: unset!important;
	width: 180px;
}
#openSearchBtn{
	vertical-align: top; 
}
#openPOISmapped{
	position: relative;
	width: 500px;
	background: #4E8FC8;
	color: #333;
	padding: 10px 15px;
	border-radius: 5px;
	margin: auto;
	margin-top: 10px;
}
#openSearchBtn i,
#startadress i,
#endadress i{
	font-size: 100%;
	vertical-align: unset;
}
#openPOISmapped a{
	float: right;
	color: #fff;
}

#searchBoxDIV .tt-dropdown-menu{
	background: rgb(28,64,58); /* CHANGE HERE */
	/* background: none; /* by Numa */
	border: 1px solid rgba(0, 0, 0, 0.2);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
	text-transform: none;
	
  /* height: 500px; */
  /* overflow-y: auto; */
}
.tt-suggestion {
  font-size: 12px;
  color: #fff;
  line-height: 20px;
  padding: 3px 10px;
}

.tt-suggestion.tt-cursor {
  background: #f7cb24; /* CHANGE HERE */
  color: black; /* CHANGE HERE */
  cursor: pointer;
}
.tt-suggestion p {
  margin: 0;
}
.tt-suggestion + .tt-suggestion {
  border-top: 1px solid #ccc;
}
#searchresults .tt-suggestion.active,
#searchresults .tt-suggestion:hover{
  background: #6EADE5; /* CHANGE HERE */
  cursor: pointer;
  text-transform: none;
}
#searchresults .typeahead-header {
  margin: 5px;
  padding: 3px 0;
  border-bottom: 2px solid #ccc;
}
#searchresults .typeahead-header i{
	font-size: 200%;
	vertical-align: text-bottom;  /* or: middle */
}

/* datetimepicker */
#datetimepicker{
	width: 220px; /*smaller for the button next to it*/
}
.datetimepicker tr:hover{
	color: #fff;
}
.datetimepicker td.day.new,
.datetimepicker td.day.old{
	color: #bbb;
}
.datetimepicker th:hover,
.datetimepicker td .month:hover,
.datetimepicker td.day:hover,
.datetimepicker td .hour:hover,
.datetimepicker td .minute:hover,
.datetimepicker tfoot:hover{
	background: #6EADE5!important; /* a light blue */ /* also changed color-css directly in the plugin-css*/
}

/* styling rules for sidemenu routing */ /* and some parts further up (icons)*/
#routing h3,
#info_on h3{
	padding: 5px 10px;
	font-weight: bold;
}
#routing_cp > div.routing_title{
	font-weight: bold;
	font-size: 13px;
	padding: 5px 10px;
}
#routing_cp .col-xs-4{
	padding: 0px 5px;
}
#routing_cp .row{
	margin: 0px;
}
#routing_cp > div > div > a{
	display:inline-block;  
	width:100%;
	height:100%;
	text-align: center;
	font-size: 12px!important;
	padding: 8px 5px;
	margin-bottom: 10px;
	border-radius: 4px;
	border: 2px solid #6EADE5;
}
#routing_cp > div > div.active > a{
	color: #ffd700; /* CHANGE HERE	 */
	background-color: black; /* CHANGE HERE */
}

#startadress,
#endadress{
	display: none;
}
#startadress.active,
#endadress.active{
	display: inherit;
}

#calculating a,
#link_route_desc a{  								
	width: 60%;
	padding: 10px;
	border-radius: 4px;
	line-height: 40px;
	text-align: center;
	background-color: #5b8971; /* CHANGE HERE */
	color: black; /* CHANGE HERE */
	border: 2px solid #427AAA; /* a darker blue */
}
#calculating a:hover,	 								
#calculating a.active,
#link_route_desc a:hover,	 								
#link_route_desc a.active{
	background-color: black; /* CHANGE HERE */
	color: #5b8971; /* CHANGE HERE */
	border: 2px solid #4E8FC8;
}


/* styling rules for sidemenu info */
#infoPlaceholder{
	padding: 30px 15px;
}
#sideImageDiv {
	text-align: center;	
	margin-top: 5px;
	margin-bottom: 8px;
}
#sideImage {
	border: 1px solid rgba(141, 209, 255, 1);	
}	
#sideLink {
	-ms-word-break: break-all;
     word-break: break-all;
     word-break: break-word;
	-webkit-hyphens: auto;
	   -moz-hyphens: auto;
			hyphens: auto;
}
#info_on tr:hover{
	color: #fff;
	cursor: default;
}
#info_on tr a:hover{
	background: transparent;
}
#carousel-pics .carousel-inner > div > img{
	max-height: 150px;
	margin: auto;
}
#lightboxCarousel .carousel-inner > div > img{
	margin: auto;
	padding: 15px;
}
#lightboxCarousel .carousel-indicators{
	display: none;
}
#carousel-pics .carousel-control.left,
#carousel-pics .carousel-control.right {
    background: none;
}
#carousel-pics .carousel-indicators{
	bottom: 0px;
}
.carousel-indicators li{
	display: none;
}


 
 /* modals */
 #login input[type="submit"]{
	background: rgba(78, 143, 200, 1);
	color: #fff;
	padding: 6px 12px;
	line-height: 1.4;
	border: 1px solid rgba(78, 143, 200, 0.9);
	border-radius: 4px;
 }
 #disclaimer{
	max-height: 400px;
	overflow-y: auto;
 }
 
 
/* added after Veronika left (new) */
#closeMenu{
	visibility:hidden;
	background-color:#4E8FC8 !important;
	width:33px;
	left:5px;
	border-radius: 4px;
	height:25px;
}

#closeMenu:hover{
	background-color:red !important;
	cursor:pointer;
}

.white{
	color:white;
}


/* this makes the title category entry in the list show up differently */
.title_cat {
	background-color: #5b8971; /* CHANGE HERE */
	color: #FFD700;
	font-weight: bold;
	font-size:120%;
}

.title_cat:hover{
	background-color: #68A0CA !important;
	color: #FFD700;
	font-weight: bold;
	cursor: default;
	font-size:120%;
}

.leaflet-control-minimap-toggle-display{
	height: 20px !important;
	width: 20px !important;
}


/* all modal body contents should have the same height */
#help{height: 380px;}
#contact{height: 400px;}
#login{height: 400px;}

 
 .hideTypeaheadSuggestion{
	color:red;
 }
 
 /* featureName holds the dataset's name  */
 #featureName {
	 padding-top: 10px;
	 
 }