@import url("https://fonts.googleapis.com/css?family=Inconsolata:400,600|Roboto+Mono:300|Montserrat:400,500,600,700&display=swap");
@font-face {
  font-family: "Pelham Neue";
  src: url("../../App/Styles/Fonts/Pelham Neue/woff/Pelham Neue.woff") format("woff"), url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue - Bold.otf") format("opentype");
  font-weight: bold; }

@font-face {
  font-family: "Pelham Neue";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue Black";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Black.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue Black";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Black - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue Bold";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Bold - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue SemiBold";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue SemiBold.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue SemiBold";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue SemiBold - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue ExtraBold";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue ExtraBold.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue ExtraBold";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue ExtraBold - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue Thin";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Thin.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue Thin";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Thin - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue Light";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Light.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue Light";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Light - Italic.otf") format("opentype");
  font-style: italic; }

@font-face {
  font-family: "Pelham Neue Medium";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Medium.otf") format("opentype"); }

@font-face {
  font-family: "Pelham Neue Medium";
  src: url("../../App/Styles/Fonts/Pelham Neue/Pelham Neue Medium - Italic.otf") format("opentype");
  font-style: italic; }

* {
  box-sizing: border-box; }

body, html {
  height: 100%; }

body {
  font-family: Montserrat;
  margin: 0;
  font-size: 14px; }

a {
  text-decoration: none;
  color: #2780e3;
  transition-duration: 500ms; }
  a:hover {
    color: #00abe8;
    text-decoration: none; }

.dont-break-out {
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  word-break: break-all;
  word-break: break-word;
  -ms-hyphens: auto;
  -moz-hyphens: auto;
  -webkit-hyphens: auto;
  hyphens: auto; }

.container {
  padding-top: 20px;
  padding-bottom: 20px; }

.accordion {
  font-size: 13px;
  border-top: 1px solid lightgrey;
  margin-bottom: 25px; }
  .accordion .acc-line-wrapper .acc-line-header {
    background-color: #E3F1FD;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    display: flex;
    cursor: pointer; }
    .accordion .acc-line-wrapper .acc-line-header .acc-line-header-content {
      padding: 4px;
      font-family: 'Inconsolata', monospace;
      font-weight: bold; }
      .accordion .acc-line-wrapper .acc-line-header .acc-line-header-content span {
        overflow: hidden; }
  .accordion .acc-line-wrapper .acc-line-body .acc-item-table tbody tr th {
    width: 160px; }

#root {
  height: 100%; }

.main-wrapper {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed; }

.layout-grid {
  height: 100%;
  overflow-y: scroll;
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 100%;
  grid-template-columns: 100%;
  -ms-grid-rows: auto minmax(min-content, 1fr) auto;
  grid-template-rows: auto minmax(min-content, 1fr) auto; }
  .layout-grid header {
    -ms-grid-row: 1;
    grid-row: 1;
    -ms-grid-column: 1;
    grid-column: 1; }
  .layout-grid main, .layout-grid .main {
    -ms-grid-row: 2;
    grid-row: 2;
    -ms-grid-column: 1;
    grid-column: 1; }
  .layout-grid footer {
    -ms-grid-row: 3;
    grid-row: 3;
    -ms-grid-column: 1;
    grid-column: 1; }

.layout-flex {
  height: 100%;
  display: flex;
  flex-direction: column; }
  .layout-flex header {
    flex: 0 0 auto; }
  .layout-flex footer {
    flex: 0 0 auto; }
  .layout-flex main, .layout-flex .main {
    flex: 1 1 auto; }

header {
  position: relative;
  z-index: 99;
  background-color: transparent; }
  header .header-bar {
    height: 60px; }
    header .header-bar .header-content {
      height: 100%;
      display: flex;
      max-width: 1170px;
      margin: auto;
      padding: 0 20px; }
      header .header-bar .header-content .logo-wrapper {
        height: 100%;
        width: 340px;
        overflow: hidden;
        transition-duration: 500ms; }
        header .header-bar .header-content .logo-wrapper img {
          height: 100%;
          padding: 10px; }
        @media (max-width: 700px) {
          header .header-bar .header-content .logo-wrapper {
            width: 77px; } }
      header .header-bar .header-content .links-wrapper {
        padding: 0 0 10px 0;
        margin: 0;
        flex: 1;
        position: relative;
        text-transform: uppercase; }
        header .header-bar .header-content .links-wrapper .welcome {
          position: absolute;
          top: 0;
          right: 0;
          padding-right: 15px;
          padding-top: 5px;
          font-size: 14px; }
        header .header-bar .header-content .links-wrapper ul {
          display: flex;
          float: right;
          align-items: flex-end;
          justify-content: center;
          padding: 0;
          margin: 0;
          height: 100%;
          list-style: none;
          padding-bottom: 4px;
          margin-bottom: -1px; }
          header .header-bar .header-content .links-wrapper ul li {
            display: inline-block;
            margin: 0;
            padding: 0 15px; }
            header .header-bar .header-content .links-wrapper ul li a {
              display: block;
              font-family: Montserrat;
              font-weight: bold;
              font-style: normal;
              font-size: 13px;
              text-transform: uppercase; }
              header .header-bar .header-content .links-wrapper ul li a:after {
                display: block;
                content: '';
                border-bottom: solid 1px #00abe8;
                transform: scaleX(0);
                transition: transform 300ms ease-in-out; }
              header .header-bar .header-content .links-wrapper ul li a:hover:after {
                transform: scaleX(1); }
      header .header-bar .header-content .mobile-links-wrapper {
        display: none;
        padding: 0;
        margin: 0;
        flex: 1; }
        header .header-bar .header-content .mobile-links-wrapper ul {
          display: flex;
          float: right;
          align-items: center;
          justify-content: center;
          padding: 0;
          margin: 0;
          height: 100%;
          list-style: none; }
          header .header-bar .header-content .mobile-links-wrapper ul li {
            display: inline-block;
            margin: 0;
            padding: 0 15px;
            line-height: 1; }
        header .header-bar .header-content .mobile-links-wrapper .mobile-nav-bars {
          font-size: 20px;
          cursor: pointer;
          user-select: none; }
          header .header-bar .header-content .mobile-links-wrapper .mobile-nav-bars i {
            color: #00abe8;
            margin-top: 3px; }
  header .mobile-nav {
    display: none; }
    header .mobile-nav ul {
      padding: 0;
      margin: 0;
      list-style: none;
      width: 100%;
      text-align: center; }
      header .mobile-nav ul li {
        margin: 0;
        padding-top: 10px;
        text-align: center; }
        header .mobile-nav ul li:last-child {
          padding-bottom: 10px; }
        header .mobile-nav ul li a {
          font-size: 14px;
          display: inline-block;
          font-family: Montserrat;
          font-weight: bold;
          font-style: normal;
          font-size: 13px;
          text-transform: uppercase;
          color: #00abe8; }
          header .mobile-nav ul li a:after {
            display: block;
            content: '';
            border-bottom: solid 1px #00abe8;
            transform: scaleX(0);
            transition: transform 300ms ease-in-out; }
          header .mobile-nav ul li a:hover:after {
            transform: scaleX(1); }
  @media (max-width: 700px) {
    header .header-bar .header-content .links-wrapper {
      display: none; }
    header .header-bar .header-content .mobile-links-wrapper {
      display: block; }
    header .mobile-nav {
      display: block; } }

footer {
  width: 100%;
  border-top: 1px solid #DDDDDD;
  text-align: right;
  padding: 10px 15px; }

main, .main {
  display: block;
  width: 100%; }

.formWrapper {
  box-shadow: rgba(0, 0, 0, 0.4) 0 11px 16px 10px;
  max-width: 800px;
  margin: auto;
  background: rgba(255, 255, 255, 0.85); }
  .formWrapper .formHeader-wrapper {
    height: 300px;
    background-color: black;
    display: flex;
    align-items: flex-end;
    background-size: cover;
    background-position: center;
    position: relative; }
    .formWrapper .formHeader-wrapper .formHeader-mask {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background-color: rgba(0, 0, 0, 0.35);
      z-index: 1; }
    .formWrapper .formHeader-wrapper .formHeader {
      padding: 25px 50px;
      color: white;
      display: flex;
      align-items: center;
      position: relative;
      z-index: 1;
      text-shadow: 0 0 5px black; }
      .formWrapper .formHeader-wrapper .formHeader .formHeader-content {
        margin: auto 20px; }
      .formWrapper .formHeader-wrapper .formHeader .formHeader-image img {
        -webkit-filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.75));
        filter: drop-shadow(0px 0px 5px rgba(0, 0, 0, 0.75)); }
    @media (max-width: 767px) {
      .formWrapper .formHeader-wrapper .formHeader {
        padding: 15px; }
        .formWrapper .formHeader-wrapper .formHeader h2 {
          font-size: 21px; } }
    @media (max-width: 550px) {
      .formWrapper .formHeader-wrapper .formHeader {
        flex-direction: column;
        align-items: baseline; }
        .formWrapper .formHeader-wrapper .formHeader .formHeader-image {
          margin: 35px 20px; } }
  .formWrapper .surveySectionWrapper {
    padding: 50px; }

.main-container {
  padding: 0 25px;
  max-width: 1170px;
  margin: auto;
  padding-top: 20px; }

.report-filters {
  padding: 3em 0;
  background: #fbfbfb;
  border-bottom: 1px solid #DDDDDD;
  border-top: 1px solid #DDDDDD; }
  .report-filters .controls-container {
    padding-top: 0; }
    .report-filters .controls-container .date-span {
      width: 50%;
      display: inline-block;
      vertical-align: top; }
      .report-filters .controls-container .date-span label {
        display: block; }
      .report-filters .controls-container .date-span input {
        display: inline-block;
        width: calc(50% - 50px);
        height: 38px; }
      .report-filters .controls-container .date-span .to {
        display: inline-block;
        width: 50px;
        text-align: center; }
    .report-filters .controls-container .filter-branch {
      display: inline-block;
      width: 25%;
      padding-right: 30px;
      vertical-align: top; }
    .report-filters .controls-container .filter-text {
      display: inline-block;
      width: 50%;
      padding-right: 30px; }
    .report-filters .controls-container .filter-lo {
      display: inline-block;
      width: 25%;
      vertical-align: top; }
    @media (max-width: 1000px) {
      .report-filters .controls-container .date-span {
        display: block;
        width: 100%; }
        .report-filters .controls-container .date-span input {
          width: calc(50% - 25px); }
      .report-filters .controls-container .filter-branch {
        display: block;
        width: 100%;
        padding-right: 0; }
      .report-filters .controls-container .filter-text {
        display: block;
        width: 100%;
        padding-right: 0; }
      .report-filters .controls-container .filter-lo {
        display: block;
        width: 100%; } }
  @media (max-width: 700px) {
    .report-filters {
      font-size: 12px; }
      .report-filters label, .report-filters input {
        font-size: 12px; } }

.download-options {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  padding: 1em 0;
  background-color: rgba(255, 255, 255, 0.8);
  border-top: 1px solid #ececec; }
  .download-options .main-container {
    padding-top: 0; }
    .download-options .main-container .download-buttons {
      text-align: right;
      margin-bottom: 0;
      white-space: nowrap; }
      .download-options .main-container .download-buttons button {
        padding: 5px 15px;
        font-size: 13px; }
        .download-options .main-container .download-buttons button svg {
          margin-right: 8px; }
      @media (max-width: 700px) {
        .download-options .main-container .download-buttons {
          text-align: center; }
          .download-options .main-container .download-buttons button {
            font-size: 11px; }
            .download-options .main-container .download-buttons button:first-child {
              margin-right: 5px; }
            .download-options .main-container .download-buttons button:nth-child(2) {
              margin-left: 5px; }
            .download-options .main-container .download-buttons button svg {
              display: none; } }

.status-table {
  width: 100%; }
  .status-table table {
    text-align: right; }
    .status-table table tr {
      border-bottom: 1px solid #ececec; }
      .status-table table tr td {
        font-size: 27px; }
        .status-table table tr td:first-child {
          text-align: left;
          font-size: 19px;
          vertical-align: middle;
          text-transform: capitalize; }
        @media (max-width: 700px) {
          .status-table table tr td {
            font-size: 1.25em; } }

.data-table-wrapper {
  width: 100%;
  padding: 50px 10px 60px;
  overflow: auto;
  background-color: white;
  border-top: 1px solid #DDDDDD; }
  .data-table-wrapper .data-table-container {
    overflow: auto; }
    .data-table-wrapper .data-table-container .data-table {
      width: 100%;
      min-width: 800px; }
      .data-table-wrapper .data-table-container .data-table table {
        text-align: left;
        margin: auto;
        width: auto; }
        .data-table-wrapper .data-table-container .data-table table tr {
          border-bottom: 1px solid #ececec; }
          .data-table-wrapper .data-table-container .data-table table tr th {
            white-space: nowrap;
            cursor: pointer;
            user-select: none; }
          .data-table-wrapper .data-table-container .data-table table tr td {
            font-size: 12px;
            white-space: pre-wrap; }
            .data-table-wrapper .data-table-container .data-table table tr td .commentBox {
              width: 100%;
              max-height: 100px;
              overflow: auto; }
          .data-table-wrapper .data-table-container .data-table table tr td, .data-table-wrapper .data-table-container .data-table table tr th {
            min-width: 150px;
            max-width: 600px; }
            .data-table-wrapper .data-table-container .data-table table tr td:first-child, .data-table-wrapper .data-table-container .data-table table tr th:first-child {
              width: 175px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(2), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(2) {
              width: 175px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(3), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(3) {
              width: 150px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(4), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(4) {
              width: 200px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(5), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(5) {
              width: 175px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(6), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(6) {
              width: 150px; }
            .data-table-wrapper .data-table-container .data-table table tr td:nth-child(7), .data-table-wrapper .data-table-container .data-table table tr th:nth-child(7) {
              width: 500px; }

.graph-wrapper {
  text-align: center;
  width: 100%; }
  .graph-wrapper .graph-container {
    max-width: 440px;
    margin: auto;
    padding: 0 20px;
    position: relative; }

.metricCard-container {
  max-width: 1425px;
  margin: auto; }
  .metricCard-container .metric-wrapper {
    padding: 20px;
    flex: 1; }
    .metricCard-container .metric-wrapper .metric-container {
      box-shadow: rgba(0, 0, 0, 0.4) 0 0 5px;
      background: #fff;
      padding: 50px;
      min-width: 350px; }
      @media (max-width: 700px) {
        .metricCard-container .metric-wrapper .metric-container {
          padding: 15px; } }
  @media (min-width: 1200px) {
    .metricCard-container {
      display: flex; }
      .metricCard-container .metric-wrapper {
        flex: 1; } }

.strongLabel {
  text-transform: uppercase;
  font-weight: bold;
  color: #444; }