.navbar-brand {
  background-image: url(data:image/png;base64,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);
}
body {
  overflow: hidden;
  color: #414042;
}
img.icon-user {
  width: 40px;
  height: 40px;
  border-radius: 10px;
}
a:not([href]):not([tabindex]):focus,
a:not([href]):not([tabindex]):hover {
  color: inherit;
}
button,
a {
  cursor: pointer;
  color: #414042;
}
button.btn {
  border-radius: 3px;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}
.btn-success {
  color: #fff;
  background-color: #2c6b56;
  border-color: #2c6b56;
}
.btn-success:disabled {
  background-color: #83a45f;
  border-color: #83a45f;
}
.btn-tag {
  margin-right: 3px;
  margin-bottom: 3px;
  padding: 3px 10px;
  border-radius: 2px;
}
button.btn-card {
  width: calc(100% - 10px) !important;
  margin: 5px;
  border: none;
  border-radius: 4px;
  box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
  min-height: 50px;
  background: #0072b4;
  color: #fff;
}
button.btn-card > * {
  color: #fff;
}
button.btn-card:hover {
  background: #008fd5;
  border-color: #008fd5;
}
.badge-primary {
  background-color: #0072b4;
}
.btn-primary {
  background: #0072b4;
  border-color: #0072b4;
  color: #fff;
}
.btn-primary > * {
  color: #fff;
}
.btn-primary:hover {
  background: #008fd5;
  border-color: #008fd5;
}
.form-check {
  display: block;
  position: relative;
  padding-left: 35px;
  user-select: none;
  /* Hide the browser's default checkbox */
}
.form-check input {
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.form-check label {
  margin-left: 5px;
}
label.btn-primary {
  background-color: #008fd5;
  border-color: #008fd5;
}
button:focus,
a:focus {
  outline: none;
}
hr {
  border-top: 1px solid #034107;
}
a:hover {
  text-decoration: none !important;
  color: inherit;
}
.full-size {
  width: 100%;
  height: 100%;
}
.navbar {
  padding: 0;
  height: 55px;
  flex-flow: row;
  align-items: flex-start;
}
.navbar .navbar-brand {
  margin: 0;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 85% auto;
  border: none;
  width: 200px;
  height: 100%;
}
.navbar .dropdown-menu {
  position: absolute;
  right: 0;
  left: auto;
  border-radius: 0;
}
.navbar .dropdown-menu * {
  color: #000;
}
.app-body {
  height: calc(100vh - 55px);
  position: relative;
  display: flex;
}
.app-body .maincontainer {
  display: flex;
  height: 100%;
  width: 100%;
  position: relative;
  overflow: hidden;
}
nav.bg-agricolus-header {
  background-color: #0072b4;
  background: linear-gradient(to top, #0072b4, #008fd5);
  color: #fff;
  align-items: center;
}
nav.bg-agricolus-header .title {
  flex: 1;
  margin-left: 30px;
}
nav.bg-agricolus-header .header-tools ul {
  align-items: center;
}
nav.bg-agricolus-header .header-tools ul li {
  height: auto;
}
nav.bg-agricolus-header .header-tools ul .nav-link {
  display: flex;
  align-items: center;
}
nav .navbar-toggler {
  width: 50px;
  font-size: 1.09375rem;
  line-height: 1;
  background: transparent;
  border: 1px solid transparent;
  display: inline-block;
  line-height: 46px;
}
nav .navbar-toggler * {
  color: #fff;
  line-height: 1px;
}
nav .header-tools {
  color: #fff;
}
nav .header-tools * {
  color: #fff;
}
nav .header-tools ul {
  flex-direction: row;
}
nav .header-tools ul li {
  height: 40px;
  margin: 0 10px;
}
.fa-x1-5 {
  font-size: 1.5em;
}
.main {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  height: 100%;
  background-size: cover;
  background-color: #e6f6ff;
  background-position: center, center;
  position: relative;
  box-shadow: 2px 2px 6px rgba(60, 60, 60, 0.4) inset, -2px -2px 6px rgba(60, 60, 60, 0.4) inset;
}
.main > .scrollable {
  padding-bottom: 50px;
}
.margin-top-30 {
  margin-top: 30px;
}
.margin-top-10 {
  margin-top: 10px;
}
.margin-bottom-10 {
  margin-bottom: 10px;
}
.margin-top-bottom-30 {
  margin-top: 30px;
  margin-bottom: 30px;
}
.progress {
  background-color: #6a6a6a;
  border-radius: 0;
}
.container-fluid.scrollable {
  height: 100%;
  overflow-y: scroll;
}
.container-fluid.scrollable::-webkit-scrollbar {
  width: 7px;
}
.container-fluid.scrollable::-webkit-scrollbar-thumb {
  background: linear-gradient(to left, #a61a32, #c9243f);
}
.scrollable {
  height: 100%;
  overflow-y: scroll;
}
.scrollable::-webkit-scrollbar {
  width: 7px;
}
.scrollable::-webkit-scrollbar-thumb {
  background: linear-gradient(to left, #a61a32, #c9243f);
}
.pointer {
  cursor: pointer;
}
.custom-checkbox .custom-control-label::before {
  background: white;
}
.full-height {
  height: 100%;
}
.flex-column {
  display: flex;
  flex-flow: column;
}
.btn-outline-secondary.custom-disabled.active {
  color: #fff;
  background-color: #6c757d;
  border-color: #6c757d;
  opacity: 0.65;
}
.header-options {
  display: flex;
  flex-flow: row wrap;
  position: relative;
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
  margin-top: 10px;
  width: 100%;
}
.header-options .card-body {
  width: 100%;
}
.header-options hr {
  border-color: transparent;
}
.header-options > label {
  min-width: 100%;
  padding: 0 10px;
  color: #5b5b5b;
}
.header-options button {
  margin: 5px;
  flex-basis: 10%;
  flex-grow: 1;
  background-color: #5a845c;
  color: #fff;
}
.header-options button.active {
  background-color: #2c6b56;
  box-shadow: 0 0 0 0.2rem rgba(44, 107, 86, 0.3);
}
.header-options:after {
  content: '';
  position: absolute;
  top: 0;
  right: 30px;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  border-bottom-color: #fff;
  border-top: 0;
  border-right: 0;
  margin-left: -8px;
  margin-top: -16px;
}
.header-options.position-3:after {
  right: 120px;
}
.header-options.position-2:after {
  right: 80px;
}
.options-toggles {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  padding-top: 10px;
}
.options-toggles .togglebutton {
  margin-right: 15px;
  flex: 0 0 120px;
}
.options-toggles .togglebutton.vertical,
.options-toggles.vertical .togglebutton {
  display: flex;
  flex-wrap: nowrap;
  flex-flow: column;
  align-items: center;
}
.options-toggles .togglebutton.vertical .form-check-label,
.options-toggles.vertical .togglebutton .form-check-label {
  text-align: center;
}
.options-toggles.can-grow .togglebutton {
  flex: 1 0 120px;
}
.options-toggles.disabled .togglebutton label.form-check-label {
  opacity: 0.7;
}
.options-toggles.disabled .togglebutton span.toggle {
  pointer-events: none;
  cursor: default;
}
.section > header {
  display: flex;
  flex-flow: row wrap;
  min-width: 500px;
  width: calc(100% - 37px);
  position: absolute;
  z-index: 10;
}
.section > header.relative {
  position: relative;
}
.section > header .no-wrap {
  display: flex;
  flex-flow: row nowrap;
  width: 100%;
}
.section > header .title {
  height: 40px;
  order: 1;
  flex-grow: 2;
  flex-shrink: 0;
  flex-basis: 300px;
  background: #fff;
  text-align: center;
  font-weight: 300;
  font-size: 1.4rem;
  border-radius: 0 0 5px 5px;
  max-height: 40px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  text-transform: uppercase;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  padding: 0 10px;
}
.section > header .action-buttons,
.section > header .visibility-buttons {
  display: flex;
  flex-flow: row;
  order: 0;
  flex-basis: 33%;
  flex-shrink: 2;
  margin: 8px 0;
}
.section > header .action-buttons .btn,
.section > header .visibility-buttons .btn,
.section > header .action-buttons button,
.section > header .visibility-buttons button {
  border-radius: 50%;
  border: none;
  width: 40px;
  height: 40px;
  margin: 2px;
  box-shadow: 0px 2px 10px 2px rgba(0, 0, 0, 0.8);
  background-color: #008fd5;
  color: #fff;
}
.section > header .action-buttons .btn:disabled,
.section > header .visibility-buttons .btn:disabled,
.section > header .action-buttons button:disabled,
.section > header .visibility-buttons button:disabled {
  cursor: not-allowed;
}
.section > header .action-buttons span,
.section > header .visibility-buttons span {
  width: 10px;
}
.section > header .action-buttons .active,
.section > header .visibility-buttons .active {
  background-color: #0072b4;
}
.section > header .action-buttons .btn-primary,
.section > header .visibility-buttons .btn-primary {
  width: 50px;
  height: 50px;
  background-color: #0072b4;
}
.section > header .action-buttons {
  flex-flow: row-reverse;
  order: 2;
}
.section > header .action-buttons .btn-primary {
  order: 0;
}
.section .header-spacer {
  height: 54px;
  width: 100%;
}
.form-group.button-bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  flex-wrap: wrap;
}
.form-group.button-bottom .btn {
  flex: 1 0 content;
}
.form-group.button-bottom label {
  flex: 0 1 100%;
}
.main-loader {
  position: relative;
  height: 100vh;
  display: flex;
  flex-flow: column;
  justify-content: center;
  background: 'white';
}
.main-loader:after {
  content: "";
  display: block;
  height: 70px;
  background-image: url("/assets/img/agricolus_logo_official_trasp.png");
  background-repeat: no-repeat;
  background-position: center;
}
.trattor-container {
  position: relative;
  left: calc(50% - 225px);
  width: 400px;
}
.trattor-icon {
  height: 50px !important;
  width: 50px !important;
  flex: 0 0 50px !important;
  font-size: 20px !important;
  background-image: url(/assets/img/icons8-tractor-50_green.png) !important;
  display: block !important;
  color: red;
  position: relative !important;
  animation: rotate 8s linear 1s infinite, walk 0.1s alternate 1s infinite !important;
  -webkit-animation: rotate 8s linear 1s infinite, walk 0.1s alternate 1s infinite !important;
}
@keyframes walk {
  0% {
    top: 0;
  }
  100% {
    top: 3px;
  }
}
@keyframes rotate {
  0% {
    left: 0;
    transform: scaleX(1);
  }
  49.99% {
    left: 100%;
    transform: scaleX(1);
  }
  50% {
    left: 100%;
    transform: scaleX(-1);
  }
  99.99% {
    left: 0;
    transform: scaleX(-1);
  }
  100% {
    left: 0;
    transform: scaleX(1);
  }
}
.sidebar {
  transition: margin-left 0.25s, margin-right 0.25s, width 0.25s, flex 0.25s, -ms-flex 0.25s;
  flex: 0 0 250px;
  order: -1;
  background: #fff;
  z-index: 3;
  position: relative;
  overflow-x: hidden !important;
  height: 100%;
  overflow-y: auto;
  display: flex;
  font-family: Montserrat, sans-serif;
  font-size: 0.9rem;
  flex-flow: column;
  scrollbar-width: thin;
  scrollbar-color: #c9243f #ccc;
}
.sidebar .sidebar-nav {
  flex-grow: 1;
  display: grid;
  grid-template-rows: min-content auto;
}
.sidebar .sidebar-nav .header {
  display: flex;
  flex-flow: row wrap;
}
.sidebar .sidebar-nav .header button {
  border: none;
  background: none;
  font-size: 22px;
  flex: 1;
}
.sidebar .sidebar-nav .header button.active {
  color: #5a845c;
  border-bottom: 2px solid #5a845c;
}
.sidebar .sidebar-nav .RTKLogos {
  width: 220px;
  margin: auto;
  text-align: center;
  margin-bottom: 25px;
}
.sidebar .sidebar-nav .RTKLogos img {
  max-width: 220px;
}
.sidebar::-webkit-scrollbar {
  width: 7px;
}
.sidebar::-webkit-scrollbar-thumb {
  background: linear-gradient(to left, #a61a32, #c9243f);
}
.sidebar .nav .nav-item {
  overflow: hidden;
  width: 250px;
  white-space: nowrap;
  min-height: 40px;
  position: relative;
}
.sidebar .nav .nav-item a {
  color: #222 !important;
  position: relative;
}
.sidebar .nav .nav-item a .badge {
  float: right;
  line-height: 19px;
  min-width: 25px;
  border-radius: 15px;
  position: absolute;
  top: 5px;
  right: 10px;
}
.sidebar .nav .nav-item:hover {
  overflow: visible;
  min-width: 248px;
}
.sidebar .nav .nav-item .nav-link:hover {
  color: #fff !important;
  background: linear-gradient(to right, #c9243f, #c9243f);
  border-right: 2px solid white;
}
.sidebar .nav .nav-item .nav-link:hover i {
  color: #fff;
}
.sidebar .nav .nav-item .nav-link.active,
.sidebar .nav .nav-item .nav-link.active:hover {
  background: linear-gradient(to right, #a61a32, #c9243f);
  color: #fff !important;
  border-right: 2px solid white;
}
.sidebar .nav .nav-item .nav-link.active i,
.sidebar .nav .nav-item .nav-link.active:hover i {
  color: #fff !important;
}
.sidebar .nav .nav-item .nav-link.active .badge,
.sidebar .nav .nav-item .nav-link.active:hover .badge {
  background-color: #fff !important;
  color: #222 !important;
}
.sidebar .nav .nav-item .nav-link i {
  color: #222;
  width: 20px;
  margin: 0 12px 0 0;
  font-size: 20px;
  text-align: center;
}
.sidebar .nav .nav-item .nav-link-disabled {
  color: darkgrey !important;
  background: transparent !important;
  cursor: default !important;
}
.sidebar .nav .nav-item .nav-link-disabled:hover {
  color: darkgrey !important;
}
.sidebar .nav .nav-item .nav-link-disabled .icon-menu {
  color: darkgrey !important;
}
.sidebar .nav .nav-item .nav-link-disabled .icon {
  color: black !important;
  cursor: pointer !important;
  float: right;
  position: absolute;
  top: 11px;
  right: 0;
}
.sidebar .nav .nav-item.nav-dropdown > ol,
.sidebar .nav .nav-item.nav-dropdown > ul {
  -webkit-transition: background-color 0.5s;
  transition: background-color 0.5s;
}
.sidebar .nav .nav-item.nav-dropdown.open > ol,
.sidebar .nav .nav-item.nav-dropdown.open > ul {
  background: rgba(200, 255, 200, 0.15);
  box-shadow: -1px -1px 1px 0 rgba(0, 0, 0, 0.4) inset, 1px 1px 1px 0 rgba(0, 0, 0, 0.4) inset;
}
.sidebar .nav .nav-item.nav-dropdown:hover {
  background: none;
}
.sidebar-minimized .sidebar {
  flex: 0 0 50px;
  width: 50px;
  overflow: overlay;
}
.sidebar-minimized .sidebar .header {
  width: 60px;
}
.sidebar-minimized .sidebar .header button {
  display: block;
  width: 100%;
  padding-right: 15px;
}
.sidebar-minimized .sidebar .VueCarousel {
  display: none !important;
}
.sidebar-minimized .sidebar .nav .nav-item:hover {
  min-width: 0;
}
.sidebar-minimized .sidebar .nav .nav-item .nav-link {
  font-size: 0em;
}
.sidebar-minimized .sidebar .nav .nav-item .icon-preferred {
  left: 37px;
  top: 8px;
}
.sidebar-minimized .sidebar .nav .nav-item .nav-dropdown .nav-link {
  background-color: rgba(0, 0, 0, 0.85);
}
.sidebar-minimized .sidebar .nav .nav-item .badge {
  display: none;
}
button:disabled {
  cursor: not-allowed;
  pointer-events: all !important;
}
.spin-animation {
  animation: rotation 2s linear infinite;
}
@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
.report-editor {
  display: flex;
  flex-flow: row nowrap;
  height: 100%;
  margin-top: 30px;
}
.report-editor .document-editor {
  flex: 1;
  height: 100%;
}
.report-editor .document-editor table {
  width: 100%;
}
.report-editor .document-editor table p {
  margin: 0;
  padding: 0;
  line-height: normal;
}
.report-editor .document-editor .document-editor__editable-container {
  padding: 2rem;
  display: flex;
  flex-flow: column;
  align-items: center;
}
.report-editor .document-editor .document-editor__toolbar {
  /* Make sure the toolbar container is always above the editable. */
  z-index: 1;
  display: flex;
  justify-content: center;
  /* Adjust the look of the toolbar inside the container. */
}
.report-editor .document-editor .document-editor__toolbar .ck-toolbar {
  background: none;
  border: 0;
  border-radius: 0;
}
.report-editor .report-header {
  display: flex;
  flex-flow: column;
  max-width: 1100px;
  min-width: 21cm;
  padding: 1rem;
}
.report-editor .report-header .header-row {
  margin-bottom: 0.5rem;
  display: flex;
  flex-flow: row;
  align-items: center;
  justify-content: space-between;
}
.report-editor .report-header .header-row input,
.report-editor .report-header .header-row select {
  border: none;
  border-radius: 0;
  background: transparent;
  outline: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: none;
}
.report-editor .report-header .header-row .input-group-text {
  background: transparent;
  border: none;
  border-radius: 0;
}
.report-editor .editor-body {
  display: flex;
  flex-flow: column;
  max-width: 1100px;
  min-width: 900px;
  padding: 2rem;
  background-color: white;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
}
.report-editor .editor-body .form-group .form-control {
  border: 0;
  border-bottom: 1px solid #e0e0e0;
  border-radius: 0;
}
.report-editor .editor-body .form-group .form-control:active,
.report-editor .editor-body .form-group .form-control:focus {
  outline: none;
  box-shadow: none;
}
.table-centered td,
.table-centered th {
  text-align: center;
  vertical-align: middle;
}
.modal.for-chart header,
.modal.for-chart footer {
  display: flex;
  flex-flow: row-reverse;
}
.modal.for-chart section {
  display: block;
  overflow: hidden;
}
.modal.for-chart section .chart-container {
  height: 110%;
}
.areal-definition-card {
  width: 100%;
  background-color: white;
  padding: 2rem;
  padding-bottom: 1rem;
  border-radius: 5px;
}
.areal-definition-card .form-row {
  margin-bottom: 1rem;
}
.areal-definition-card .buttons {
  width: 100%;
  display: flex;
  flex-flow: row-reverse;
}
.weather-stations .table td {
  font-size: 1.2rem !important;
}
.weather-stations .table thead td,
.weather-stations .table thead th {
  border: none !important;
  color: #fff;
  font-size: 1.2rem !important;
  font-weight: normal !important;
}
.document-editor {
  /* Set vertical boundaries for the document editor. */
  /* This element is a flex container for easier rendering. */
  display: flex;
  flex-flow: column nowrap;
  /* Set the default font for the "page" of the content. */
  /* Adjust the headings dropdown to host some larger heading styles. */
}
.document-editor .ck-content {
  font: 16px/1.6 "Helvetica Neue", Helvetica, Arial, sans-serif;
  /* Set the styles for "Heading 1". */
  /* Set the styles for "Heading 2". */
  /* Set the styles for "Heading 3". */
  /* Set the styles for "Paragraph". */
  /* Make the block quoted text serif with some additional spacing. */
}
.document-editor .ck-content h2 {
  font-size: 2.18em;
  font-weight: normal;
  line-height: 1.37em;
  padding-top: 0.342em;
  margin-bottom: 0.142em;
  border: none;
}
.document-editor .ck-content h3 {
  font-size: 1.75em;
  font-weight: normal;
  color: hsl(203, 100%, 50%);
  line-height: 1.86em;
  padding-top: 0.171em;
  margin-bottom: 0.357em;
}
.document-editor .ck-content h4 {
  line-height: 1.24em;
  padding-top: 0.286em;
  margin-bottom: 0.952em;
  font-size: 1.31em;
  font-weight: bold;
}
.document-editor .ck-content p {
  font-size: 1em;
  line-height: 1.63em;
  padding-top: 0.5em;
  margin-bottom: 1.13em;
}
.document-editor .ck-content blockquote {
  font-family: Georgia, serif;
  margin-left: calc(2 * var(--ck-spacing-large));
  margin-right: calc(2 * var(--ck-spacing-large));
}
.document-editor .ck-heading-dropdown .ck-list {
  font: 16px/1.6 "Helvetica Neue", Helvetica, Arial, sans-serif;
  /* Scale down all heading previews because they are way too big to be presented in the UI.
             Preserve the relative scale, though. */
}
.document-editor .ck-heading-dropdown .ck-list .ck-button__label {
  line-height: calc(1.7 * var(--ck-line-height-base) * var(--ck-font-size-base));
  min-width: 6em;
}
.document-editor .ck-heading-dropdown .ck-list .ck-button:not(.ck-heading_paragraph) .ck-button__label {
  transform: scale(0.8);
  transform-origin: left;
}
.document-editor .ck-heading-dropdown .ck-heading_heading1 .ck-button__label {
  /* Set the styles for "Heading 1". */
  font-size: 2.18em;
  font-weight: normal;
}
.document-editor .ck-heading-dropdown .ck-heading_heading2 .ck-button__label {
  /* Set the styles for "Heading 2". */
  font-size: 1.75em;
  font-weight: normal;
  color: hsl(203, 100%, 50%);
}
.document-editor .ck-heading-dropdown .ck-heading_heading2.ck-on .ck-button__label {
  color: var(--ck-color-list-button-on-text);
}
.document-editor .ck-heading-dropdown .ck-heading_heading3 .ck-button__label {
  /* Set the styles for "Heading 3". */
  font-size: 1.31em;
  font-weight: bold;
}
.ck.ck-editor__editable_inline {
  overflow: initial;
  height: max-content;
}
/* Make the editable container look like the inside of a native word processor application. */
.document-editor__editable-container .document-editor__editable.ck-editor__editable {
  /* Set the dimensions of the "page" (A4). */
  width: 21cm;
  /* Keep the "page" off the boundaries of the container. */
  padding: 0.5cm 1cm 1cm;
  border: 1px hsl(0, 0%, 82.7%) solid;
  border-radius: var(--ck-border-radius);
  background: white;
  /* The "page" should cast a slight shadow (3D illusion). */
  box-shadow: 0 0 5px hsla(0, 0%, 0%, 0.1);
  /* Center the "page". */
  overflow: visible;
  margin: 0 auto;
}
.inline {
  display: flex;
  flex-flow: row;
}
.notinline {
  display: flex;
  flex-flow: column;
}
.imagery .vue-slider-piecewise-label {
  top: 40px !important;
  left: -10px !important;
  transform: rotate(60deg) !important;
}
.imagery .slider-v-labels {
  height: 150px;
}
.imagery .timeslider-info {
  border: 1px solid #83a45f;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 300;
  padding: 8px;
  margin-bottom: 10px;
}
.phenology-card-border {
  border-left: 10px solid transparent;
  background-color: white;
}
.phenology-card-border-color {
  border-color: #28a745 !important;
}
.phenology-button-header-box {
  text-align: left;
  margin-bottom: 10px;
}
.screen-splitter.sp-flex {
  display: flex;
  flex-flow: column nowrap;
}
@media (max-width: 768px) {
  .screen-splitter.sp-flex {
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
  }
}
.screen-splitter.sp-flex.sp-top .common-functions {
  order: 1;
  border-top: none;
  border-bottom: 1px solid #fff;
}
.screen-splitter.sp-flex.sp-top .screen-splitter-wrapper {
  order: 2;
}
.screen-splitter .position-0 .screen-splitter-map {
  left: 0px;
}
.screen-splitter .position-0 .screen-splitter-tabs {
  right: 50%;
  padding-right: 30px;
}
.screen-splitter .position-1 .screen-splitter-map {
  left: 50%;
}
.screen-splitter .position-1 .screen-splitter-tabs {
  right: 50%;
}
.screen-splitter .position-2 .screen-splitter-map {
  left: 70%;
}
.screen-splitter .position-2 .screen-splitter-tabs {
  right: 30%;
}
.screen-splitter .position-3 .screen-splitter-map {
  left: 100%;
}
.screen-splitter .position-3 .screen-splitter-tabs {
  right: 0;
}
.screen-splitter-tabs,
.screen-splitter-map {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 2;
}
.screen-splitter-tabs .absolute-fill,
.screen-splitter-map .absolute-fill {
  overflow: hidden;
}
.screen-splitter-map {
  right: 0px;
  left: 50%;
  min-width: 30%;
  transition: left 0.3s;
  border-left: 1px solid #646464;
  background-color: #222;
}
.screen-splitter-tabs {
  right: 50%;
  left: 0;
  transition: right 0.3s;
}
.screen-splitter-nav {
  position: absolute;
  top: calc(50% - 20px);
  left: -23px;
  z-index: 2;
  width: 45px;
  height: 44px;
}
.screen-splitter-nav button {
  display: block;
  float: left;
  width: 22px;
  height: 44px;
  background-color: rgba(68, 68, 68, 0.5);
  color: white;
  border: none;
  box-sizing: border-box;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.screen-splitter-nav button:hover {
  background-color: #83a45f;
}
.screen-splitter-nav .screen-splitter-btn-left {
  border-top-left-radius: 22px;
  border-bottom-left-radius: 22px;
  left: -22px;
}
.screen-splitter-nav .screen-splitter-btn-right {
  border-top-right-radius: 22px;
  border-bottom-right-radius: 22px;
  float: right;
}
.vertical-split .screen-splitter-tabs,
.vertical-split .screen-splitter-map {
  position: absolute;
  left: 0 !important;
  right: 0 !important;
  z-index: 2;
}
.vertical-split .screen-splitter-tabs .absolute-fill,
.vertical-split .screen-splitter-map .absolute-fill {
  overflow: hidden;
}
.vertical-split .screen-splitter-map {
  bottom: 50%;
  top: 0;
  min-height: 30%;
  transition: bottom 0.3s, top 0.3s;
  border-left: 1px solid #646464;
  background-color: #222;
}
.vertical-split .screen-splitter-tabs {
  top: 50%;
  bottom: 0;
  transition: top 0.3s;
}
.vertical-split .screen-splitter-nav {
  position: absolute;
  left: calc(50% - 20px);
  bottom: -23px;
  top: unset;
  z-index: 2;
  width: 45px;
  height: 44px;
  z-index: 500;
  transform: rotate(-90deg);
}
.vertical-split .position-0 .screen-splitter-map {
  bottom: 0px;
}
.vertical-split .position-0 .screen-splitter-tabs {
  top: 100%;
}
.vertical-split .position-1 .screen-splitter-map {
  bottom: 50%;
}
.vertical-split .position-1 .screen-splitter-tabs {
  top: 50%;
}
.vertical-split .position-2 .screen-splitter-map {
  bottom: 70%;
}
.vertical-split .position-2 .screen-splitter-tabs {
  top: 30%;
}
.vertical-split .position-3 .screen-splitter-map {
  bottom: 100%;
  top: -30%;
}
.vertical-split .position-3 .screen-splitter-tabs {
  top: 0;
}
.main-map,
.map {
  position: relative;
  width: 100%;
  height: 100%;
}
.map-tools {
  position: absolute;
  top: -1000px;
  left: -1000px;
}
.map-locker {
  background-color: #fff;
  padding-right: 10px;
  min-height: 32px;
  display: flex;
  align-items: center;
}
.map-locker label {
  margin: 0;
  font-size: 0.8rem;
  max-width: 100px;
  word-break: break-all;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.map-overlay {
  position: absolute;
  bottom: 16px;
  width: 100%;
  padding: 10px;
  height: 100px;
  margin: auto;
  background-color: #fff;
  visibility: hidden;
}
.map-overlay.create-field {
  height: 50px;
}
.map .map-overlay {
  visibility: visible !important;
}
text[font-style="with-background"] {
  position: relative;
  display: flex;
  stroke: #000;
  stroke-width: 1px;
  stroke-opacity: 1;
}
.esri-layer-list__item-actions {
  background-color: #ddd;
  color: #444;
}
.esri-layer-list__item-actions .esri-layer-list__item-action:hover,
.esri-layer-list__item-actions .esri-layer-list__action-toggle:hover {
  background-color: #ccc;
}
.card {
  box-sizing: border-box;
  border: none;
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.4);
  border-radius: 4px;
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 10px;
  background: linear-gradient(to left, #e0e0e0, white);
}
.card.disabled {
  opacity: 0.6;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.6);
}
.card.card-red {
  background-color: #c9243f !important;
  color: #fff;
}
.card .btn-card-transparent {
  height: 100%;
  border: none;
  box-shadow: none;
  background: none;
}
.card > *:not(h1, h2, h3, h4, h5, h6) {
  font-size: 14px;
}
.card h4.card-title {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.2;
  margin: 0;
  width: 100%;
  word-break: break-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 1.2rem;
}
.card p {
  margin-bottom: 0.25rem;
}
.card .card-body {
  padding: 10px;
}
.card .card-body.more-padding {
  padding: 30px;
}
.card .card-body .measure {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  display: inline-block;
  vertical-align: bottom;
}
.card .card-body .crop-color-sign {
  width: 1em;
  height: 0.566em;
  display: inline-block;
}
.card .card-img {
  background-color: #2c6b56;
  border-radius: 0;
}
.card .card-header,
.card footer,
.card header {
  flex: 1 100%;
  padding: 3px 20px;
  display: flex;
  justify-content: space-between;
}
.card.field-card {
  width: 200px;
  min-height: 300px;
  border-radius: 4px;
  overflow: hidden;
}
.card.field-card .card-body {
  padding-top: 0;
}
.card.field-card .card-header {
  max-width: 200px;
  max-height: 180px;
  padding: 0;
  margin: 0;
  position: relative;
}
.card.field-card .card-header .card-title {
  position: absolute;
  bottom: -1px;
  padding: 0 5px;
  background-color: rgba(255, 255, 255, 0.5);
}
.card.field-card .card-header .card-area {
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 5px;
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 0 5px 5px 0;
}
.card.field-card .card-header .center-in-map {
  position: absolute;
  top: 0px;
  right: 0px;
  width: 40px;
  height: 30px;
  background-color: #008fd5;
  color: #fff;
  border: none;
  font-size: 1rem;
  border-radius: 0 0.2rem 0 0;
}
.card.card-hover:hover .body::after {
  content: "";
  display: block;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: absolute;
  background-color: rgba(0, 143, 213, 0.3);
}
.card .card-info {
  padding: 0 10px;
  display: flex;
  flex-flow: column;
  flex: 1;
  border-right: 1px solid rgba(0, 0, 0, 0.2);
  margin: 5px 0;
  order: 2;
  padding-top: 5px;
}
.card .card-info h1,
.card .card-info h2,
.card .card-info h3,
.card .card-info h4,
.card .card-info h5 {
  margin: 10px 0;
  text-align: center;
}
.card .card-info:last-child {
  border-right: none;
}
.card .card-info span {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  text-align: center;
}
.card .card-info small {
  flex-grow: 0;
  height: 20px;
  text-align: center;
  font-weight: 300;
  overflow: hidden;
}
.card .card-info time {
  flex: 1;
  align-items: center;
  display: flex;
  justify-content: center;
  text-align: center;
  font-size: 0.8rem;
}
.card .card-info.dss-info {
  width: 25%;
  max-width: 25%;
}
.card .card-info.dss-info span.col {
  flex-flow: column;
  width: 100%;
}
.card .card-info.dss-info span.col > span {
  font-size: 0.8rem;
  width: 100%;
  display: inline-block;
}
.card .card-info.dss-info span.row {
  flex-flow: row;
  width: 100%;
  margin: 0;
  justify-content: flex-start;
}
.card .card-info.dss-info span.row > span {
  box-sizing: border-box;
  flex-grow: unset;
  flex-shrink: unset;
  flex-basis: auto;
  font-size: 0.8rem;
  width: 100%;
  display: inline-block;
}
.card.horizontal-card {
  display: flex;
  flex-flow: row wrap;
  margin: 5px 5px 10px;
  min-height: 70px;
  flex-grow: 1;
}
.card.horizontal-card .card-status {
  box-shadow: -1px 0 2px 0 rgba(0, 0, 0, 0.5) inset;
  background-color: rgba(0, 0, 0, 0.05);
}
.card.horizontal-card header {
  order: 1;
  border-bottom: 1px solid rgba(100, 100, 100, 0.2);
}
.card.horizontal-card footer {
  background-color: rgba(0, 0, 0, 0.05);
  order: 4;
}
.card.horizontal-card footer *,
.card.horizontal-card header * {
  color: #034107;
}
.card.horizontal-card.pending-invitation {
  overflow: hidden;
}
.card.horizontal-card.pending-invitation::before {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 100%;
}
.card.horizontal-card.pending-invitation::before {
  background-color: #e13b3b;
}
.card.horizontal-card.issue-open,
.card.horizontal-card.issue-solved {
  overflow: hidden;
}
.card.horizontal-card.issue-open::before,
.card.horizontal-card.issue-solved::before {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 100%;
}
.card.horizontal-card.primary {
  overflow: hidden;
}
.card.horizontal-card.primary::before {
  content: "";
  display: block;
  position: absolute;
  width: 8px;
  height: 100%;
}
.card.horizontal-card.issue-open::before {
  background-color: #e13b3b;
}
.card.horizontal-card.issue-solved::before {
  background-color: #2c6b56;
}
.card.horizontal-card.primary::before {
  background-color: #0072b4;
}
.card.horizontal-card .body,
.card.horizontal-card .section {
  position: relative;
  display: flex;
  flex-flow: row wrap;
  order: 2;
  flex: 10;
}
.card.horizontal-card .body .section,
.card.horizontal-card .section .section {
  flex: 10 100%;
}
.card.horizontal-card .section {
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.card.horizontal-card .card-status {
  display: flex;
  flex-flow: column;
  flex: 1 0;
  align-items: center;
  justify-content: center;
  order: 0;
  max-width: 50px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}
.card.horizontal-card .card-status.card-image {
  width: 80px;
  min-width: 80px;
  background-color: #2c6b56;
}
.card.horizontal-card .card-status.card-image img {
  max-width: 80px;
  resize: both;
}
.card.horizontal-card .card-status.big,
.card.horizontal-card .card-status.big-150 {
  max-width: 150px;
  overflow: hidden;
}
.card.horizontal-card .card-status.big-150 {
  min-width: 150px;
}
.card.horizontal-card .card-status.issue-open {
  background: linear-gradient(to right, #f05159, #ec222c);
  color: #fff;
}
.card.horizontal-card .card-status.issue-solved {
  background: linear-gradient(to right, #a4bf5f, #8ca843);
  color: #fff;
}
.card.horizontal-card .card-status.primary {
  background: #008fd5;
  color: #fff;
}
.card.horizontal-card .card-status.pending-invitation {
  background: linear-gradient(to right, #f05159, #ec222c);
  color: #fff;
}
.card.horizontal-card .card-buttons {
  display: flex;
  flex-flow: column;
  order: 5;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  background: #008fd5;
  box-shadow: 1px 0 2px 0 rgba(0, 0, 0, 0.5) inset;
}
.card.horizontal-card .card-buttons button {
  background: none;
  height: 100%;
  width: 50px;
  border-width: 0;
  border-bottom-width: 1px;
  border-color: #0072b4;
  border-left-width: 1px;
  color: #fff;
}
.card.horizontal-card .card-buttons button:hover {
  background-color: rgba(255, 255, 255, 0.3);
}
.card.horizontal-card .card-buttons button:first-child {
  border-top-right-radius: 4px;
}
.card.horizontal-card .card-buttons button:last-child {
  border-bottom-right-radius: 4px;
  border-bottom-width: 0;
}
.card.horizontal-card .card-buttons a {
  background: none;
  height: 100%;
  width: 50px;
  border-width: 0;
  border-bottom-width: 1px;
  border-color: #0072b4;
  border-left-width: 1px;
  color: #fff;
}
.card.horizontal-card .card-buttons a:hover {
  background-color: rgba(255, 255, 255, 0.3);
}
.card.horizontal-card .card-buttons a:first-child {
  border-top-right-radius: 4px;
}
.card.horizontal-card .card-buttons a:last-child {
  border-bottom-right-radius: 4px;
  border-bottom-width: 0;
}
.fields-box,
.stations-box {
  display: flex;
  flex-flow: row wrap;
}
a.card-wrapper {
  display: block;
  padding: 5px;
}
.card .card,
.card-body-vertical .card {
  border-radius: 0;
  box-shadow: 0 1px 2px 0 rgba(100, 100, 100, 0.6);
  background: #fff;
}
.index-group {
  margin-bottom: 40px;
  margin-top: 20px;
  position: relative;
}
.index-group .index-subgroup {
  position: relative;
  margin-top: 20px;
}
.index-group .index-subgroup .group-header {
  display: flex;
  order: 0;
  width: 100%;
  flex-flow: row;
  align-items: flex-end;
  justify-content: flex-start;
  margin-left: -10px;
}
.index-group .index-subgroup .group-header > * {
  margin-right: 3px;
}
.index-group .index-subgroup .group-header > *:first-child {
  min-width: 200px;
  color: #999;
}
.index-group .index-subgroup .group-header > *:not(:first-child) {
  font-size: 1rem;
}
.index-group .index-subgroup .group-header > *.highlight {
  color: #414042;
}
.index-group .index-subgroup .group-header h5 {
  background-color: #fff;
  padding: 3px 10px;
  box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.6);
  font-weight: 100;
  border-radius: 3px;
  overflow: hidden;
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  justify-content: space-between;
}
.index-group .index-subgroup .group-header h5 button,
.index-group .index-subgroup .group-header h5 a {
  background: none;
  border: none;
  margin: -3px -10px -3px 10px;
  background-color: #0072b4;
  color: #fff;
  height: 100%;
  padding: 3px 10px;
  display: inline-block;
}
.index-subgroup {
  margin-left: 10px;
}
.navigation-page {
  margin: 16px;
  display: flex;
  flex-wrap: wrap;
}
.card-navigation {
  border-radius: 5px !important;
  width: 270px;
  height: 250px;
  padding: 8px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(to right, #ebf5e7, #f3f9f0) !important;
  color: #414042;
  border: 1px solid gray !important;
  margin: 7px;
  cursor: pointer;
}
.card-navigation:hover {
  background: white !important;
}
.card-body-navigation {
  font-size: 13px;
  padding-top: 10px;
}
.card-header-navigation {
  cursor: pointer;
  display: flex;
  flex-flow: column;
  align-items: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}
.card-header-navigation .title-button-navigation {
  font-size: 20px;
}
.card-header-navigation .icon-header-navigation {
  color: #1d5644;
  font-size: 2.5em;
  width: 50px;
  height: 50px;
}
.card-navigation-info {
  cursor: pointer;
  padding-top: 0 !important;
}
.truncate-over-3-row {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.models-list,
.no-meteo-station {
  display: flex;
  flex-flow: column;
  align-items: center;
  padding: 10px 5px 5px;
  color: #a61a32;
}
.models-list .no-models,
.no-meteo-station .no-models {
  display: flex;
  flex-flow: column;
  align-items: center;
  color: #a0a0a0;
}
.models-list .avaiable-model,
.no-meteo-station .avaiable-model {
  color: #414042;
  font-size: 12px;
  text-align: center;
}
.input-area {
  padding: 0 30px;
}
.input-area h1,
.input-area h2,
.input-area h3,
.input-area h4,
.input-area h5,
.input-area h6 {
  margin: 30 0;
}
.input-area .spacer {
  padding: 20px 0;
}
.input-area .buttons {
  margin-bottom: 40px;
  margin-top: 30px;
  display: flex;
  flex-flow: row;
  justify-content: space-between;
}
.input-area .buttons button {
  margin-left: 5px;
  flex-grow: 1;
  width: 20%;
  order: 2;
}
.input-area .buttons button:first-child {
  margin-left: 0;
}
.input-area .buttons button.btn-danger {
  order: 1;
  justify-self: flex-start;
}
.input-area header {
  padding: 00px 20px;
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 300;
  margin-bottom: 10px;
  color: #00350e;
}
.input-area header:first-child {
  margin-top: 20px;
}
.input-area[disabled] * {
  pointer-events: none;
}
.options-container header {
  padding: 00px 20px;
  display: flex;
  align-items: center;
  font-size: 1.5rem;
  font-weight: 300;
  margin-bottom: 10px;
  color: #00350e;
}
input[aria-invalid="true"],
select[aria-invalid="true"] {
  border-color: #dc3545 !important;
}
input[aria-invalid="true"].form-control:focus,
select[aria-invalid="true"].form-control:focus {
  border-color: none;
}
div.vdp-datepicker[aria-invalid="true"] > div.input-group > span > span {
  border-right-color: #dc3545 !important;
  border-top-color: #dc3545 !important;
  border-bottom-color: #dc3545 !important;
}
div.vdp-datepicker[aria-invalid="true"] > div.input-group > input {
  border-left-color: #dc3545 !important;
  border-top-color: #dc3545 !important;
  border-bottom-color: #dc3545 !important;
}
div.vue-simple-suggest > div.input-wrapper {
  overflow: hidden;
}
div.vue-simple-suggest > div.input-wrapper > div.input-group > input.form-control-behind {
  opacity: 0;
  border: none !important;
  position: absolute;
}
div.vue-simple-suggest > div.input-wrapper > div.input-group > input.form-control-behind:focus {
  border: none !important;
  box-shadow: none;
}
div.vue-simple-suggest > div.input-wrapper > div.input-group > div.form-control {
  overflow: hidden;
  border-radius: 4px;
}
div.vue-simple-suggest > div.input-wrapper > div.input-group > div.form-control.disabled {
  background-color: #e9ecef;
  opacity: 1;
}
div.vue-simple-suggest > div.input-wrapper > div.input-group > div.form-control.disabled:focus {
  border: 1px solid #ced4da;
  box-shadow: none;
}
div.vue-simple-suggest[aria-invalid="true"] > div.input-wrapper > div.input-group > div.form-control {
  border-color: #dc3545;
}
div.vue-simple-suggest[aria-invalid="true"] > div.input-wrapper > div.input-group > div.form-control:focus {
  border-color: none;
}
div.vue-simple-suggest[aria-invalid="true"] > div.input-wrapper > div.input-group > div.form-control.disabled {
  border: 1px solid #ced4da;
}
div.vue-simple-suggest > .suggestions {
  overflow: auto;
  max-height: 400px;
}
div.vue-simple-suggest > .suggestions > .hover {
  background-color: #218838;
  color: white;
}
.text-muted {
  color: #00350e !important;
}
.invalid-input-value {
  width: 100%;
  margin-top: 0.25rem;
  font-size: 80%;
  color: #dc3545;
}
.v-select.searchable .dropdown-toggle {
  height: 38px;
}
.v-select input[type=search].form-control {
  float: left !important;
  width: 100% !important;
  height: 38px !important;
  margin: 0 !important;
  border: 0 !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 2 !important;
  background: transparent !important;
  border-radius: 0.25rem !important;
}
.searchable.open input[type=search].form-control {
  background: white !important;
}
.v-select .dropdown-toggle::after {
  display: none;
}
.v-select .dropdown-toggle {
  -webkit-appearance: none;
}
.v-select .open-indicator {
  display: none !important;
}
.v-select .selected-tag {
  margin: 6px 1px 0 5px !important;
  background: none !important;
  border: 0 !important;
}
.v-select li:hover > a {
  background: transparent !important;
}
.v-select .dropdown-menu li {
  line-height: normal !important;
}
.v-select .dropdown-menu a {
  display: block;
  padding: 8px 5px;
}
.v-select .dropdown-menu a:hover {
  background: #eee !important;
}
.v-select a:hover {
  background: #eee !important;
}
.v-select li.text-center {
  text-align: center;
  padding: 8px 0;
  color: #999;
}
.typeahead {
  position: relative;
}
.typeahead .list {
  position: absolute;
  top: 40px;
  background: #fff;
  z-index: 100;
  width: 98%;
  max-height: 300px;
  overflow: auto;
  box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.5);
  border: 1px solid green;
}
.weather-station-card {
  width: 100%;
  min-width: 200px;
  padding: 10px;
  margin-right: 10px;
}
.weather-station-card .card-body {
  display: flex;
  flex-flow: row wrap;
  padding: 0;
}
.weather-station-card .card-body .item {
  width: 150px;
  display: flex;
  flex-flow: row;
  min-height: 100px;
  padding-top: 5px;
  margin-bottom: 5px;
  box-sizing: border-box;
  border-top: 1px solid #ccc;
}
.weather-station-card .card-body .item i {
  font-size: 1.3rem;
  padding: 5px;
  border-right: 1px solid green;
  width: 38px;
  text-align: center;
}
.weather-station-card .card-body .item .content {
  padding-left: 3px;
  display: flex;
  flex-flow: column;
}
.weather-station-card .card-body .item .content label {
  margin: 0;
  font-weight: 600;
}
.weather-station-card .card-body .item .content > strong {
  font-size: 1.5rem;
}
.weather-station-card .card-body .item .content > strong small {
  font-size: 0.8rem;
}
.weather-station-card .card-body .item .content > span {
  font-size: 0.8rem;
}
.card-detail .station-detail.station-detail-for-field {
  display: flex;
  flex-flow: row-reverse;
  height: 100%;
}
.card-detail .station-detail .chart-container {
  flex: 1;
}
.card-detail .station-detail .sub-menu {
  min-width: auto;
  width: 41px;
}
.card-detail .station-detail .sub-menu li {
  width: 100px;
  height: 100px;
  transform: rotate(-90deg);
}
.card-detail .station-detail .sub-menu li a {
  text-align: center;
  font-weight: 400;
  height: 41px;
  border-left: 1px solid #222;
  border-bottom: none;
}
.card-detail .station-detail .sub-menu li a.active {
  background: linear-gradient(to bottom, white, #e0e0e0);
  color: #222;
}
.card-detail .station-detail .highcharts-data-table {
  font-size: 0.7em;
  overflow-x: auto;
}
.card-detail .station-detail .highcharts-data-table table {
  width: 100%;
}
.card-detail .station-detail .highcharts-data-table table thead {
  background-color: #f9f9f9;
}
.card-detail .station-detail .highcharts-data-table table tbody > tr:nth-of-type(even) {
  background-color: #f9f9f9;
}
.card-detail .station-detail .highcharts-data-table table tbody > tr > td,
.card-detail .station-detail .highcharts-data-table table thead > tr > th {
  padding: 8px;
}
.card-detail .station-detail .highcharts-data-table table tbody > tr > th {
  font-weight: inherit;
}
.weather-status {
  background: linear-gradient(to right, #008fd5, #0072b4);
}
.weather-status img {
  width: 50px;
  height: 50px;
}
.weather-forecast .condition {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}
.weather-forecast p > span {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 0.6rem;
}
.weather-forecast p > span span {
  justify-self: end;
  font-size: 0.8rem;
}
.card-detail {
  height: 100%;
  position: relative;
  display: flex;
  flex-flow: column;
}
.card-detail header {
  padding: 0 30px;
}
.card-detail header small {
  font-size: 14px;
}
.card-detail .card-body,
.card-detail .card-body-vertical {
  border-radius: 4px;
  overflow: hidden;
  flex-flow: column;
  display: flex;
  margin: 20px;
  margin-top: 0;
  box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.6);
}
.card-detail .card-body .container-fluid,
.card-detail .card-body-vertical .container-fluid {
  padding: 20px;
}
.card-detail .card-body-vertical {
  flex-flow: row;
  flex: 1 1 auto;
}
.card-detail .card-body-vertical .sub-menu ul li a:hover,
.card-detail .card-body-vertical .sub-menu ul li a.active {
  background: linear-gradient(to left, white, #e0e0e0);
}
.card-detail .card-edit-body h1,
.card-detail .card-edit-body h2,
.card-detail .card-edit-body h3,
.card-detail .card-edit-body h4,
.card-detail .card-edit-body h5,
.card-detail .card-edit-body h6,
.card-detail .card-edit-body header {
  padding: 10px;
  background-color: rgba(255, 255, 255, 0.6);
  border-bottom: 1px solid #ccc;
}
.card-detail .card-edit-body .buttons {
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5) inset;
  background-color: rgba(0, 0, 0, 0.3);
  padding-top: 1px;
  display: flex;
  height: 70px;
  justify-content: flex-end;
}
.card-detail .card-edit-body .buttons button {
  width: 100%;
  min-width: 100px;
  order: 2;
}
.card-detail .card-edit-body .buttons button.btn-danger {
  order: 1;
  justify-self: flex-start;
}
.card-detail .sub-menu {
  margin: 0;
  background-color: #83a45f;
  flex-shrink: 0;
  min-width: 150px;
  background: linear-gradient(to left, #1d5644, #356b4c);
}
.card-detail .sub-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.card-detail .sub-menu ul li a {
  display: block;
  padding: 10px;
  color: #fff;
  font-weight: 300;
  font-size: 14px;
  border-bottom: 1px solid #e0e0e0;
}
.card-detail .sub-menu ul li a:hover,
.card-detail .sub-menu ul li a.active {
  background-color: #e0e0e0;
  background: linear-gradient(to left, white, #e0e0e0);
  color: #414042;
}
.card-detail .right-sub-menu {
  background: linear-gradient(to right, #1d5644, #356b4c);
  min-width: auto;
  width: 41px;
}
.card-detail .right-sub-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.card-detail .right-sub-menu li {
  width: 100px;
  height: 100px;
  transform: rotate(90deg) !important;
  margin-left: -59px;
}
.card-detail .right-sub-menu li a {
  display: block;
  padding: 10px;
  color: #fff;
  font-size: 14px;
  height: 41px;
  border-right: 1px solid #222;
  text-align: center;
}
.card-detail .right-sub-menu li a.active,
.card-detail .right-sub-menu li a:hover {
  background: linear-gradient(to bottom, white, #e0e0e0);
  color: #222;
}
.card-detail .field-detail-container {
  flex-grow: 1;
  margin: 0;
  background: linear-gradient(to left, #e0e0e0, white);
  overflow-x: hidden;
}
.card-detail .field-detail-container::-webkit-scrollbar {
  width: 7px;
}
.card-detail .field-detail-container::-webkit-scrollbar-thumb {
  background: linear-gradient(to left, #a61a32, #c9243f);
}
.field-detail-box {
  border-bottom: 1px solid rgba(0, 0, 0, 0.5);
  padding-top: 10px;
}
.field-detail-box .field-detail-p i {
  padding: 5px;
}
.search-box {
  width: auto;
  flex: 1;
  max-width: 500px;
  margin-right: auto;
  display: flex;
  height: 100%;
  align-items: center;
  padding: 0 10px;
  background-color: #008fd5;
  position: relative;
}
.search-box .input-group:focus,
.search-box input:focus {
  outline: none;
  box-shadow: none;
}
.search-box .input-group,
.search-box .input-group,
.search-box input,
.search-box .input-group-text,
.search-box input:focus,
.search-box button {
  border: none;
  color: #eee;
  background: transparent;
  box-shadow: none;
}
.search-box .input-group::placeholder,
.search-box .input-group::placeholder,
.search-box input::placeholder,
.search-box .input-group-text::placeholder,
.search-box input:focus::placeholder,
.search-box button::placeholder {
  color: #c7d3bc;
}
.search-box button {
  font-size: 1.2rem;
}
.search-box button.active {
  background-color: #008fd5 !important;
  position: relative;
}
.search-box button.active .badge {
  position: absolute;
  bottom: 0;
  right: 0;
  top: auto;
}
.search-box.disabled::after {
  position: absolute;
  background-color: #8d979c65;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  content: "";
}
.filter-container {
  height: 100%;
  width: 100%;
  position: relative;
  overflow: hidden;
  z-index: -1;
}
.filter-container .filters {
  display: block;
  transition: left 0.3s;
  position: absolute;
  left: 0;
  width: calc(100% - 160px);
  margin: 0 30px;
  height: 0;
  top: -50px;
  padding: 20px;
  background-color: #fff;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
  z-index: 2;
  transition: top 0.3s ease-in-out;
}
.filter-container .filtered-content {
  height: 100%;
  position: relative;
}
.filter-container.show {
  z-index: 100;
  background-color: rgba(0, 0, 0, 0.5);
}
.filter-container.show .filters {
  top: 0;
  left: 0;
  height: auto;
}
.vue-slider-component.slider-danger-color-absent-very-low .vue-slider-process {
  background-color: lightgreen;
}
.vue-slider-component.slider-danger-color-low .vue-slider-process {
  background-color: yellowgreen;
}
.vue-slider-component.slider-danger-color-mid-low .vue-slider-process {
  background-color: greenyellow;
}
.vue-slider-component.slider-danger-color-mid-high .vue-slider-process {
  background-color: yellow;
}
.vue-slider-component.slider-danger-color-high .vue-slider-process {
  background-color: orange;
}
.vue-slider-component.slider-danger-color-total .vue-slider-process {
  background-color: red;
}
.vdp-datepicker {
  flex: 1 1 auto;
}
.vdp-datepicker .input-group {
  flex-flow: row-reverse;
}
.vdp-datepicker .input-group .form-control {
  border-radius: 0.25rem;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  background-color: #fff;
}
.vdp-datepicker .input-group .form-control:disabled {
  background-color: #e9ecef;
}
.vdp-datepicker .input-group .input-group-prepend {
  display: flex;
  margin-left: -1px;
}
.vdp-datepicker .input-group .input-group-prepend > .input-group-text {
  border-radius: 0.25rem;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}
.timeline-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  margin: 5px;
}
.timeline-wrapper .vertical-timeline {
  flex: 1 1 0;
  margin-right: 10px;
}
.timeline-wrapper .vertical-timeline ul {
  padding-left: 40px;
  padding-bottom: 15px;
  position: relative;
}
.timeline-wrapper .vertical-timeline ul::before,
.timeline-wrapper .vertical-timeline ul::after {
  content: "";
  position: absolute;
  bottom: 0;
  background-color: #333;
}
.timeline-wrapper .vertical-timeline ul::before {
  top: 0;
  left: 17px;
  width: 4px;
}
.timeline-wrapper .vertical-timeline ul::after {
  height: 12px;
  width: 12px;
  border-radius: 6px;
  left: 13px;
}
.timeline-wrapper .vertical-timeline ul li {
  list-style: none;
  position: relative;
  padding: 4px 0 10px;
  color: #333;
}
.timeline-wrapper .vertical-timeline ul li i {
  width: 30px;
  height: 30px;
  border: 4px solid #333;
  border-radius: 50%;
  color: #333;
  background-color: #fff;
  position: absolute;
  left: -36px;
  top: 0;
}
.timeline-wrapper .vertical-timeline ul li .tl-date {
  font-weight: 600;
  display: block;
}
.timeline-wrapper .vertical-timeline ul li .tl-field {
  display: inline-block;
  white-space: nowrap;
  font-weight: 700;
}
.timeline-wrapper .vertical-timeline ul li .tl-crop {
  white-space: nowrap;
}
.timeline-wrapper .vertical-timeline ul li .tl-event {
  font-style: italic;
  font-weight: 700;
  white-space: nowrap;
}
.tooltip {
  display: block !important;
  z-index: 10000;
}
.tooltip .tooltip-inner {
  background: rgba(0, 0, 0, 0.8);
  color: white;
  border-radius: 4px;
  padding: 5px 10px 4px;
}
.tooltip .tooltip-inner a {
  color: white;
  text-decoration: underline;
}
.tooltip .tooltip-arrow {
  width: 0;
  height: 0;
  border-style: solid;
  position: absolute;
  margin: 5px;
  border-color: rgba(0, 0, 0, 0.8);
  z-index: 1;
}
.tooltip[x-placement^="top"] {
  margin-bottom: 5px;
}
.tooltip[x-placement^="top"] .tooltip-arrow {
  border-width: 5px 5px 0 5px;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
  bottom: -5px;
  left: calc(50% - 5px);
  margin-top: 0;
  margin-bottom: 0;
}
.tooltip[x-placement^="bottom"] {
  margin-top: 5px;
}
.tooltip[x-placement^="bottom"] .tooltip-arrow {
  border-width: 0 5px 5px 5px;
  border-left-color: transparent !important;
  border-right-color: transparent !important;
  border-top-color: transparent !important;
  top: -5px;
  left: calc(50% - 5px);
  margin-top: 0;
  margin-bottom: 0;
}
.tooltip[x-placement^="right"] {
  margin-left: 5px;
}
.tooltip[x-placement^="right"] .tooltip-arrow {
  border-width: 5px 5px 5px 0;
  border-left-color: transparent !important;
  border-top-color: transparent !important;
  border-bottom-color: transparent !important;
  left: -5px;
  top: calc(50% - 5px);
  margin-left: 0;
  margin-right: 0;
}
.tooltip[x-placement^="left"] {
  margin-right: 5px;
}
.tooltip[x-placement^="left"] .tooltip-arrow {
  border-width: 5px 0 5px 5px;
  border-top-color: transparent !important;
  border-right-color: transparent !important;
  border-bottom-color: transparent !important;
  right: -5px;
  top: calc(50% - 5px);
  margin-left: 0;
  margin-right: 0;
}
.tooltip.popover .popover-inner {
  background: #f9f9f9;
  color: black;
  padding: 24px;
  border-radius: 5px;
  box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
}
.tooltip.popover .popover-arrow {
  border-color: #f9f9f9;
}
.tooltip[aria-hidden='true'] {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.15s, visibility 0.15s;
}
.tooltip[aria-hidden='false'] {
  visibility: visible;
  opacity: 1;
  transition: opacity 0.15s;
}
.size-1 {
  flex: 1 !important;
}
.size-2 {
  flex: 2 !important;
}
.size-3 {
  flex: 2 !important;
}
.size-4 {
  flex: 3 !important;
}
.size-5 {
  flex: 4 !important;
}
.size-6 {
  flex: 5 !important;
}
.size-7 {
  flex: 6 !important;
}
.size-8 {
  flex: 7 !important;
}
.dashboard-container {
  padding-top: 10px;
  padding-bottom: 30px;
  display: flex;
  flex-flow: row wrap;
}
.dashboard-container .card {
  margin-top: 5px;
}
.dashboard-container .card header,
.dashboard-container .card footer,
.dashboard-container .card .card-header {
  max-height: 30px;
}
.card.horizontal-card.dashboard-card {
  max-height: 30vh;
}
.card.dashboard-card {
  max-height: 30vh;
  background: none;
  background-color: rgba(255, 255, 255, 0.6);
  box-shadow: none;
}
.card.dashboard-card .chart-container {
  width: 100%;
  height: calc(100% - 30px);
  padding: 0 !important;
}
.widget-container {
  display: flex;
  flex-flow: row wrap;
}
.section .accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 6px;
  width: 100%;
  text-align: center;
  border: none;
  outline: none;
  transition: 0.4s;
}
.section .active,
.section .accordion:hover {
  background-color: #ccc;
}
.section .panel {
  padding: 0 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}
.section .panel.open {
  flex: 10 100%;
  position: relative;
  display: flex;
  flex-flow: row wrap;
  order: 2;
}
.section .panel.open .empty {
  text-align: center;
  width: 100%;
}
.iziToast-wrapper {
  padding: 20px;
}
.iziToast-wrapper.iziToast-wrapper-topLeft,
.iziToast-wrapper.iziToast-wrapper-topRight {
  top: 40px;
}
.sidebar-minimized .agr-error,
.sidebar-minimized .agr-success {
  margin-left: 50px !important;
}
.iziToast {
  min-width: 200px;
  border-radius: 0;
}
.iziToast.agr-error,
.iziToast.agr-success {
  transition: margin-left 0.3s;
  margin-left: 240px;
}
.iziToast.iziToast-color-blue {
  background-color: rgba(0, 114, 180, 0.8) !important;
  border-color: #0072b4 !important;
}
.iziToast.iziToast-color-red {
  background-color: rgba(201, 36, 63, 0.9) !important;
  border-color: #c9243f !important;
}
.iziToast.iziToast-color-green,
.iziToast.iziToast-color-yellow {
  background-color: #fff;
  border-color: #2c6b56 !important;
  box-shadow: 0px 0px 3px 3px rgba(0, 0, 0, 0.5);
}
.iziToast.iziToast-color-green .iziToast-body *,
.iziToast.iziToast-color-yellow .iziToast-body * {
  color: #2c6b56 !important;
}
.iziToast .fa-spin {
  -webkit-animation: fa-spin 2s infinite linear !important;
  animation: fa-spin 2s infinite linear !important;
  opacity: 1 !important;
}
.smooth-dnd-container.horizontal {
  display: flex;
  flex-flow: row wrap;
}
.smooth-dnd-container.horizontal .smooth-dnd-draggable-wrapper,
.smooth-dnd-container.horizontal .no-move {
  height: auto !important;
  transform: none !important;
}
.dragdestination .smooth-dnd-container {
  background-color: rgba(0, 143, 213, 0.2);
}
.dragdestination .smooth-dnd-container .ghost-item {
  min-width: 50px;
  min-height: 30px;
}
.soilanalysis-texiture-chart {
  max-width: calc((100vw - 240px) / 2);
  max-height: calc((100vw - 240px) / 2) !important;
  margin: auto;
}
.soilanalysis-texiture-chart > .soilanalysis-texiture-chart-container {
  width: 100%;
  padding-bottom: 100%;
  margin-top: -13%;
  position: relative;
}
.soilanalysis-texiture-chart > .soilanalysis-texiture-chart-container > div.ratio {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
}
.soilanalysis-texiture-chart > .soilanalysis-texiture-chart-container > div.ratio > .highcharts {
  width: 100% !important;
  height: 100% !important;
}
.soilanalysis-texiture-chart > .soilanalysis-texiture-chart-container > div.ratio > .highcharts > .highcharts-container {
  width: 100% !important;
  height: 100% !important;
}
.admin-tools {
  position: absolute;
  top: 0;
  right: 0;
  left: 0px;
  bottom: 0;
  z-index: 1;
  background-color: #d1d3d4;
  width: 100%;
  transition: width 0.3s, left 0.3s;
}
.admin-tools.hidden {
  left: 100%;
  width: 0;
}
.admin-tools.hidden .admin-container {
  display: none;
}
.admin-tools .toggler-show {
  position: absolute;
  width: 30px;
  height: 30px;
  bottom: 50px;
  padding: 0 5px;
  left: -30px;
  background-color: #fff;
  line-height: 30px;
  box-shadow: -1px 1px 3px 0px rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
.dss-row {
  flex-flow: row;
  flex-wrap: wrap;
  display: flex;
}
.dss-row .dss-row-header {
  width: 100%;
  display: block;
}
.dss-row .dss-card {
  box-sizing: border-box;
  border: none;
  border-radius: 4px;
  margin: 10px 5px;
  background-color: rgba(255, 255, 255, 0.6);
  display: flex;
  flex-flow: column nowrap;
  height: 150px;
  width: 250px;
  overflow: hidden;
  border: 1px dashed rgba(131, 164, 95, 0.3);
}
.dss-row .dss-card.agrimodel {
  background-color: rgba(0, 143, 213, 0.2);
  box-shadow: none;
  opacity: 0.8;
}
.dss-row .dss-card.warning {
  border: 2px solid rgba(230, 179, 80, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(230, 179, 80, 0.6);
  opacity: 1;
}
.dss-row .dss-card.danger {
  border: 2px solid rgba(240, 81, 89, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(240, 81, 89, 0.6);
  opacity: 1;
}
.dss-row .dss-card time {
  flex: 1;
  text-align: right;
  font-size: 0.8rem;
  line-height: 24px;
  font-weight: 600;
}
.dss-row .dss-card footer,
.dss-row .dss-card header {
  height: 30px;
  background: #fff;
  padding: 2px 5px;
  display: flex;
  justify-content: space-between;
}
.dss-row .dss-card section {
  display: flex;
  flex: 1;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  text-align: center;
  position: relative;
}
.dss-row .dss-card section.row {
  flex-flow: row nowrap;
  margin: 0;
}
.dss-row .dss-card section.row .col {
  padding: 0 5px;
}
.dss-row .dss-card section .warning-level {
  position: absolute;
  top: 0;
  right: 10px;
  font-size: 1.5rem;
}
.dss-row .dss-card section .warning-level .danger {
  color: #f05159;
}
.dss-row .dss-card section .warning-level .warning {
  color: #e6b350;
}
.dss-row .dss-card section .bottom,
.dss-row .dss-card section .left,
.dss-row .dss-card section .right,
.dss-row .dss-card section .top {
  position: absolute;
}
.dss-row .dss-card section .top {
  top: 0;
}
.dss-row .dss-card section .left {
  left: 0;
}
.dss-row .dss-card section .right {
  right: 0;
}
.dss-row .dss-card section .bottom {
  bottom: 0;
}
.dss-row .dss-card section small {
  text-align: center;
}
.dss-chart-container {
  height: calc(90% - 30px);
  margin-top: 30px;
  box-sizing: border-box;
  border: none;
  box-shadow: 2px 2px 10px 1px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.6);
  overflow: hidden;
}
.dss-iconographic {
  width: 100%;
}
.dss-iconographic .dss-divider {
  margin: 50px auto;
  width: 50%;
  height: 1px;
  border-top: 2px solid rgba(255, 255, 255, 0.4);
  position: relative;
}
.dss-iconographic .dss-divider::before,
.dss-iconographic .dss-divider::after {
  content: "";
  display: block;
  position: absolute;
  top: -6px;
  left: -10px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.4);
}
.dss-iconographic .dss-divider::after {
  right: -10px;
  left: initial;
}
.dss-iconographic > header,
.dss-iconographic > footer {
  margin: 10px 0px;
  display: flex;
  flex-flow: row;
  justify-content: center;
}
.dss-iconographic section {
  display: flex;
  flex-flow: row;
}
.dss-iconographic section aside {
  flex: 2;
  display: flex;
  flex-flow: column;
}
.dss-iconographic section aside .area {
  flex: 1;
  display: flex;
  flex-flow: row wrap;
  align-items: stretch;
}
.dss-iconographic section aside.left .area {
  flex-flow: row-reverse wrap;
}
.dss-iconographic section img {
  flex: 1;
  height: 100%;
  max-width: 200px;
}
.dss-iconographic .infographic-card {
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  background: #ebfff0;
  padding: 5px 10px;
  border-radius: 5px;
  justify-content: space-between;
  margin: 5px 5px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  position: relative;
}
.dss-iconographic .infographic-card.warning {
  border: 2px solid rgba(230, 179, 80, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(230, 179, 80, 0.6);
  opacity: 1;
}
.dss-iconographic .infographic-card.danger {
  border: 2px solid rgba(240, 81, 89, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(240, 81, 89, 0.6);
  opacity: 1;
}
.dss-iconographic .infographic-card.danger-color-mid-low,
.dss-iconographic .infographic-card.danger-color-mid-high {
  border: 2px solid rgba(230, 179, 80, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(230, 179, 80, 0.6);
  opacity: 1;
}
.dss-iconographic .infographic-card.danger-color-high,
.dss-iconographic .infographic-card.danger-color-total {
  border: 2px solid rgba(240, 81, 89, 0.6);
  box-shadow: 2px 2px 10px 2px rgba(240, 81, 89, 0.6);
  opacity: 1;
}
.dss-iconographic .infographic-card.weather img {
  width: 50px;
  height: 50px;
}
.dss-iconographic .infographic-card section {
  flex-flow: row nowrap;
  align-items: flex-end;
  position: relative;
  width: 100%;
}
.dss-iconographic .infographic-card section.bugs {
  width: 100%;
}
.dss-iconographic .infographic-card section.bugs strong {
  width: 100%;
  text-align: center;
}
.dss-iconographic .infographic-card section.bugs strong.no-risk {
  color: #999;
}
.dss-iconographic .infographic-card section.bugs strong.danger {
  color: #f05159;
}
.dss-iconographic .infographic-card section time {
  font-size: 1em;
}
.dss-iconographic .infographic-card section.description {
  align-items: center;
  align-content: center;
}
.dss-iconographic .infographic-card section.description i {
  margin: 0 5px;
}
.dss-iconographic .infographic-card section .warning-level {
  position: absolute;
  top: -5px;
  right: 0px;
  font-size: 1rem;
}
.dss-iconographic .infographic-card section .warning-level .danger {
  color: #f05159;
}
.dss-iconographic .infographic-card section .warning-level .warning {
  color: #e6b350;
}
.dss-iconographic .infographic-card section img {
  width: fit-content;
}
.dss-iconographic .infographic-card section.vertical {
  flex-flow: column nowrap;
  align-items: flex-start;
  flex: 1;
  justify-content: center;
}
.dss-iconographic .infographic-card section .measure {
  font-size: 18px;
  font-weight: 600;
  font-style: italic;
}
.dss-iconographic .infographic-card footer {
  font-style: italic;
  font-size: 12px;
  display: flex;
  flex-flow: row;
  justify-content: space-between;
  width: 100%;
  align-items: baseline;
}
.dss-iconographic .infographic-card.idro .measure {
  color: #0072b4;
}
.dss-iconographic .infographic-card.idro footer {
  color: #0072b4;
}
.dss-iconographic .field-dss-options {
  display: flex;
  flex-flow: column;
  position: absolute;
  background-color: #fff;
  padding: 10px;
  border-radius: 5px;
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
  top: 0;
  left: calc(100% + 15px);
  z-index: 3;
}
.dss-iconographic .field-dss-options .card-body {
  width: 100%;
}
.dss-iconographic .field-dss-options hr {
  border-color: transparent;
}
.dss-iconographic .field-dss-options > label {
  min-width: 100%;
  padding: 0 10px;
  color: #5b5b5b;
}
.dss-iconographic .field-dss-options button {
  margin: 5px;
  flex-basis: 10%;
  flex-grow: 1;
  background-color: #5a845c;
  color: #fff;
}
.dss-iconographic .field-dss-options button.active {
  background-color: #2c6b56;
  box-shadow: 0 0 0 0.2rem rgba(44, 107, 86, 0.3);
}
.dss-iconographic .field-dss-options:after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  border-bottom-color: #fff;
  border-top: 0;
  border-right: 0;
  margin-left: -16px;
  margin-top: 8px;
}
.dss-iconographic .field-dss-options.position-3:after {
  right: 120px;
}
.dss-iconographic .field-dss-options.position-2:after {
  right: 80px;
}
.togglebutton.can-grow {
  flex-grow: 1;
}
.togglebutton label input[type=checkbox],
.togglebutton label input[type=radio] {
  opacity: 0;
  width: 0;
  height: 0;
}
.togglebutton label .toggle {
  text-align: left;
  margin-left: 5px;
}
.togglebutton label .toggle,
.togglebutton label input[type=checkbox][disabled] + .toggle,
.togglebutton label input[type=radio][disabled] + .toggle {
  content: "";
  display: inline-block;
  width: 50px;
  height: 24px;
  background-color: #ddd;
  border-radius: 15px;
  transition: background 0.3s ease;
  vertical-align: middle;
  position: relative;
  box-shadow: inset 0 1px 2px 0 rgba(0, 0, 0, 0.5);
  line-height: 24px;
  text-align: center;
  color: #979797;
  font-size: 10px;
  text-transform: uppercase;
}
.togglebutton label .toggle:after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  background-image: linear-gradient(to bottom, #1756ad, #002680);
  border-radius: 20px;
  position: relative;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.4);
  left: 1px;
  top: 2px;
  position: absolute;
  border: none;
  transition: left 0.3s ease, background 0.3s ease, box-shadow 0.1s ease;
}
.togglebutton label input[type=checkbox][disabled] + .toggle:after,
.togglebutton label input[type=checkbox][disabled]:checked + .toggle:after,
.togglebutton label input[type=radio][disabled] + .toggle:after,
.togglebutton label input[type=radio][disabled]:checked + .toggle:after {
  background-color: #BDBDBD;
}
.togglebutton label input[type=checkbox] + .toggle:active:after,
.togglebutton label input[type=checkbox][disabled] + .toggle:active:after,
.togglebutton label input[type=radio] + .toggle:active:after,
.togglebutton label input[type=radio][disabled] + .toggle:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.6), 0 0 0 20px rgba(0, 0, 0, 0.2);
}
.togglebutton label input[type=checkbox]:checked + .toggle:after,
.togglebutton label input[type=radio]:checked + .toggle:after {
  left: 28px;
}
.togglebutton label input[type=checkbox]:checked + .toggle,
.togglebutton label input[type=radio]:checked + .toggle {
  content: "";
  background-image: linear-gradient(to bottom, #3fa4ff, #1791ff);
  color: #fff;
}
.togglebutton[disabled] label.form-check-label {
  opacity: 0.7;
}
.togglebutton[disabled] span.toggle {
  pointer-events: none;
  cursor: default;
}
.togglebutton.btn span.toggle,
.togglebutton[disabled].btn span.toggle {
  margin-left: -5px !important;
  height: 20px !important;
}
.togglebutton.btn span.toggle:after,
.togglebutton[disabled].btn span.toggle:after {
  top: 0 !important;
}
.model-status.info {
  background: linear-gradient(to right, #008fd5, #0072b4);
  color: #fff;
}
.model-status.low {
  background: linear-gradient(to right, #a4bf5f, #8ca843);
  color: #fff;
}
.model-status.medium {
  background: linear-gradient(to right, #e6b350, #e0a023);
  color: #fff;
}
.model-status.warning {
  background: linear-gradient(to right, #f58345, #f26315);
  color: #fff;
}
.model-status.alarm {
  background: linear-gradient(to right, #f05159, #ec222c);
  color: #fff;
}
.card.loading {
  box-shadow: none;
  border-radius: 4px;
  border: 3px #dadada dashed;
  background: none;
}
.models.alert {
  padding: 5px 10px;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
}
.future {
  background-color: #E3F2FD;
}
.main-stats {
  display: flex;
  flex-flow: row;
  width: 100%;
}
.main-stats .block {
  margin: 0 10px;
  display: flex;
  flex: 1;
  flex-flow: row;
  padding: 10px;
  background: linear-gradient(to right, #0072b4, #008fd5);
  border-radius: 4px;
}
.main-stats .block * {
  color: #fff;
}
.main-stats .block .block-icon {
  min-width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: -10px 0px -10px -10px;
  background-color: rgba(0, 0, 0, 0.2);
}
.main-stats .block .block-info {
  display: flex;
  flex-flow: column;
  padding-left: 10px;
}
.main-stats .block .block-info > h3 {
  flex: 1;
}
.fields-box span.field-name {
  font-size: 1.2em;
  font-weight: bold;
}
.fields-box .field-group {
  margin: 0 5px;
  padding: 2px;
}
span.field-groups {
  display: flex;
  flex-flow: column;
}
span.field-groups label.field-group {
  display: flex;
  flex-flow: row;
  margin-top: 15px !important;
  box-sizing: content-box;
  justify-content: space-between;
}
span.field-groups label.field-group.other {
  color: #a89d9d;
  background-color: #ebebeb;
}
span.field-groups label.field-group.current {
  background-color: #ffffff;
}
span.field-groups label.field-group.checked {
  background-color: #d5ffd0;
}
hr {
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  color: #CCC;
  border-color: #CCC;
  background-color: #CCC;
}
.chat-area {
  display: flex;
  flex-grow: 1;
  flex-flow: column;
  justify-content: space-between;
  height: 95%;
  margin-top: 50px;
  margin-right: 5px;
}
.chat-area .chat-messages {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  overflow: auto;
  max-height: 100%;
}
.chat-area .chat-message {
  padding: 10px;
  margin-top: 1em;
  margin-bottom: 0.3em;
  width: max-content;
  max-width: 100%;
  min-width: 300px;
  display: block;
}
.chat-area .chat-message .from {
  text-align: right;
  font-weight: bold;
}
.chat-area .chat-message .date {
  text-align: right;
  font-size: 0.7em;
  font-style: italic;
}
.chat-area .chat-message .text .card-img {
  max-width: 400px;
}
.chat-area .chat-message.other {
  align-self: flex-start;
}
.chat-area .chat-message.other .from > i {
  display: none;
}
.chat-area .chat-message.mine {
  align-self: flex-end;
  color: #fff;
  text-align: right;
  margin-right: 30px;
}
.chat-area .chat-message.mine .from {
  text-align: right;
}
.chat-area .chat-message.mine .text {
  text-align: left;
}
.chat-area .chat-message.info {
  align-self: center;
  background-color: rgba(255, 255, 255, 0.4);
  margin-top: 4em;
}
.chat-area .chat-message .bubble-arrow {
  position: absolute;
  float: left;
  left: -11px;
  top: 0px;
}
.chat-area .chat-message .bubble-arrow.alt {
  bottom: 20px;
  left: auto;
  right: 4px;
  float: right;
}
.chat-area .chat-message .bubble-arrow:after {
  content: "";
  position: absolute;
  border-top: 15px solid #ebebeb;
  border-left: 15px solid transparent;
  border-radius: 4px 0 0 0px;
  width: 0;
  height: 0;
}
.chat-area .chat-message .bubble-arrow.alt:after {
  border-top: 15px solid #DCF8C6;
  transform: scaleX(-1);
}
.chat-area .chat-writing {
  flex-grow: 0;
  border-top: 1px solid grey;
  margin-top: 10px;
  text-align: right;
}
.chat-area .chat-writing .image-attachment-wrapper {
  position: relative;
  text-align: center;
}
.chat-area .chat-writing .image-attachment-wrapper > .image-attachment {
  max-width: 100%;
  max-height: 350px;
  height: auto;
  width: auto;
}
.chat-area .chat-writing .image-attachment-wrapper > .image-remover {
  font-size: 2em;
  top: -0.5em;
  left: 0;
  position: absolute;
  background-color: #fff;
  width: 1em;
  height: 1em;
  padding: 0;
  line-height: 1em;
  text-align: center;
}
.chat-area .chat-writing .image-attachment-wrapper > .image-remover i {
  font-size: 1em;
  vertical-align: 0%;
}
.chat-area .chat-writing textarea {
  margin-top: 0.7em;
  margin-bottom: 1em;
}
.chat-area .chat-writing .custom-file {
  display: inline;
}
.chat-area .talk-bubble {
  margin: 40px;
  display: inline-block;
  position: relative;
  width: 200px;
  height: auto;
  background-color: white;
}
.chat-area .talk-bubble.mine {
  background-color: #4a7a5e;
}
.chat-area .round {
  border-radius: 30px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
}
.chat-area .talktext {
  padding: 1em;
  text-align: left;
}
.chat-area .talktext div {
  /* remove webkit p margins */
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
}
.chat-area .tri-right.other:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: -25px;
  right: auto;
  top: 0px;
  bottom: auto;
  border: 30px solid;
  border-color: white transparent transparent transparent;
}
.chat-area .tri-right.mine:after {
  content: ' ';
  position: absolute;
  width: 0;
  height: 0;
  left: auto;
  right: -25px;
  top: 0px;
  bottom: auto;
  border: 30px solid;
  border-color: #4a7a5e transparent transparent transparent;
}
.chat-area .eye {
  text-align: right;
}
.chat-area .label-attach-button {
  display: inline;
  cursor: pointer;
}
.card-chat-user-image {
  max-width: 50px;
}
.wokprogress .wokprogress-chart {
  margin-top: 15px;
}
.wokprogress .wokprogress-chart div.chart-container {
  margin-left: 5px;
  margin-right: 5px;
  margin-top: 10px;
}
.wokprogress .wokprogress-chart span.legend-item {
  font-size: 0.8em;
  display: block;
}
.wokprogress .wokprogress-chart span.legend-item span.dot {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  display: inline-block;
}
.wokprogress .highcharts-tooltip hr {
  margin: 3px 16px;
  width: auto;
}