/* adjust the header height */
.main-header {
  max-height:30px;
  text-color: #515151;
}
.main-header .logo {
  height:30px;
  line-height:27px;
}
.sidebar-toggle {
  height:30px;
  padding-top:5px !important;
}
.navbar {
  min-height:30px !important;
}

/* header background */
.skin-blue .main-header .logo {
  background-color: #ECF0F5;
}
.skin-blue .main-header .logo:hover {
  background-color: #ECF0F5;
}
/* navbar (rest of the header) */
.skin-blue .main-header .navbar {
  background-color: #ECF0F5;
}
/* header: hamburger menu button */
.main-header .sidebar-toggle:before {
  color: #777777;
}
.skin-blue .main-header .navbar .sidebar-toggle:hover{
  background-color: #ECF0F5;
}

/* link to imprint div in header */
#link_to_imprint_div {
  display:inline-block;
  padding-top:5px;
  padding-bottom:5px;
  padding-left:20px;
  padding-right:20px;
}
#link_to_imprint {
  color:#ECF0F5;
}


/* Containers for the main content */
.contentWrappingFluidRow {
  display:flex;
  max-width:100%;
  margin-top:2vh;
}
.mainContentBoxDiv {
  flex:1;
  overflow:hidden;
  display:inline-block;
  width:100%;
  vertical-align:top;
  margin-left:0;
  margin-right:-20px;
}
.settingsBoxDiv {
  min-width:15%;
  max-width:25%;
  display:inline-block;
  vertical-align:top;
  margin-left:10px;
  margin-right:10px;
}

/* div for the main title in the dashboard */
#dashboardTitleDiv {
  color:#515151;
  font-size:35px;
  text-align:center;
  padding-top:140px;
  padding-bottom:140px;
}
#p-dashboard-month {
  font-size:25px;
}
#dashboardTopDiv {
  display:inline-block;
  text-align:left;
  margin-left: auto;
  margin-right: auto;
  width: 1000px;
  max-width: 100vw;
  padding-bottom:140px;
}

/* dashboard: value boxes */
.small-box { border-radius: 10px !important; }
.small-box.bg-light-blue { background-color: #578FB2 !important; }
.small-box.bg-yellow { background-color: #FD9D5D !important; }
.small-box.bg-olive { background-color: #68A191 !important; }

/* div for the header of a content block */
.headerDiv {
  color:#515151;
  min-width:50%;
  font-size:20px;
  margin-top: 20px;
  margin-bottom:0;
  padding-left:5px;
}
.headerDiv.first {
  margin-top: 0px;
}
.headerDiv.gray {
  border-bottom-color: #666666;
}
/* div for the body of a content block */
.bodyDiv {
  background:white;
  box-shadow: 0 0 3px #ccc;
  border-radius:10px;
  max-height: 85vh;
  overflow: hidden;
  padding: 10px 3px 10px 10px;
}
.body_innerDiv {
  max-height: 83vh;
  overflow-y: auto;
  overflow-x: hidden;
  /* edit scrollbars (Firefox only)*/
  scrollbar-width: thin;
  scrollbar-color: #eaeaea transparent;
  padding-right: 5px;
}

/* settings for the body of an information block */
.box-info > .box-body > p {
  margin-bottom:15px;
}

/* tooltip, i.e. hover, functionality of the time series plot */
.tooltip_parentDiv {
    position:relative;
}
.tooltip_parentDiv > .tooltip_div {
  opacity:0; /* display:none leads to problems with the hovering functionality, so we use opacity:0 here */
  position:absolute;
}
.tooltip_parentDiv:hover > .tooltip_div {
  opacity:1;
  position:fixed;
}

/* normal button based on <div> */
.divButton {
  display: inline-block;
  background-color: white;
  border-radius:  5px;
  padding-left:   10px;
  padding-right:  10px;
  padding-top:    5px;
  padding-bottom: 5px;
  margin-bottom:  5px;
  border: 1px solid #3C8DBC;
  color: #505065;
  box-shadow: 0 0 2px #ccc;
}
.divButton:hover {
  cursor: pointer;
  background-color: #F4F4F4;
  border: 1px solid #3C8DBC;
  color: black;
}
/* a dark variant, e.g. for the sidebar */
.divButtonDark {
  display: inline-block;
  background-color: #222D32;
  border-radius:  5px;
  padding-left:   10px;
  padding-right:  10px;
  padding-top:    5px;
  padding-bottom: 5px;
  margin-bottom:  5px;
  border: 1px solid #B8C7CE;
  color: #B8C7CE;
}
.divButtonDark:hover {
  cursor: pointer;
  background-color: #3E4447;
  color: white;
}

/* subtle button based on <div> */
.subtleDivButton {
  display: inline-block;
  border-radius: 20px;
  padding-left: 5px;
  padding-right: 5px;
  margin-right: 2px;
  margin-bottom: 3px;
}
.subtleDivButton:hover {
  cursor: pointer;
  background-color: gray;
  color: white;
}
.subtleDivButton:active {
  background-color: darkgray;
}
.subtleDivButton_unpressed {
  border: 1px solid gray;
  color: gray;
}
.subtleDivButton_pressed {
  border: 1px solid #3C8DBC;
  background-color: #3C8DBC;
  color: white;
}

/* header div for a section */
.sectionDiv {
  color:#515151;
  font-size:16px;
  font-weight:bold;
  border-bottom:1px solid #515151; /*#3F3F3F;*/
  margin-top:50px;
  margin-bottom:10px;
  padding-left:0;
}

/* pickerInput */
.dropdown-toggle {
  background-color:white;
}