@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i");
body {
  height: 100vh; }

div.wrapper-fuel-dashboard.wrapper-fuel-dashboard-column {
  flex-direction: column; }

.wrapper-fuel-dashboard {
  /*width: 100%;*/
  background: white;
  height: 100%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap; }
  .wrapper-fuel-dashboard div.box.map-container-double-height {
    height: 100%;
    max-height: 100%; }
  .wrapper-fuel-dashboard .box {
    width: 50%;
    height: 50%;
    max-height: 50%;
    display: flex;
    flex-direction: column;
    overflow: hidden; }
    .wrapper-fuel-dashboard .box .title-box {
      width: 100%;
      height: 32px;
      min-height: 32px;
      background: #0b3053;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 24px;
      z-index: 2;
      border-right: 1px solid #114a80; }
      .wrapper-fuel-dashboard .box .title-box div.back-to-group {
        display: inline-block;
        border-radius: 2px;
        background: #3399ff;
        color: #FFFFFF;
        cursor: pointer;
        font-family: "Open Sans", sans-serif;
        /* text-align: left; */
        font-size: 13px;
        padding: 2px; }
      .wrapper-fuel-dashboard .box .title-box span {
        font-family: "Open Sans", sans-serif;
        text-transform: uppercase;
        font-weight: 700;
        font-size: 13px;
        color: #FFFFFF;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; }
      .wrapper-fuel-dashboard .box .title-box ul.pagination {
        display: flex; }
        .wrapper-fuel-dashboard .box .title-box ul.pagination li {
          width: 16px;
          height: 16px;
          border-radius: 2px;
          background: rgba(255, 255, 255, 0.15);
          margin: 0 3px;
          list-style: none;
          display: flex;
          justify-content: center;
          align-items: center;
          transition: all .25s ease-in-out;
          font-family: "Open Sans", sans-serif;
          color: white;
          font-size: 10px;
          line-height: 10px;
          position: relative; }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li:hover, .wrapper-fuel-dashboard .box .title-box ul.pagination li.active-page {
            cursor: pointer;
            background: rgba(255, 255, 255, 0.8);
            color: #214971; }
            .wrapper-fuel-dashboard .box .title-box ul.pagination li:hover.prev:before, .wrapper-fuel-dashboard .box .title-box ul.pagination li:hover.next:before, .wrapper-fuel-dashboard .box .title-box ul.pagination li.active-page.prev:before, .wrapper-fuel-dashboard .box .title-box ul.pagination li.active-page.next:before {
              border-color: #214971; }
            .wrapper-fuel-dashboard .box .title-box ul.pagination li:hover.center, .wrapper-fuel-dashboard .box .title-box ul.pagination li.active-page.center {
              background: rgba(255, 255, 255, 0.15);
              cursor: default; }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li.prev:before, .wrapper-fuel-dashboard .box .title-box ul.pagination li.next:before {
            position: absolute;
            content: '';
            display: block;
            width: 5px;
            height: 5px;
            border-left: 2px solid white;
            border-bottom: 2px solid white;
            transform: rotate(45deg);
            top: 5px;
            left: 6px; }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li.next:before {
            top: 5px;
            left: 3px;
            transform: rotate(-135deg); }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li.center:before, .wrapper-fuel-dashboard .box .title-box ul.pagination li.center:after {
            position: absolute;
            content: '';
            display: block;
            width: 4px;
            height: 4px;
            border-radius: 2px;
            background: white; }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li.center:before {
            margin-left: -3px; }
          .wrapper-fuel-dashboard .box .title-box ul.pagination li.center:after {
            margin-left: 3px; }
    .wrapper-fuel-dashboard .box .body-box {
      height: calc(100% - 32px); }
      .wrapper-fuel-dashboard .box .body-box#body-box-charts {
        padding: 0;
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        width: 100%;
        height: 100%;
        border-right: 1px solid #E4E8F0;
        overflow: auto; }
        .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap {
          border-right: 1px solid #E4E8F0;
          border-bottom: 1px solid #E4E8F0;
          width: 50%;
          height: 50%;
          display: flex;
          flex-direction: column;
          /*align-items: center;*/
          padding: 12px;
          overflow-x: auto;
          overflow-y: hidden; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-pie-charts {
            flex-direction: row; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap h3 {
            margin: 0px 10px 10px 16px;
            font-family: OpenSansRegular;
            font-size: 20px;
            color: #204971;
            display: flex;
            min-height: 25px; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .bar-chart {
            width: 100%;
            height: 100%;
            display: flex; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts {
            min-width: 44%;
            height: 100%; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts .piechart-tooltip {
              padding: 8px;
              background-color: rgba(255, 255, 255, 0.7);
              border: 1px solid black;
              border-radius: 3px;
              font-family: "Open Sans", sans-serif;
              text-align: left;
              font-size: 13px;
              color: #214971;
              box-shadow: 1px 1px 1px 1px rgba(128, 128, 128, 0.5);
              z-index: 10; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts .piechart-tooltip .percent {
                font-weight: bold; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend {
            padding-bottom: 2px;
            padding-left: 8px;
            padding-right: 16px;
            /*width: min-content;*/
            min-width: max-content;
            overflow: hidden; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend h3 {
              margin-top: 0px;
              margin-left: 0px;
              color: #214971;
              font-family: "Open Sans", sans-serif;
              font-weight: 400;
              font-size: 19px;
              margin-bottom: 9px;
              position: relative;
              white-space: nowrap; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td {
              height: 24px;
              padding: 0;
              display: table-cell;
              vertical-align: inherit;
              text-align: left; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label {
                font-family: "Open Sans", sans-serif;
                font-weight: 700;
                font-size: 14px;
                white-space: nowrap; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.green {
                  color: #00b600; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.orange {
                  color: #f6a900; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.red {
                  color: #ff5228; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.purple {
                  color: #3f51b5; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.pink {
                  color: #bf00b7; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.label.gray {
                  color: #777777; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.value {
                white-space: nowrap;
                font-family: "Open Sans", sans-serif;
                color: #214971;
                font-weight: 700;
                font-size: 14px;
                padding-left: 4px; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap .pie-charts-legend table tr td.value span {
                  opacity: .75; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics {
            overflow: auto; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics .table-box-vertical-center {
              height: 100%;
              display: flex;
              flex-direction: column;
              justify-content: center; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics table {
              margin-left: 16px;
              margin-right: 16px; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics table tr td {
                padding: 0;
                height: 20px; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics table tr td.label {
                  font-family: "Open Sans", sans-serif;
                  color: #214971;
                  font-size: 12px;
                  font-weight: 400;
                  opacity: .95;
                  white-space: nowrap;
                  letter-spacing: -.2px; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics table tr td.value {
                  font-family: "Open Sans", sans-serif;
                  color: #214971;
                  font-size: 12px;
                  font-weight: 600;
                  padding-left: 2px;
                  white-space: nowrap;
                  letter-spacing: -.2px; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap.wrap-statistics table:last-child tr td:last-child {
                padding-right: 16px;
                padding-left: 8px; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality {
            border-right: 1px solid #E4E8F0;
            border-bottom: 1px solid #E4E8F0;
            flex-wrap: wrap; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.pie-charts {
              height: 80%; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.overall-quality {
              width: 100%;
              text-align: center;
              color: #214971; }
              .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.overall-quality .overall-ranking {
                font-weight: bold; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.overall-quality .overall-ranking.green {
                  color: #00b600; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.overall-quality .overall-ranking.orange {
                  color: #f6a900; }
                .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality div.overall-quality .overall-ranking.red {
                  color: #ff5228; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#statistics {
            border-bottom: 1px solid #E4E8F0;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            overflow: hidden; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#statistics .box-tables {
              display: flex; }
            .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#statistics h3 {
              margin-top: 0px;
              display: block;
              margin-left: 16px;
              margin-right: 16px;
              color: #214971;
              font-family: "Open Sans", sans-serif;
              font-weight: 300;
              font-size: 19px;
              margin-bottom: 9px;
              position: relative;
              white-space: nowrap; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#violations {
            border-right: 1px solid #E4E8F0; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality .highcharts-color-0 {
            fill: #00C000;
            stroke: #00C000; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality .highcharts-color-1 {
            fill: #FFB30B;
            stroke: #FFB30B; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#driving-quality .highcharts-color-2 {
            fill: #FF5A32;
            stroke: #FF5A32; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#violations .highcharts-color-0, .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#speed .highcharts-color-0 {
            fill: #00C000;
            stroke: #00C000; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#violations .highcharts-color-1, .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#speed .highcharts-color-1 {
            fill: #3F51B5;
            stroke: #3F51B5; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#violations .highcharts-color-2, .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#speed .highcharts-color-2 {
            fill: #FFB30B;
            stroke: #FFB30B; }
          .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#violations .highcharts-color-3, .wrapper-fuel-dashboard .box .body-box#body-box-charts .wrap#speed .highcharts-color-3 {
            fill: #FF5A32;
            stroke: #FF5A32; }
      .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table {
        display: table; }
        .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td.green {
          color: #008d00; }
        .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td.orange {
          color: #d79400; }
        .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td.red {
          color: #fe3200; }
        .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td div.economy-bar-wrapper {
          display: inline-flex;
          flex-direction: row;
          height: 100%;
          width: 100%; }
          .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td div.economy-bar-wrapper div.economy-bar-label {
            min-width: 70px; }
          .wrapper-fuel-dashboard .box .body-box#table-fuel-consuption-economy table td div.economy-bar-wrapper div.economy-bar-filled {
            background: #00c000;
            border-radius: 2px; }
    .wrapper-fuel-dashboard .box #table-fuel-consuption-economy, .wrapper-fuel-dashboard .box #table-fillings-thefts-container {
      display: flex;
      flex-direction: column; }
      .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box {
        overflow: auto;
        height: 100%;
        width: 100%; }
        .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table {
          min-width: 100%; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table#table_unit_fuel_consuption_table td, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table#table_unit_fuel_consuption_table td {
            cursor: pointer; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table#table_fillings_thefts td, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table#table_fillings_thefts td {
            cursor: pointer; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr td, .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr td, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th {
            height: 28px;
            padding: 6px 16px;
            font-family: "Open Sans", sans-serif;
            text-align: left;
            font-size: 13px;
            line-height: 12px;
            color: #214971;
            vertical-align: middle;
            border-bottom: 1px solid #e5e8ef; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr td.align-center, .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.align-center, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr td.align-center, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.align-center {
              text-align: center; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr td.align-right, .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.align-right, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr td.align-right, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.align-right {
              text-align: right; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr td.nowrap, .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.nowrap, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr td.nowrap, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.nowrap {
              white-space: nowrap; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th {
            background: #E9ECF1;
            font-size: 11px;
            line-height: 10px; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th a.asc::after, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th a.asc::after {
              content: "\00a0\2191";
              font-size: 1.5em; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th a.desc::after, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th a.desc::after {
              content: "\00a0\2193";
              font-size: 1.5em; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.column-sequential-number, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.column-sequential-number {
              width: 30px; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.column-unit-name, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.column-unit-name {
              width: 200px; }
            .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.column-fuel-economy-bar, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.column-fuel-economy-bar {
              width: 250px; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.mpg a.asc::after, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.mpg a.asc::after {
            content: "\00a0\2193";
            font-size: 1.5em; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr th.mpg a.desc::after, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr th.mpg a.desc::after {
            content: "\00a0\2191";
            font-size: 1.5em; }
          .wrapper-fuel-dashboard .box #table-fuel-consuption-economy .table-box table.default-table-style tr.selected-row td, .wrapper-fuel-dashboard .box #table-fillings-thefts-container .table-box table.default-table-style tr.selected-row td {
            background: #d1e8ff; }

/*# sourceMappingURL=fuel-dashboard.css.map */
