@import url(https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap);
.tippy-tooltip {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #FFF;
  border: 1px #EE7600 solid;
  border-radius: 100%;
  color: #EE7600;
  outline: none;
  text-align: center;
  position: relative;
  top: -2px;
  margin-left: 10px;
  padding-top: 1px;
  cursor: pointer; }

.tippy-box {
  background-color: #FFF;
  border: 1px #EE7600 solid;
  color: #EE7600; }
  .tippy-box .tippy-content {
    padding: 15px;
    font-size: 1.4rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    line-height: 1.7; }

.tippy-arrow {
  color: #EE7600; }

body {
  font-family: "Open Sans", sans-serif; }

.btn {
  border: none;
  padding: 15px 30px;
  font-size: 14px;
  font-weight: 700;
  line-height: 16px;
  border-radius: 25px;
  font-family: "Open Sans", sans-serif;
  text-transform: uppercase; }
  .btn.btn-primary {
    background-color: #7BC144; }
    .btn.btn-primary:hover {
      background-color: #639e34; }
  .btn.btn-info {
    background-color: #888888; }
    .btn.btn-info:hover {
      background-color: #6f6f6f; }
  .btn.btn-default {
    background-color: #EE7600;
    color: #FFFFFF; }
    .btn.btn-default:hover {
      background-color: #e6e6e6;
      color: #333333; }
  .btn.btn-empty {
    background-color: transparent;
    border: none;
    color: #333333;
    font-weight: 600; }
  .btn.btn-warning {
    background-color: #FDBB2F;
    color: #FFFFFF; }
    .btn.btn-warning:hover {
      background-color: #f7a802; }
  .btn.btn-success {
    background: #95bb13;
    color: #FFFFFF; }
    .btn.btn-success:hover {
      background-color: #708d0e; }
  .btn.btn-link {
    background-color: transparent;
    border: none;
    color: #333333;
    font-weight: 500;
    padding: 0;
    border-radius: 0px;
    text-transform: inherit;
    font-size: inherit;
    line-height: inherit; }
    .btn.btn-link:hover {
      background-color: transparent; }
  .btn.btn-secondary {
    background-color: #FFFFFF;
    color: #EE7600;
    border: 1pt solid #CCCCCC; }
    .btn.btn-secondary:hover {
      background-color: #e6e6e6;
      text-decoration: none; }
  .btn.disabled {
    background-color: #FFFFFF;
    border: 1px solid #d8d8d8;
    color: #BBBBBB;
    pointer-events: none; }
    .btn.disabled:hover {
      background-color: #FFFFFF; }
  .btn.no-margin {
    margin: 0; }
  .btn:focus, .btn:active:focus {
    outline: none; }
  .btn.afgerond {
    background: white;
    color: #4a4a4a;
    border: 2pt solid #EE7600;
    padding: 8px 18px; }

button.plusser-button, button.shipment-plusser-button {
  padding: 12px;
  width: 100%;
  text-align: left;
  border: 1px dashed #E5E6EA; }
  button.plusser-button .glyphicon, button.shipment-plusser-button .glyphicon {
    background: #7BC144;
    padding: 5px;
    font-size: 9px;
    border-radius: 50%;
    color: #FFFFFF;
    margin-right: 15px; }

.download-button-document {
  color: #7BC144;
  font-weight: 700;
  text-transform: uppercase; }
  .download-button-document .btn-download {
    background-color: #f1f8ec; }
    .download-button-document .btn-download:hover, .download-button-document .btn-download:focus {
      color: #639e34; }
  .download-button-document:hover, .download-button-document:focus {
    color: #639e34; }
  .download-button-document.disabled {
    color: #888888;
    pointer-events: none; }
    .download-button-document.disabled .btn-download {
      background-color: #f8f8f8; }
      .download-button-document.disabled .btn-download:hover, .download-button-document.disabled .btn-download:focus {
        color: #888888; }
    .download-button-document.disabled:hover, .download-button-document.disabled:focus {
      color: #888888; }

/* stylelint-disable */
html {
  font-size: 62.5%;
  height: 100%; }

/* stylelint-enable */
html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%; }
  html .no-overflow,
  body .no-overflow {
    overflow: hidden; }

body {
  font-size: 1.4rem;
  line-height: 1.19;
  color: #333333;
  font-weight: 400;
  background-color: #f1f1f1; }
  body > div#container:not([id*='tippy']):not(.skiptranslate) {
    min-height: 100vh; }
    body > div#container:not([id*='tippy']):not(.skiptranslate) > div {
      min-height: 100vh;
      display: flex;
      flex-direction: column; }

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5 {
  margin: 0; }

h1,
.h1 {
  font-weight: 600;
  font-size: 24px;
  line-height: 33px;
  color: #333333;
  margin: 30px 0; }

h2,
.h2 {
  font-weight: 400;
  font-size: 20px;
  line-height: 27px; }

h3,
.h3 {
  font-weight: 700;
  font-size: 20px;
  line-height: 27px;
  margin-bottom: 30px; }

h4,
.h4 {
  font-size: 2.0rem;
  line-height: 1.2;
  color: #00719F;
  font-weight: 700; }

p {
  margin-top: 0px;
  margin-bottom: 20px; }

button {
  border: none;
  background: none;
  font-family: "Open Sans", sans-serif;
  font-weight: 300; }

ul {
  padding-left: 0; }

a {
  color: #009fdf;
  text-decoration: none;
  letter-spacing: 0.5px; }
  a:hover, a:focus {
    color: #00719F; }

strong,
b {
  font-weight: 700; }

.medium {
  font-weight: 600; }

*[hidden] {
  display: none; }

.rounded {
  border-radius: 5px; }

.align-items-center {
  display: flex;
  align-items: center; }

.align-self.stretch {
  align-self: stretch; }

.align-self.center {
  align-self: center; }

.align-self.start {
  align-self: start; }

.align-self.end {
  align-self: end; }

.statuslabel {
  border-radius: 5px;
  text-align: center;
  padding: 5px 20px; }
  .statuslabel label {
    margin-bottom: 0; }

.label-link a {
  color: rgba(51, 51, 51, 0.5);
  font-weight: 400; }

.success {
  color: #7BC144; }

.white {
  color: #FFFFFF; }

.black {
  color: #333333; }

.grey {
  color: #E5E6EA; }

.blue {
  color: #009fdf; }

.dark-blue {
  color: #00719F; }

.bck-img {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  .bck-img.contain {
    background-size: contain; }

hr {
  border: 1px solid rgba(0, 80, 129, 0.1);
  margin: 30px 0; }

.no-padding-top {
  padding-top: 0 !important; }

.no-margin-top {
  margin-top: 0 !important; }

.no-padding-bottom {
  padding-bottom: 0 !important; }

.no-margin-bottom {
  margin-top: 0 !important; }

ul {
  list-style: none; }

ol {
  padding-left: 15px; }
  ol li {
    color: #009fdf;
    font-weight: 700;
    padding: 10px 15px; }
    ol li a {
      color: #009fdf;
      font-weight: 700; }

.flex-wrapper {
  display: flex; }
  .flex-wrapper.center {
    align-items: center; }
  .flex-wrapper.baseline {
    align-items: baseline; }
  .flex-wrapper .grow-2 {
    flex-grow: 2; }

.v-align-center {
  display: flex;
  align-items: center; }

.bold-text {
  font-weight: 700; }

.wrap {
  flex-wrap: wrap; }

.word-wrap {
  word-wrap: break-word; }

.full-width {
  width: 100%; }

.typeahead {
  z-index: 1051; }

span.twitter-typeahead {
  width: 100%; }

.typeahead.dropdown-menu,
span.twitter-typeahead .tt-menu {
  min-width: 100%;
  /* 	background: white; */
  /*     border: none; */
  /*     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12); */
  /*     border-radius: 0; */
  /*     font-size: 1rem; */ }

span.twitter-typeahead .tt-suggestion {
  /*     color: #26a69a;
      cursor: pointer;
      padding: 1rem;
      text-transform: capitalize; */
  /*     font-weight: 400; */
  display: block; }

img.opacity {
  opacity: 0.3; }

.container {
  padding: 24px; }
  .container .alert {
    border: none;
    border-radius: 0;
    margin-bottom: 24px; }
    .container .alert.alert-warning {
      color: #FFFFFF;
      background-color: #FDBB2F; }
    .container .alert.alert-danger {
      border: 1px solid red; }
    .container .alert a {
      color: #FFFFFF;
      font-weight: normal;
      text-shadow: none;
      opacity: 1; }
  .container .vertical-m {
    margin-top: 24px;
    margin-bottom: 24px; }
  .container .top-m {
    margin-top: 24px; }
  .container .bot-m {
    margin-bottom: 24px; }
  .container .horizontal-m {
    margin-left: 24px;
    margin-right: 24px; }
  .container .left-m {
    margin-left: 24px; }
  .container .right-m {
    margin-right: 24px; }
  .container .arround-m {
    margin: 24px; }
  .container .no-m {
    margin: 0; }
  .container .vertical-p {
    padding-top: 24px;
    padding-bottom: 24px; }
  .container .top-p {
    padding-top: 24px; }
  .container .bot-p {
    padding-bottom: 24px; }
  .container .horizontal-p {
    padding-left: 24px;
    padding-right: 24px; }
  .container .left-p {
    padding-left: 24px; }
  .container .right-p {
    padding-right: 24px; }
  .container .arround-p {
    padding: 24px; }
  .container .no-p {
    padding: 0; }

.min-vh-100 {
  min-height: 100vh; }

.h-100 {
  height: 100%; }

.h-1200 {
  height: 1200px; }

.no-flex {
  flex: none !important; }

.container-fluid {
  width: 100%; }

.container, .mainpage, .grid-mainpage .row-mainpage {
  width: 100%; }

.negative-x-15 {
  margin-left: -15px;
  margin-right: -15px; }

.flex-container {
  display: flex; }
  .flex-container.justify-content-between {
    justify-content: space-between; }
  .flex-container.align-center {
    align-items: center; }
  .flex-container .flex-grow {
    flex-grow: 1; }

.inline {
  display: inline; }

.inline-block {
  display: inline-block; }

.block {
  display: block; }

.divider {
  position: relative; }
  .divider .divider-text {
    position: absolute;
    top: calc(-0.75em - 4px);
    left: 50%;
    background: white;
    padding: 4px; }

.page-padding {
  padding: 0px;
  background-color: #f1f1f1; }

.layout-content-container {
  width: 100%;
  margin-bottom: 62px; }

.sidebar {
  background-color: #FFFFFF;
  border-right: #f1f1f1 solid 1px; }
  .sidebar .row-sidebar {
    border-style: solid;
    border-color: #EAEDF3;
    border-width: 1px 0px 0px 0px; }
  .sidebar .sidebar-img {
    border: none;
    height: 70px;
    padding: 5px 0; }
    .sidebar .sidebar-img img {
      max-height: 100%;
      margin: auto;
      display: block;
      padding: 15px; }
  .sidebar .sidebar-profile {
    padding: 24px;
    text-align: center; }
    .sidebar .sidebar-profile .dropdown .btn {
      font-weight: bold; }
    .sidebar .sidebar-profile .dropdown ul {
      border-radius: 0;
      text-align: center;
      width: 100%; }
      .sidebar .sidebar-profile .dropdown ul p {
        color: #333333; }
    .sidebar .sidebar-profile p {
      color: #838383; }
  .sidebar .sidebar-buttons {
    padding: 24px; }
  .sidebar .sidebar-main {
    padding: 0px 24px 24px 24px;
    flex: 1 0 auto; }

.mainpage {
  background-color: #FFFFFF; }
  .mainpage .grid-mainpage {
    min-height: 100%; }
  .mainpage .mainpage-header {
    background-color: #FFFFFF; }
    .mainpage .mainpage-header .btn {
      color: #FFFFFF;
      padding: 0 0 0 24px;
      background-color: transparent; }
      .mainpage .mainpage-header .btn:hover, .mainpage .mainpage-header .btn:focus, .mainpage .mainpage-header .btn:active {
        border: none;
        box-shadow: none;
        outline: none; }
    .mainpage .mainpage-header .form-group {
      margin: 0;
      display: inline-block;
      width: 80%; }
      .mainpage .mainpage-header .form-group input {
        height: 70px;
        border: none;
        background-color: transparent;
        border-radius: 0px;
        color: #FFFFFF; }
        .mainpage .mainpage-header .form-group input:focus {
          border: none;
          box-shadow: none; }
      .mainpage .mainpage-header .form-group ::-webkit-input-placeholder {
        /* Edge */
        color: #FFFFFF; }
      .mainpage .mainpage-header .form-group :-ms-input-placeholder {
        /* Internet Explorer */
        color: #FFFFFF; }
      .mainpage .mainpage-header .form-group ::-moz-placeholder {
        color: #FFFFFF; }
      .mainpage .mainpage-header .form-group ::-ms-input-placeholder {
        color: #FFFFFF; }
      .mainpage .mainpage-header .form-group ::placeholder {
        color: #FFFFFF; }
  .mainpage .mainpage-content {
    flex: 1 0 auto; }
  .mainpage .mainpage-footer {
    display: block;
    justify-content: center;
    align-items: center; }
    .mainpage .mainpage-footer label {
      margin: 0; }
    .mainpage .mainpage-footer > div {
      padding: 0 24px; }

.footer-text {
  text-align: center;
  margin-bottom: 10px; }

/*lay-out*/
.mainpage-footer {
  margin-top: 10px;
  margin-bottom: 10px; }

.container-fluid > div.row:nth-of-type(2) {
  min-height: calc(100vh - 132px);
  margin-top: 70px; }
  @media (min-width: 992px) {
    .container-fluid > div.row:nth-of-type(2) {
      margin-top: 0px;
      min-height: calc(100vh - 62px); } }

.container-fluid > div.row:nth-of-type(1) {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999; }
  @media (min-width: 992px) {
    .container-fluid > div.row:nth-of-type(1) {
      width: auto; }
      .container-fluid > div.row:nth-of-type(1) .sidebar {
        width: 300px; }
      .container-fluid > div.row:nth-of-type(1) .mainpage {
        display: none; } }

@media (min-width: 992px) {
  .container-fluid .sidebar-menu {
    width: 300px;
    position: fixed;
    top: 70px;
    left: 0;
    height: 100%;
    z-index: 10; }
  .container-fluid > div.row:nth-of-type(2) {
    margin-left: 285px; }
  .container-fluid .sidebar-logout-menu {
    position: fixed;
    bottom: 0;
    width: 300px;
    z-index: 10;
    min-height: 62px; }
    .container-fluid .sidebar-logout-menu .sidebar-logout {
      padding: 0px 24px; }
      .container-fluid .sidebar-logout-menu .sidebar-logout li {
        border: none !important; }
  .container-fluid .col-footer {
    position: fixed;
    bottom: 0px;
    min-height: 62px; } }
  @media (min-width: 992px) and (min-width: 992px) {
    .container-fluid .col-footer {
      margin-left: 300px;
      width: calc(100vw - 300px); } }

form .form-group,
form .input-group {
  margin-bottom: 25px; }
  form .form-group .form-control input ::-webkit-input-placeholder, form .input-group .form-control input ::-webkit-input-placeholder {
    color: black; }
  form .form-group .form-control input ::-moz-placeholder, form .input-group .form-control input ::-moz-placeholder {
    color: black; }
  form .form-group .form-control input :-ms-input-placeholder, form .input-group .form-control input :-ms-input-placeholder {
    color: black; }
  form .form-group .form-control input ::-ms-input-placeholder, form .input-group .form-control input ::-ms-input-placeholder {
    color: black; }
  form .form-group .form-control input ::placeholder,
  form .input-group .form-control input ::placeholder {
    color: black; }
  form .form-group input,
  form .form-group select,
  form .form-group textarea,
  form .input-group input,
  form .input-group select,
  form .input-group textarea {
    padding: 12px;
    height: auto;
    font-size: 1.4rem;
    border-radius: 0;
    min-height: 46px;
    border: 1px solid #E5E6EA;
    margin-bottom: 20px; }
    form .form-group input[type='checkbox'],
    form .form-group select[type='checkbox'],
    form .form-group textarea[type='checkbox'],
    form .input-group input[type='checkbox'],
    form .input-group select[type='checkbox'],
    form .input-group textarea[type='checkbox'] {
      min-height: 0px; }
    form .form-group input.error,
    form .form-group select.error,
    form .form-group textarea.error,
    form .input-group input.error,
    form .input-group select.error,
    form .input-group textarea.error {
      border-color: red; }

form input[type='checkbox'].do-focus {
  outline: 2px solid #66afe9; }

form .select2-container--default .select2-selection {
  min-height: 46px;
  border-radius: 0;
  border: 1px solid #E5E6EA; }

form .select2-container--default .select2-selection__rendered {
  color: #333333 !important;
  line-height: 46px !important; }

form .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 44px; }

label,
.label {
  line-height: 17px;
  font-size: 1.5rem;
  min-height: 15px;
  color: #4a4a4a;
  letter-spacing: 0.25px;
  font-weight: 500;
  padding: 0; }
  label.error,
  .label.error {
    color: red;
    font-weight: 300;
    font-size: 1.2rem; }
  label .required-star,
  .label .required-star {
    font-weight: 700;
    color: red; }

.absolute-star .required-star {
  position: absolute;
  margin-left: 3px; }

.form-data-input-group {
  margin-bottom: 20px; }
  .form-data-input-group .data-collector {
    margin-bottom: 10px; }
    .form-data-input-group .data-collector .input-group .input-group-addon:first-child {
      background-color: #fff;
      border: none;
      padding: 6px 12px 6px 0px;
      width: 40px;
      overflow: hidden; }
    .form-data-input-group .data-collector .input-group .input-group-addon:last-child {
      background-color: #fff; }
    .form-data-input-group .data-collector .input-group input:disabled {
      border-right: none; }
      .form-data-input-group .data-collector .input-group input:disabled + .input-group-addon {
        background-color: #eee; }
    .form-data-input-group .data-collector.disabled select {
      background-color: #eee;
      pointer-events: none; }

.shipment-form form .form-group {
  margin-bottom: 10px; }

.login-panel.panel {
  border: none;
  border-radius: 0px;
  box-shadow: none; }
  .login-panel.panel .panel-body {
    padding: 0px; }
    .login-panel.panel .panel-body .login-row {
      display: flex;
      align-items: center;
      flex-flow: row; }
      .login-panel.panel .panel-body .login-row .label-link a {
        color: rgba(51, 51, 51, 0.5);
        font-weight: 400; }
      .login-panel.panel .panel-body .login-row .login-col {
        padding-left: 45px; }
      @media (max-width: 991px) {
        .login-panel.panel .panel-body .login-row {
          flex-flow: column-reverse; }
          .login-panel.panel .panel-body .login-row .login-image {
            width: 100%;
            content: url(https://assets.bettyblocks.com/ddeab9ef3ff64483ab2cefa5f62b2553_assets/files/Login-image-horizontal.png); }
          .login-panel.panel .panel-body .login-row .login-col {
            padding: 45px; } }
      @media (max-width: 575px) {
        .login-panel.panel .panel-body .login-row .login-col {
          padding: 30px; } }
  @media (max-width: 991px) {
    .login-panel.panel {
      margin-top: 20px; } }

.container-fluid.login {
  flex-direction: unset !important;
  align-items: center; }

.dashboard-main {
  padding: 0px; }

.dashboard-side {
  padding-left: 24px;
  padding-right: 0px; }
  .dashboard-side div[class^="col-"] {
    margin-bottom: 24px; }
  .dashboard-side .grid-diesel {
    background-position: right bottom;
    background-repeat: no-repeat;
    background-color: #FDBB2F;
    padding: 24px; }
    .dashboard-side .grid-diesel p, .dashboard-side .grid-diesel h1 {
      color: #FFFFFF; }
    .dashboard-side .grid-diesel p {
      margin: 0px; }
    .dashboard-side .grid-diesel h1 {
      margin-top: 10px; }
  .dashboard-side .grid-message {
    padding: 24px;
    border: solid 1px #E5E6EA;
    background-color: #FFFFFF; }
    .dashboard-side .grid-message h1 {
      margin-top: 0px;
      margin-bottom: 8px; }

table.table {
  text-align: left;
  border-collapse: collapse; }
  table.table > thead > tr > th, table.table > thead > tr > td {
    font-weight: 300;
    padding: 1rem;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 0.5px;
    color: rgba(51, 51, 51, 0.7); }
  table.table > tbody > tr td {
    padding: 15px 10px; }
    table.table > tbody > tr td a {
      color: inherit; }
    table.table > tbody > tr td .btn {
      padding: 10px 20px;
      margin: -10px; }
    table.table > tbody > tr td p {
      margin-bottom: 0; }

@media screen and (max-width: 600px) {
  .responsive-table thead {
    display: none; }
  .responsive-table tbody > tr {
    padding: 5px;
    display: block;
    margin: .5rem 0 1rem;
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
    .responsive-table tbody > tr > td {
      display: block;
      text-align: right;
      border-bottom: 1px dotted #ccc;
      border-top: none; }
      .responsive-table tbody > tr > td:last-child {
        border-bottom: 0; }
      .responsive-table tbody > tr > td:before {
        content: attr(data-label);
        float: left;
        font-weight: 300;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 0.5px;
        color: rgba(51, 51, 51, 0.7); } }

.panel-table, table.panel-datatable {
  margin-left: -15px;
  margin-right: -15px;
  max-width: calc(100% + 30px);
  width: calc(100% + 30px); }

.documents-table td {
  width: 50%; }

.panel-datatable-filter .dataTables_filter {
  position: relative;
  top: -75px; }

.nav > li {
  border-width: 0px 0px 1px 0px;
  border-color: #EAEDF3;
  border-style: solid;
  padding: 10px 0; }
  .nav > li a {
    padding: 10px 0px;
    color: #838383;
    font-weight: 600; }
    .nav > li a i {
      color: inherit;
      margin-right: 10px; }
    .nav > li a:hover {
      color: #1a1a1a;
      background-color: transparent; }
      .nav > li a:hover i {
        color: #1a1a1a; }
  .nav > li a.active, .nav > li a.active i {
    color: #7BC144; }
    .nav > li a.active:hover, .nav > li a.active i:hover {
      color: #639e34;
      background-color: transparent; }
      .nav > li a.active:hover i, .nav > li a.active i:hover i {
        color: #639e34; }

/* mobile nav*/
@media only screen and (max-width: 991px) {
  .hamburger-menu {
    position: fixed;
    top: 10px;
    right: 10px;
    background-color: #FFFFFF;
    height: 50px;
    width: 50px;
    cursor: pointer;
    transition: 0.3s;
    z-index: 9999; }
    .hamburger-menu span {
      position: absolute;
      height: 3px;
      width: 25px;
      background-color: #333333;
      top: 50%;
      left: 50%;
      -webkit-transform: translate(-50%, -50%);
              transform: translate(-50%, -50%);
      transition: 0.3s; }
      .hamburger-menu span:before {
        content: '';
        position: absolute;
        top: -8px;
        background-color: #333333;
        height: 3px;
        width: 25px;
        transition: 0.3s; }
      .hamburger-menu span:after {
        content: '';
        position: absolute;
        top: 8px;
        background-color: #333333;
        height: 3px;
        width: 25px;
        transition: 0.3s; }
    .hamburger-menu.menu-active span {
      background-color: transparent; }
      .hamburger-menu.menu-active span:before {
        -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
        top: 0; }
      .hamburger-menu.menu-active span:after {
        -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
        top: 0; }
  .sidebar-menu {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    transition: 0.5s;
    top: 70px;
    right: -300px;
    width: 300px;
    position: fixed;
    z-index: 999;
    height: 100%; }
    .sidebar-menu.menu-active {
      -webkit-transform: translateX(-300px);
              transform: translateX(-300px);
      transition: 0.5s; }
    .sidebar-menu .menu-listing {
      padding: 0;
      margin: 0;
      text-align: right; }
      .sidebar-menu .menu-listing li {
        display: inline-block; }
        .sidebar-menu .menu-listing li a {
          background-color: #fff;
          color: #262626;
          display: block;
          font-size: 1rem;
          height: 50px;
          line-height: 50px;
          padding: 0 20px;
          letter-spacing: 1px;
          text-decoration: none;
          transition: 0.5s; }
          .sidebar-menu .menu-listing li a:hover {
            background-color: #262626;
            color: #fff;
            transition: 0.5s; }
  .sidebar-logout-menu {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    transition: 0.5s;
    position: fixed;
    right: -300px;
    width: 300px;
    z-index: 999;
    bottom: 0;
    height: 62px; }
    .sidebar-logout-menu.menu-active {
      -webkit-transform: translateX(-300px);
              transform: translateX(-300px);
      transition: 0.5s; }
    .sidebar-logout-menu .sidebar-logout {
      padding: 0 15px;
      height: 62px; }
  .layout-content-container.overlay:before {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 70px;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 2;
    content: " "; } }

/* navigation in afspraak detaild */
.inner-navigation {
  background: #FFFFFF;
  padding: 15px 25px 0px; }
  .inner-navigation .btn {
    padding: 10px 15px;
    background: #FFFFFF;
    color: #EE7600; }
    .inner-navigation .btn.disabled {
      padding: 9px 14px;
      color: #BBBBBB;
      border: none; }

.tooltip-custom {
  display: inline-block;
  width: 21px;
  height: 21px;
  background-color: #7BC144;
  color: #FFFFFF;
  border-radius: 100%;
  outline: none;
  text-align: center;
  position: relative;
  margin-left: 10px;
  margin-right: 10px;
  padding-top: 2px;
  cursor: pointer;
  font-size: 14px;
  line-height: 21px; }
  .tooltip-custom:hover .tooltip-text {
    visibility: visible; }
  .tooltip-custom .tooltip-text {
    visibility: hidden;
    background-color: #7BC144;
    color: #FFFFFF;
    text-align: left;
    border-radius: 6px;
    padding: 10px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    max-width: 350px;
    position: absolute;
    top: 150%;
    margin-left: -5px;
    z-index: 3;
    padding: 20px; }
    .tooltip-custom .tooltip-text:after {
      content: "";
      position: absolute;
      bottom: 100%;
      left: 8px;
      border-width: 5px;
      border-style: solid;
      border-color: transparent;
      border-bottom-color: #7BC144; }

.panel {
  border: 1px solid #EAECEE;
  border-radius: 10px; }
  .panel .panel-heading {
    padding: 25px 15px;
    border-bottom: 1px solid #EAECEE;
    background-color: #FFFFFF;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px; }
    .panel .panel-heading h3.panel-title {
      line-height: 26px;
      font-size: 22px;
      font-weight: 400; }
    .panel .panel-heading .download-link {
      color: #7BC144;
      text-decoration: underline;
      margin-left: 15px;
      font-weight: bold; }
  .panel.smaller-spacing .panel-heading {
    padding: 15px 15px; }
  .panel .panel-footer {
    padding: 15px;
    background: #FFFFFF; }
  .panel.shipment-tracking-panel h3 {
    margin-bottom: 0; }
  .panel.no-right .panel-body {
    padding-right: 0; }
  .panel.no-bottom .panel-body {
    padding-bottom: 0; }
  .panel.no-left .panel-body {
    padding-left: 0; }
  .panel.no-top .panel-body {
    padding-top: 0; }
  .panel #arrived-panel {
    position: absolute;
    top: 34px;
    left: 150px; }

.accordion-component .accordion-row .accordion-title {
  padding: 20px 15px;
  position: relative;
  margin-bottom: 0;
  cursor: pointer;
  margin: -15px -15px 0 -15px;
  border-top: 1px solid #EAECEE;
  border-bottom: 1px solid #EAECEE; }
  .accordion-component .accordion-row .accordion-title h3 {
    font-size: 14px;
    line-height: 16px;
    color: #4A4A4A;
    margin-bottom: 0;
    pointer-events: none; }
  .accordion-component .accordion-row .accordion-title .no-select {
    pointer-events: none; }
  .accordion-component .accordion-row .accordion-title:after {
    content: '';
    right: 15px;
    top: 50%;
    margin-top: -10px;
    background-size: contain;
    position: absolute;
    height: 20px;
    width: 20px;
    transition: 0.2s; }
  .accordion-component .accordion-row .accordion-title.closed:after {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg); }

.accordion-component .accordion-row .accordion-content {
  padding: 0 0 15px 0;
  margin: 0 -15px; }
  .accordion-component .accordion-row .accordion-content.no-horizontal-padding {
    padding-left: 0;
    padding-right: 0; }

.fileupload-expander .fileupload-dragzone {
  padding: 20px;
  justify-content: center;
  text-align: center;
  border: 2px #EE7600 dashed; }
  .fileupload-expander .fileupload-dragzone .fileupload__button {
    cursor: pointer; }
    .fileupload-expander .fileupload-dragzone .fileupload__button .fileupload__button-text {
      padding: 15px 30px;
      background: #EE7600;
      border-radius: 25px;
      display: inline-block;
      color: #FFFFFF;
      text-transform: uppercase;
      font-family: "Open Sans", sans-serif;
      letter-spacing: normal;
      font-weight: 700; }
  .fileupload-expander .fileupload-dragzone .dz-success-mark, .fileupload-expander .fileupload-dragzone .dz-error-mark {
    display: none; }

.vragenlijst-sectie, .metinglijst-sectie {
  background: #FFFFFF;
  padding: 20px;
  margin-bottom: 20px;
  margin-right: 210px; }
  .vragenlijst-sectie .vragenlijst-label, .vragenlijst-sectie .metinglijst-label, .metinglijst-sectie .vragenlijst-label, .metinglijst-sectie .metinglijst-label {
    padding-right: 15px; }

@media (min-width: 768px) {
  .vragenlijst-vraag, .metinglijst-meting {
    display: flex; }
  .vragenlijst-label, .vragenlijst-input, .metinglijst-label, .metinglijst-input {
    width: 50%; } }

@media (min-width: 1200px) {
  .vragenlijst-sectie, .metinglijst-sectie {
    margin-right: 210px; }
  .vragenlijst-label, .metinglijst-label {
    width: 50%; } }

@media (max-width: 991px) {
  .vragenlijst-sectie, .metinglijst-sectie {
    width: 100%; } }

.vragenlijst-toelichting p, .metinglijst-toelichting p {
  margin-bottom: 5px;
  font-size: 12px; }

.vragenlijst-input textarea, .vragenlijst-input select, .vragenlijst-input input[type="number"], .metinglijst-input textarea, .metinglijst-input select, .metinglijst-input input[type="number"] {
  max-width: 100%;
  display: block;
  padding: 3px;
  font-size: 1.4rem;
  border-radius: 0;
  border: 1px solid #E5E6EA;
  margin-bottom: 10px;
  color: #555;
  background-color: #fff;
  background-image: none;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; }
  .vragenlijst-input textarea:focus, .vragenlijst-input select:focus, .vragenlijst-input input[type="number"]:focus, .metinglijst-input textarea:focus, .metinglijst-input select:focus, .metinglijst-input input[type="number"]:focus {
    border-color: #66afe9;
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 0 8px rgba(102, 175, 233, 0.6); }

p.tekstoptie {
  margin-top: 20px;
  font-style: italic;
  padding-left: 5px;
  border-left: 2pt solid #999; }

table.datatable-component > tbody > tr:hover {
  background-color: #F9FAF9;
  cursor: pointer; }

table.datatable-component > thead > tr > th,
table.datatable-component > tbody > tr > td {
  border: none;
  border-top: 1px solid #ddd;
  vertical-align: middle; }

table.datatable-component > thead > tr > th {
  font-size: 12px;
  line-height: 14px;
  text-transform: uppercase;
  color: rgba(74, 74, 74, 0.7);
  padding-top: 15px;
  padding-bottom: 15px; }
  table.datatable-component > thead > tr > th:last-of-type {
    padding-right: 40px; }

table.datatable-component > tbody > tr > td {
  font-size: 14px;
  line-height: 16px;
  color: rgba(74, 74, 74, 0.8);
  padding: 15px 18px; }
  table.datatable-component > tbody > tr > td.bold {
    font-weight: 700; }
  table.datatable-component > tbody > tr > td.green {
    color: #7BC144; }

.dataTables_filter {
  margin-left: 30px; }
  .dataTables_filter label {
    margin-bottom: 0; }
  .dataTables_filter input {
    border: solid 1px #E2E5ED;
    padding: 10px 20px;
    font-size: 14px;
    color: rgba(74, 74, 74, 0.8);
    line-height: 14px;
    font-weight: 400;
    width: 203px; }

@media screen and (max-width: 640px) {
  .dataTables_wrapper .dataTables_filter {
    float: none;
    text-align: right; }
  .dataTables_wrapper .dataTables_length {
    float: none;
    text-align: left; } }

/* Historische Vaccinaties component*/
.historische-vaccinaties.afspraak h5 {
  font-size: 16px;
  font-weight: bold;
  border-bottom: 2px solid #EE7600;
  padding: 5px;
  margin: 5px; }

.historische-vaccinaties.afspraak .vaccin_container:after {
  content: "";
  display: table;
  clear: both; }

.historische-vaccinaties.afspraak .vaccin_container .vaccin_item {
  border: solid 1px #ee7600;
  border-radius: 10px;
  margin: 5px;
  padding: 5px;
  width: calc(33% - 10px);
  float: left;
  min-height: 100px; }

.status-tag {
  padding: 2px 5px;
  border-radius: 5px;
  color: white;
  display: inline-block;
  font-size: 12px; }
  .status-tag.status-open {
    background-color: #262A4A; }
  .status-tag.status-no-show {
    background-color: #ED0344; }
  .status-tag.status-afg-lab {
    background-color: #FBBF44; }
  .status-tag.status-def-afg {
    background-color: #03C383; }
  .status-tag.status-n-gesl {
    background-color: #EF6A32; }

#lds-spinner {
  display: block;
  position: fixed;
  width: 80px;
  height: 80px;
  top: calc(50% - 40px);
  right: calc(50% - 40px); }
  #lds-spinner div {
    -webkit-transform-origin: 40px 40px;
            transform-origin: 40px 40px;
    -webkit-animation: lds-spinner 1.2s linear infinite;
            animation: lds-spinner 1.2s linear infinite; }
    #lds-spinner div:after {
      content: " ";
      display: block;
      position: absolute;
      top: 3px;
      left: 37px;
      width: 6px;
      height: 18px;
      border-radius: 20%;
      background: #EE7600; }
    #lds-spinner div:nth-child(1) {
      -webkit-transform: rotate(0deg);
              transform: rotate(0deg);
      -webkit-animation-delay: -1.1s;
              animation-delay: -1.1s; }
    #lds-spinner div:nth-child(2) {
      -webkit-transform: rotate(30deg);
              transform: rotate(30deg);
      -webkit-animation-delay: -1s;
              animation-delay: -1s; }
    #lds-spinner div:nth-child(3) {
      -webkit-transform: rotate(60deg);
              transform: rotate(60deg);
      -webkit-animation-delay: -0.9s;
              animation-delay: -0.9s; }
    #lds-spinner div:nth-child(4) {
      -webkit-transform: rotate(90deg);
              transform: rotate(90deg);
      -webkit-animation-delay: -0.8s;
              animation-delay: -0.8s; }
    #lds-spinner div:nth-child(5) {
      -webkit-transform: rotate(120deg);
              transform: rotate(120deg);
      -webkit-animation-delay: -0.7s;
              animation-delay: -0.7s; }
    #lds-spinner div:nth-child(6) {
      -webkit-transform: rotate(150deg);
              transform: rotate(150deg);
      -webkit-animation-delay: -0.6s;
              animation-delay: -0.6s; }
    #lds-spinner div:nth-child(7) {
      -webkit-transform: rotate(180deg);
              transform: rotate(180deg);
      -webkit-animation-delay: -0.5s;
              animation-delay: -0.5s; }
    #lds-spinner div:nth-child(8) {
      -webkit-transform: rotate(210deg);
              transform: rotate(210deg);
      -webkit-animation-delay: -0.4s;
              animation-delay: -0.4s; }
    #lds-spinner div:nth-child(9) {
      -webkit-transform: rotate(240deg);
              transform: rotate(240deg);
      -webkit-animation-delay: -0.3s;
              animation-delay: -0.3s; }
    #lds-spinner div:nth-child(10) {
      -webkit-transform: rotate(270deg);
              transform: rotate(270deg);
      -webkit-animation-delay: -0.2s;
              animation-delay: -0.2s; }
    #lds-spinner div:nth-child(11) {
      -webkit-transform: rotate(300deg);
              transform: rotate(300deg);
      -webkit-animation-delay: -0.1s;
              animation-delay: -0.1s; }
    #lds-spinner div:nth-child(12) {
      -webkit-transform: rotate(330deg);
              transform: rotate(330deg);
      -webkit-animation-delay: 0s;
              animation-delay: 0s; }

@-webkit-keyframes lds-spinner {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

@keyframes lds-spinner {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }

table.dashboard {
  background: white;
  margin-top: 10px;
  border: 1px solid #ddd;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content; }
  table.dashboard th, table.dashboard td {
    padding: 8px;
    line-height: 1.42857143;
    border-top: 1px solid #ddd; }
  table.dashboard thead th:nth-child(1) {
    width: 300px; }
  table.dashboard thead th:not(:nth-child(1)) {
    width: 150px; }
  table.dashboard tbody tr th {
    width: 300px; }
  table.dashboard tbody tr td {
    width: 150px;
    text-align: center; }
  table.dashboard.planningsgraad tbody tr td.nog-inplannen {
    background: #f8e8ff;
    color: purple; }
  table.dashboard.planningsgraad tbody tr td.ingepland-maar-afwezig {
    background: #ffdada;
    color: red; }
  table.dashboard.planningsgraad tbody tr td div {
    max-width: 150px;
    position: relative;
    height: 20px;
    display: inline-block; }
    table.dashboard.planningsgraad tbody tr td div.afspraken {
      background-color: #a3fbc2; }
      table.dashboard.planningsgraad tbody tr td div.afspraken:hover {
        background-color: #64ea94; }
        table.dashboard.planningsgraad tbody tr td div.afspraken:hover .hover-info {
          border: 1px solid #64ea94;
          visibility: visible;
          color: #64ea94; }
          table.dashboard.planningsgraad tbody tr td div.afspraken:hover .hover-info:after {
            border-color: #64ea94 transparent transparent transparent; }
    table.dashboard.planningsgraad tbody tr td div.intern {
      background-color: #ac9ff6; }
      table.dashboard.planningsgraad tbody tr td div.intern:hover {
        background-color: #9c6de6; }
        table.dashboard.planningsgraad tbody tr td div.intern:hover .hover-info {
          border: 1px solid #9c6de6;
          visibility: visible;
          color: #9c6de6; }
          table.dashboard.planningsgraad tbody tr td div.intern:hover .hover-info:after {
            border-color: #9c6de6 transparent transparent transparent; }
    table.dashboard.planningsgraad tbody tr td div.open {
      background-color: #F0A58F; }
      table.dashboard.planningsgraad tbody tr td div.open:hover {
        background-color: #EA7369; }
        table.dashboard.planningsgraad tbody tr td div.open:hover .hover-info {
          border: 1px solid #EA7369;
          visibility: visible;
          color: #EA7369; }
          table.dashboard.planningsgraad tbody tr td div.open:hover .hover-info:after {
            border-color: #EA7369 transparent transparent transparent; }
    table.dashboard.planningsgraad tbody tr td div .hover-info {
      visibility: hidden;
      position: absolute;
      background: white;
      text-align: center;
      height: 60px;
      width: 100px;
      margin-left: -50px;
      padding: 8px;
      top: -70px;
      left: 50%;
      border-radius: 5px; }
      table.dashboard.planningsgraad tbody tr td div .hover-info:after {
        content: "";
        position: absolute;
        top: 100%;
        left: 50%;
        margin-left: -5px;
        border-width: 5px;
        border-style: solid; }
  table.dashboard.rooster thead {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: #666;
    color: #fff; }
  table.dashboard.rooster tbody tr th {
    position: -webkit-sticky;
    position: sticky;
    left: 300px;
    z-index: 2;
    background-color: #666;
    color: #fff; }


/*# sourceMappingURL=app.css.map*/