.navbar {
  background-color: rgba(255, 255, 255, 0.9);
}

.navbar-brand {
  width: 100%;
}

.navbar-title {
  margin-left: 30px;
  font-size: 120%;
}

.navbar-logout {
  float: right;
}

.navbar-light .navbar-nav .nav-link,
.navbar a {
  color: #212529;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar a:hover {
  color: #4c4c4c;
  text-decoration: none;
}

#footer {
  width: 100%;
  height: 35px;
  text-align: center;
  font-size: 0.8em;
  color: rgb(119, 119, 119);
}

#footer > span {
  width: 100%;
  text-align: center;
}

.content-wrapper {
  display: flex;
  width: 100%;
  align-items: stretch;
  min-height: calc(100vh - 35px - 70px);
}

.container-fluid {
  padding: 0px;
}

.row {
  padding: 0px;
  margin: 0px;
  height: 100%;
}

.content-col {
  padding: 0px;
}

/* Putting border only between columns that follow another column */
.content-col + .content-col {
  border-left: 2px solid rgba(0, 0, 0, 0.125);
}

.card {
  background-color: rgba(255, 255, 255, 0.9);
  padding: 8px;
  border-radius: 0px;
  border: 0px;
}

.card-body {
  padding: 0px;
}

.modal-full-width {
  width: 95%;
  max-width: none;
}

.icon-button {
  padding: 0px 8px 0px 8px;
}

i.material-icons {
  font-size: 16px;
  vertical-align: middle;
  /* Hack to make the vertical align actually work */
  margin-top: -4px;
}

.icon-after-text i.material-icons {
  margin-left: 8px;
}

.scrollable {
  overflow-y: scroll;
}

.clickable {
  cursor: pointer;
}

.form-group {
  padding-bottom: 8px;
}

.form-group.row div {
  margin-top: auto;
  margin-bottom: auto;
}

.form-group.row div label {
  margin-top: 0px;
  margin-bottom: 0px;
}

.labeled-container {
  display: "inline-flex";
  align-items: "center";
}

label {
  margin-bottom: 0px;
  margin-top: 8px;
  margin-left: 8px;
  margin-right: 8px;
}

.layers-container {
  position: relative;
  top: 0;
  left: 0;
}

.layers-background {
  position: relative;
  top: 0;
  left: 0;
}

.layers-foreground {
  position: absolute;
  top: 0;
  left: 0;
}

.layers-hidden {
  display: none;
}

.btn-primary,
.btn-primary:hover,
.btn-outline-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled):active {
  border-color: rgb(206, 206, 206);
  color: #212121;
  background-color: rgb(206, 206, 206);
}

.btn-primary:focus,
.btn-outline-primary:focus,
.form-control:focus {
  box-shadow: 0 0 0 0 rgba(206, 206, 206, 0.5);
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(206, 206, 206, 0.5);
}

.btn-outline-primary,
.form-control:focus {
  border-color: rgb(206, 206, 206);
  color: #212121;
  background-color: rgb(255, 255, 255);
}

.btn-primary:disabled,
.btn-outline-primary:disabled,
select.form-control:disabled {
  cursor: not-allowed;
  border-color: rgb(206, 206, 206);
  color: #777777;
  background-color: rgb(255, 255, 255);
}

/* Green button */
.btn-success,
.btn-success:hover,
.btn-outline-success:hover,
.btn-success:focus,
.btn-success:not(:disabled):not(.disabled):active,
.btn-outline-success:not(:disabled):not(.disabled):active {
  border-color: rgb(60, 127, 36);
  color: rgb(60, 127, 36);
  background-color: rgb(196, 233, 178);
}

.btn-success:focus,
.btn-outline-success:focus {
  box-shadow: 0 0 0 0 rgba(196, 233, 178, 0.8);
}

.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-outline-success:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(196, 233, 178, 0.8);
}

.btn-outline-success {
  border-color: rgb(60, 127, 36);
  color: rgb(60, 127, 36);
}

.btn-success:disabled,
.btn-outline-success:disabled {
  cursor: not-allowed;
  border-color: rgb(206, 206, 206);
  color: #777777;
  background-color: rgb(255, 255, 255);
}

/* Yellow/orange button */
.btn-warning,
.btn-warning:hover,
.btn-outline-warning:hover,
.btn-warning:focus,
.btn-warning:not(:disabled):not(.disabled):active,
.btn-outline-warning:not(:disabled):not(.disabled):active {
  border-color: rgb(127, 100, 11);
  color: rgb(127, 100, 11);
  background-color: rgb(251, 242, 212);
}

.btn-warning:focus,
.btn-outline-warning:focus {
  box-shadow: 0 0 0 0 rgba(251, 242, 212, 0.8);
}

.btn-warning:not(:disabled):not(.disabled):active:focus,
.btn-outline-warning:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(251, 242, 212, 0.8);
}

.btn-outline-warning {
  border-color: rgb(127, 100, 11);
  color: rgb(127, 100, 11);
}

.btn-warning:disabled,
.btn-outline-warning:disabled {
  cursor: not-allowed;
  border-color: rgb(206, 206, 206);
  color: #777777;
  background-color: rgb(255, 255, 255);
}

/* Red button */
.btn-danger,
.btn-danger:hover,
.btn-outline-danger:hover,
.btn-danger:focus,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-outline-danger:not(:disabled):not(.disabled):active {
  border-color: rgb(205, 18, 28);
  color: rgb(205, 18, 28);
  background-color: rgb(250, 198, 201);
}

.btn-danger:focus,
.btn-outline-danger:focus {
  box-shadow: 0 0 0 0 rgba(250, 198, 201, 0.8);
}

.btn-danger:not(:disabled):not(.disabled):active:focus,
.btn-outline-danger:not(:disabled):not(.disabled):active:focus {
  box-shadow: 0 0 0 0.2rem rgba(250, 198, 201, 0.8);
}

.btn-outline-danger {
  border-color: rgb(205, 18, 28);
  color: rgb(205, 18, 28);
}

.btn-danger:disabled,
.btn-outline-danger:disabled {
  cursor: not-allowed;
  border-color: rgb(206, 206, 206);
  color: #777777;
  background-color: rgb(255, 255, 255);
}

select.form-control {
  padding-top: 0px;
  padding-bottom: 0px;
}

.table td {
  vertical-align: middle;
}

.badge {
  margin-left: 8px;
}

.badge-success {
  color: #5ebb34;
  border: 1px solid #5ebb34;
  background-color: #f2fbec;
}

.badge-warning {
  color: #f49c3c;
  border: 1px solid #f49c3c;
  background-color: #f9f3e6;
}

.badge-danger {
  color: #f0414d;
  border: 1px solid #f0414d;
  background-color: #f9edef;
}

.badge-info {
  color: #212121;
  border: 1px solid #212121;
  background-color: #cecece;
}

.icon-success {
  color: #5ebb34;
  vertical-align: middle;
}

.icon-warning {
  color: #f49c3c;
  vertical-align: middle;
}

.icon-danger {
  color: #f0414d;
  vertical-align: middle;
}

.icon-info {
  color: #212121;
  vertical-align: middle;
}

.map {
  border: 1px solid #cecece;
}

/* Hovering table row makes the borders and background visible
   for button outline primary and form controls. */
.table-hover tbody tr:hover .btn-outline-primary:not(:hover),
.table-hover tbody tr:hover .form-control:not(:hover) {
  border-color: rgb(206, 206, 206);
  color: #212121;
  background-color: rgba(255, 255, 255, 1);
}

/* Hide arrow from select form control if not hovered row. */
.table-hover tbody tr:not(:hover) select.form-control:not(:hover) {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}

/* Not hovered hides borders and background. */
.table-hover tbody tr:not(:hover) .form-control:not(:hover) {
  border-color: rgba(206, 206, 206, 0);
  color: #212121;
  background-color: rgba(255, 255, 255, 0);
}

/* Hovering table row makes the borders and background visible. */
.table-hover tbody tr:not(:hover) .btn-outline-primary:not(:hover) {
  border-color: rgba(206, 206, 206, 1);
  color: #212121;
  background-color: rgba(255, 255, 255, 0);
}

.multiselect-input__control {
  border-width: 1px;
  border-radius: 4px;
  border-style: solid;
  color: #212121;
}

/* Hovering table row makes the borders and background visible. */
.table-hover tbody tr:not(:hover) .multiselect-input__control {
  border-color: rgba(206, 206, 206, 0);
  background-color: rgba(255, 255, 255, 0);
}
/* Hovering table row makes the borders and background visible. */
.table-hover tbody tr:hover .multiselect-input__control {
  border-color: rgba(206, 206, 206, 1);
  background-color: rgba(255, 255, 255, 1);
}

/* Hovering table row makes the checkbox visible. */
.table-hover tbody tr:not(:hover) .form-check-input,
.table-hover tbody tr:not(:hover) .hide-when-no-hover {
  display: none !important;
}

/* Hovering table row makes the checkbox hidden. */
.table-hover tbody tr:hover .hide-when-hover {
  display: none !important;
}

.form-control:focus {
  box-shadow: 0 0 0 0 rgba(206, 206, 206, 0.5);
  border-color: rgb(206, 206, 206);
  color: #212121;
}

/* Read only text area has white background. */
.form-control:disabled,
.form-control[readonly] {
  background-color: white;
  opacity: 1;
}

/* Timeline customization. */
.react-calendar-timeline .rct-header-root {
  background: lightgray;
  border-bottom: 1px solid #bbb;
}

.react-calendar-timeline .rct-dateHeader-primary {
  background-color: white;
  border-left: 0px solid #bbb;
  border-right: 0px solid #bbb;
  color: #fff;
}

.react-calendar-timeline .rct-dateHeader {
  border-bottom: 1px solid #bbb;
  background-color: lightgrey;
  border-left: 1px solid #bbb;
}

.react-calendar-timeline .rct-item .rct-item-content {
  border: none;
}

/* Make wide modals, full screen. */
.wide-modal .modal-dialog {
  max-width: none;
  width: 98%;
  padding: 0;
}

.no-arrow {
  margin-top: 0;
}

.no-arrow .arrow {
  display: none;
}

.popover-max-width {
  max-width: 100%;
}

/* amCharts export menu styles */
.amcharts-amexport-item {
  border: 1px solid rgb(206, 206, 206) !important;
  color: #212121 !important;
  background-color: rgb(255, 255, 255) !important;
  opacity: 1 !important;
}

.amcharts-amexport-item:hover {
  border-color: rgb(206, 206, 206) !important;
  color: #212121 !important;
  background-color: rgb(206, 206, 206) !important;
}

.amcharts-amexport-top .amcharts-amexport-item > .amcharts-amexport-menu {
  top: -3px !important;
  right: 2px !important;
}

.amcharts-amexport-label-level-1,
.amcharts-amexport-label-level-2 {
  padding: 4px 8px 4px 8px !important;
  font-size: 14px !important;
}

.amcharts-amexport-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  padding: 0px !important;
  /* Vertically centering the icon */
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  margin: auto !important;
}