html,
body {
  padding: 0px;
  margin: 0px;
  background: #F4F6F7;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
@media screen and (max-width: 992px) {
  html {
    width: 992px;
  }
}
.content {
  width: 1366px;
  margin: 0px auto;
  overflow: auto;
}
@media only screen and (max-width: 1366px) {
  .content {
    padding: 0px 15px;
  }
}
button,
.btn,
a {
  cursor: pointer;
  outline: none !important;
}
button:focus,
.btn:focus,
a:focus {
  outline: none !important;
  box-shadow: none !important;
}
button:active:focus,
.btn:active:focus,
a:active:focus {
  outline: none !important;
  box-shadow: none !important;
}
input,
select {
  box-shadow: none !important;
  outline: none !important;
}
input:focus,
select:focus {
  outline: none !important;
  box-shadow: none !important;
  border-color: #808080 !important;
}
.body-content {
  padding: 20px 0px;
  margin: 0px;
}
input,
select,
textarea {
  max-width: 280px;
}
.margin-right {
  margin-right: 15px;
}
.margin-left {
  margin-left: 15px;
}
.form-inline {
  width: 100%;
}
.form-inline label {
  margin-right: 6px;
}
.margin-l-10 {
  margin-left: 10px;
}
.btn {
  color: #FFF;
  background: #24B9D6;
}
.btn:hover,
.btn:focus,
.btn:active {
  color: #FFF;
}
.btn:hover,
.btn:focus,
.btn:active {
  color: #FFF;
}
.datepicker table tr td.active.active,
.datepicker table tr td.active.active:hover {
  color: #fff;
  background-image: none;
  background-color: #333333;
  border-color: #333333;
}
.datepicker table tr td span.active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active:hover.hover {
  color: #fff;
  background-image: none;
  background-color: #333333;
  border-color: #333333;
}
.header-content {
  padding: 15px 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
}
.header-content h1 {
  flex: 1;
  text-align: center;
  color: #333333;
  font-size: 18px;
  line-height: 20px;
  font-weight: 600;
}
.header-content .logo img {
  width: 200px;
}
.box {
  background: #FFF;
  padding: 14px 14px;
  border-radius: 8px;
  border: none;
  box-shadow: none;
  margin-bottom: 15px;
}
.box .title {
  font-family: Arial;
  font-size: 18px;
  color: #333333;
  font-weight: 600;
  margin-top: 0px;
  margin-bottom: 10px;
}
.box .title-tooltip {
  color: #333333;
  margin: 0px 6px;
  position: relative;
  top: -1px;
}
.box .title-tooltip img {
  width: 20px;
  height: 20px;
}
.box .title-tooltip-content {
  display: none;
}
.box .chart {
  height: 420px;
}
.filter-content {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.filter-content .title {
  margin: 0px;
}
.filter-content .filter-form {
  margin-left: auto;
  width: 100%;
}
.filter-content select {
  min-width: 200px;
}
.invalid {
  border: 1px solid;
  border-color: #dc3545;
}
.loading {
  background-image: url('Images/loading-three-dots.svg');
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: center;
}
.chart-options {
  position: absolute;
  top: 5px;
  right: 25px;
}
.chart-options span {
  cursor: pointer;
  text-decoration: none;
  margin-left: 15px;
}
.chart-error {
  font-family: Arial;
  display: block;
  margin: 15px 15px;
  color: red;
  text-align: center;
}
#btnExportToPdf {
  padding: 6px 25px;
  position: relative;
}
#btnExportToPdf .btn-loading {
  display: inline-block;
  margin-right: 6px;
  background-image: url('Images/rolling.svg');
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-position-x: center;
  background-position-y: center;
  width: 14px;
  height: 14px;
  position: absolute;
  top: 9px;
  left: 5px;
}
#btnExportToPdf .btn-loading.none {
  display: none;
}
.export-title {
  margin: 5px 0px;
  text-align: center;
  font-weight: 600;
  font-size: 22px;
  font-family: Arial;
  visibility: hidden;
}
.export-pdf .box {
  background: none;
  border-radius: 0px;
}
.export-pdf .title-tooltip {
  display: none;
}
.export-pdf .chart-options {
  display: none;
}
.export-pdf .export-title {
  visibility: visible;
}
.tooltip {
  font-size: 14px;
  font-weight: 500;
}
.tooltip-inner {
  min-width: 350px;
}
#loading {
  display: none;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
}
tr.status-success {
  color: green;
}
tr.status-warning {
  color: orange;
}
tr.status-error {
  color: red;
}