﻿/*
$primary-color: #004d99;
$secondary-color-light: #808080;
$terciary-color-yellow: #ffd500;
$ambulance-list-name-color: #004d99;
$ambulance-list-buttons: #004d99;
$ambulance-list-buttons-hover: #2bacd4;
$ambulance-list-buttons-border: #2bacd4;
$ambulance-detail-font-color: #0d4d00;
*/
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&subset=latin-ext");
/*$standard-text: #8CC152;*/
/*$green-dark: pink;*/
html, body {
  height: 100% !important;
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: Roboto;
  /*background-image: linear-gradient($primary-color, white);*/
  /*background-color: white;*/
  /*background-color: yellow;*/
  /*font-size: 12px !important;*/ }

.monitor-components {
  height: 100% !important;
  width: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  /*background-color: pink;*/
  font-size: 2.1vmax; }

.monitor-component {
  /*background-color: aquamarine;*/
  /*height: 100% !important;
    width: 100%;*/
  flex: 1;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  /*font-size: 45px;
    font-size: 16px;*/
  /*font-size: 2.4vw;*/
  /*font-size: 2.4vmax;*/ }

.ambulance-open {
  display: flex;
  flex: 1;
  flex-direction: column; }

.row-container-1 {
  display: flex; }
  .row-container-1 .service-point-container {
    /*background-color: #000;*/
    display: flex;
    flex-basis: 40%;
    justify-content: center;
    align-items: stretch;
    /*height: 250px;*/ }
    .row-container-1 .service-point-container .service-point {
      display: flex;
      flex: 1;
      /*height: 95%;*/
      justify-content: center;
      align-items: center;
      background-color: #e8e8e8;
      font-size: 135%;
      color: #6e00ff;
      font-weight: bold;
      /*border-top: 0.35em solid $black-almost;*/
      margin-top: 1.4%;
      margin-bottom: 1.4%;
      margin-left: 1.4%;
      margin-right: 0.7%;
      /*padding-top: 3%;
            padding-bottom: 3%;
            padding-left: 2%;
            padding-right: 2%;*/
      text-align: center;
      /*padding: 60px;*/
      padding-top: 2%;
      padding-bottom: 2%; }
      .row-container-1 .service-point-container .service-point .service-point-inner {
        background-color: #cfcfcf;
        width: 97%;
        height: 100%;
        display: flex;
        flex: 1;
        justify-content: center;
        align-items: center;
        margin: 1.4%;
        padding: 0.7%; }
  .row-container-1 .qs-container {
    flex-basis: 60%;
    display: flex;
    justify-content: center;
    align-items: stretch;
    flex-direction: column;
    /*padding-top: 1%;
        padding-bottom: 1%;*/
    color: #6e00ff; }
    .row-container-1 .qs-container .qs-container-inner {
      align-items: center;
      background-color: #e8e8e8;
      color: #6e00ff;
      margin-top: 1%;
      margin-bottom: 1%;
      margin-left: 0.7%;
      margin-right: 1%;
      padding-top: 0.7%;
      /*padding-left: 2%;
            padding-right: 2%;*/
      text-align: center;
      /*padding: 60px;*/
      /*padding-top: 60px;*/
      /*padding-bottom: 60px;*/
      display: flex;
      flex-direction: column;
      flex: 1;
      justify-content: center;
      align-items: center; }
      .row-container-1 .qs-container .qs-container-inner .inner-box {
        background-color: #cfcfcf;
        width: 98%;
        margin-bottom: 0.7%;
        display: flex;
        flex-direction: column;
        padding: 0.7% 0; }
      .row-container-1 .qs-container .qs-container-inner .brand {
        display: flex;
        flex: 1;
        font-size: 130%;
        font-weight: bold;
        background-color: #cfcfcf;
        width: 98%;
        margin-bottom: 1%;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        padding: 0.5% 0; }
      .row-container-1 .qs-container .qs-container-inner .brand-subtitle {
        font-size: 80%;
        font-weight: normal;
        padding-top: 0.35%; }
      .row-container-1 .qs-container .qs-container-inner .brand-address {
        font-weight: bold;
        font-size: 82%;
        padding-bottom: 0.35%; }

.row-container-2 {
  display: flex;
  flex: 1; }
  .row-container-2 .current-patient-highlight {
    background-color: orange !important; }
  .row-container-2 .orange {
    background-color: orange !important; }
  .row-container-2 .current-container {
    /*background-color: bisque;*/
    flex-basis: 40%;
    display: flex;
    justify-content: center; }
    .row-container-2 .current-container .current-client {
      background-color: #6e00ff;
      margin-bottom: 1.4%;
      flex: 1;
      margin-left: 1.4%;
      margin-right: 0.7%;
      display: flex;
      flex-direction: column;
      text-align: center;
      align-content: center; }
      .row-container-2 .current-container .current-client .current-patient-label {
        font-size: 100%;
        font-weight: bold;
        color: white;
        margin-top: 1.4%; }
      .row-container-2 .current-container .current-client .current-patient-number {
        background-color: #4F0CAC;
        margin-top: 1.4%;
        font-size: 800%;
        font-weight: bold;
        color: white;
        /*display: flex;*/
        flex: 1;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 97%;
        margin-left: 1.4%;
        margin-bottom: 1.4%;
        position: relative; }
        .row-container-2 .current-container .current-client .current-patient-number .current-number {
          line-height: 100px; }
        .row-container-2 .current-container .current-client .current-patient-number .time-container {
          font-size: 30%;
          display: block;
          position: absolute;
          bottom: 0px; }
          .row-container-2 .current-container .current-client .current-patient-number .time-container .time-inner-container {
            display: flex;
            flex-direction: row;
            align-items: center; }
          .row-container-2 .current-container .current-client .current-patient-number .time-container .time {
            display: inline-block;
            position: relative;
            margin-left: 20px; }
  .row-container-2 .following-container {
    flex-basis: 60%;
    box-sizing: border-box;
    display: flex;
    justify-content: center; }
    .row-container-2 .following-container .following-subcontainer {
      background-color: #6e00ff;
      flex-direction: column;
      display: flex;
      box-sizing: border-box;
      flex: 1;
      margin-left: 0.5%;
      margin-right: 1%;
      margin-bottom: 1%; }
      .row-container-2 .following-container .following-subcontainer .following-patients-label {
        color: white;
        font-size: 100%;
        font-weight: bold;
        text-align: center;
        margin-top: 1%;
        box-sizing: border-box;
        margin-bottom: 1%; }
      .row-container-2 .following-container .following-subcontainer .queues-container {
        flex: 1;
        display: flex;
        box-sizing: border-box;
        flex-direction: column; }
        .row-container-2 .following-container .following-subcontainer .queues-container .queue-container {
          flex: 1;
          background-color: #4F0CAC;
          color: white;
          /*border-bottom: 7px solid white;*/
          display: flex;
          width: 98%;
          margin-left: 1%;
          margin-bottom: 1%; }
          .row-container-2 .following-container .following-subcontainer .queues-container .queue-container .next-patient-number-container {
            flex-basis: 28%;
            /*width: 28%;*/
            /*display: inline-block;*/
            display: flex;
            align-items: center;
            justify-content: center;
            /*padding-top: 1%;
                        padding-bottom: 1%;*/
            font-size: 180%; }
          .row-container-2 .following-container .following-subcontainer .queues-container .queue-container .queue-trinket {
            /*border: 0.05em solid white;*/
            margin-top: 1.8%;
            margin-bottom: 1.8%;
            margin-right: 5%;
            background-color: white;
            width: 0.07em; }
          .row-container-2 .following-container .following-subcontainer .queues-container .queue-container .queue-info {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            box-sizing: border-box; }
            .row-container-2 .following-container .following-subcontainer .queues-container .queue-container .queue-info .queue-name {
              font-size: 80%;
              font-weight: bold;
              margin-bottom: 1.4%; }
            .row-container-2 .following-container .following-subcontainer .queues-container .queue-container .queue-info .waiting-patients-count {
              font-size: 75%; }

.row-container-3 {
  display: flex;
  justify-content: center; }
  .row-container-3 .message-container {
    flex: 1;
    display: flex;
    margin-left: 0.5%;
    margin-right: 0.5%;
    margin-bottom: 0.5%;
    background-color: #C54A3A; }
    .row-container-3 .message-container .message {
      flex: 1;
      font-size: 90%;
      color: white;
      text-align: center; }
      .row-container-3 .message-container .message .message-inner {
        flex: 1;
        background-color: #964040;
        padding: 0.5%;
        margin: 0.65%; }

.ambulance-closed {
  display: flex;
  flex: 1;
  flex-direction: column;
  background-color: black;
  color: silver; }
  .ambulance-closed .offline-border {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0.5%;
    border: 1px solid #cfcfcf; }
  .ambulance-closed .service-point-container {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: 160%;
    margin-top: 3%;
    margin-bottom: 1%;
    font-weight: bold; }
  .ambulance-closed .opening-hours-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    margin-top: 5%;
    margin-bottom: 6%; }
    .ambulance-closed .opening-hours-container .opening-hours-label {
      text-align: center;
      font-size: 120%;
      font-weight: bold;
      margin-bottom: 1%; }
    .ambulance-closed .opening-hours-container .opening-hours-items {
      display: flex;
      flex: 1;
      flex-direction: column;
      justify-content: space-around; }
      .ambulance-closed .opening-hours-container .opening-hours-items .opening-hours-item {
        flex: 1;
        /*border: 1px solid orange;*/
        display: flex;
        align-items: center; }
        .ambulance-closed .opening-hours-container .opening-hours-items .opening-hours-item .day {
          flex: 1;
          text-align: right;
          padding-right: 1%; }
        .ambulance-closed .opening-hours-container .opening-hours-items .opening-hours-item .hours {
          flex: 1.11; }
  .ambulance-closed .messages-container {
    text-align: center;
    margin-left: 2%;
    margin-right: 2%;
    margin-bottom: 1%;
    color: #C54A3A; }
    .ambulance-closed .messages-container .message-item {
      margin-bottom: 1%;
      font-size: 95%; }

.blackscreen {
  display: flex;
  flex: 1;
  background-color: black;
  height: 100%; }

.ambulance-out-of-order {
  display: flex;
  flex: 1;
  flex-direction: column;
  background-color: black;
  color: silver;
  justify-content: center;
  align-items: center; }

/*@media (orientation: landscape) {*/
.portrait .single-monitor-container {
  /*font-size: 2.5vmax;*/
  /*font-size: 16px !important;*/ }

.portrait .current-patient-label {
  display: none !important; }

.portrait .row-container-1 {
  flex-direction: column !important; }
  .portrait .row-container-1 .service-point-container {
    flex-basis: 40% !important; }
    .portrait .row-container-1 .service-point-container .service-point {
      margin-right: 1% !important;
      margin-top: 1% !important;
      margin-bottom: 1% !important;
      padding-top: 1.5%;
      padding-bottom: 1.5%; }
      .portrait .row-container-1 .service-point-container .service-point .service-point-inner {
        width: 98% !important;
        margin: 0 1% !important;
        padding: 0.5% !important; }
  .portrait .row-container-1 .qs-container {
    display: none !important;
    /*font-size: 500%;*/
    /*visibility: hidden;*/ }

.portrait .row-container-2 {
  flex-direction: column !important; }
  .portrait .row-container-2 .current-container {
    flex: 1 !important;
    /*min-height: 18%;*/ }
    .portrait .row-container-2 .current-container .current-client .current-patient-number {
      margin-top: 1%;
      font-size: 470% !important;
      width: 98%;
      margin-left: 1%;
      margin-bottom: 1%; }
  .portrait .row-container-2 .following-container {
    /*flex: 1.15 !important;*/
    flex: 1.9 !important; }
  .portrait .row-container-2 .current-client {
    margin-right: 1% !important; }
  .portrait .row-container-2 .following-subcontainer {
    margin-left: 1% !important; }

.portrait .row-container-3 .message-container {
  margin-left: 1% !important;
  margin-right: 1% !important;
  margin-bottom: 1% !important; }
  .portrait .row-container-3 .message-container .message {
    font-size: 80% !important; }
    .portrait .row-container-3 .message-container .message .message-inner {
      margin: 1% !important; }

.portrait .ambulance-closed .offline-border {
  margin: 1% !important; }

.portrait .ambulance-closed .service-point-container {
  margin-top: 18% !important; }

.portrait .ambulance-closed .opening-hours-container {
  margin-top: 10% !important;
  margin-bottom: 15% !important; }
  .portrait .ambulance-closed .opening-hours-container .opening-hours-label {
    margin-bottom: 4% !important; }

.portrait .ambulance-closed .messages-container {
  margin-left: 3% !important;
  margin-right: 3% !important;
  margin-bottom: 1% !important; }
  .portrait .ambulance-closed .messages-container .message-item {
    font-size: 85% !important; }

/* tu je zatial iba skopirovany Portrait potom to zrefaktorujeme */
@media (orientation: portrait) {
  .single-monitor-container {
    font-size: 2.5vmax;
    /*font-size: 16px !important;*/ }
  .current-patient-label {
    display: none; }
  .row-container-1 {
    flex-direction: column; }
    .row-container-1 .service-point {
      margin-right: 1% !important;
      margin-top: 1% !important;
      margin-bottom: 1% !important; }
      .row-container-1 .service-point .service-point-inner {
        width: 98% !important;
        margin: 0 1% !important;
        padding: 1% !important; }
    .row-container-1 .qs-container {
      display: none !important;
      /*font-size: 500%;*/
      /*visibility: hidden;*/ }
  .row-container-2 {
    flex-direction: column; }
    .row-container-2 .current-container {
      flex: 1 !important; }
      .row-container-2 .current-container .current-client {
        margin-bottom: 1%;
        margin-left: 1%;
        margin-right: 0.5%; }
        .row-container-2 .current-container .current-client .current-patient-label {
          margin-top: 1%; }
        .row-container-2 .current-container .current-client .current-patient-number {
          margin-top: 1%;
          font-size: 400% !important;
          width: 98%;
          margin-left: 1%;
          margin-bottom: 1%; }
          .row-container-2 .current-container .current-client .current-patient-number .current-number {
            line-height: 100px; }
    .row-container-2 .following-container {
      /*flex: 1.15 !important;*/
      flex: 1.9 !important;
      font-size: 120%; }
    .row-container-2 .current-client {
      margin-right: 1% !important; }
    .row-container-2 .following-subcontainer {
      margin-left: 1% !important; }
  .row-container-3 .message-container {
    margin-left: 1% !important;
    margin-right: 1% !important;
    margin-bottom: 1% !important; }
    .row-container-3 .message-container .message-inner {
      margin: 1% !important; }
  .ambulance-closed {
    /*.messages-container {
            margin-left: 3% !important;
            margin-right: 3% !important;
            margin-bottom: 6% !important;
        }*/ }
    .ambulance-closed .offline-border {
      margin: 1% !important; }
    .ambulance-closed .service-point-container {
      margin-top: 18% !important; }
    .ambulance-closed .opening-hours-container {
      margin-top: 10% !important;
      margin-bottom: 15% !important; }
      .ambulance-closed .opening-hours-container .opening-hours-label {
        margin-bottom: 4% !important; } }

.rounded-corners {
  border-radius: 15px; }

.red .service-point-inner {
  color: red; }

.red .qs-container-inner .brand-subtitle, .red .qs-container-inner .brand-address {
  color: red; }

.red .current-container .current-client {
  background-color: pink; }
  .red .current-container .current-client .current-patient-number {
    background-color: red; }

.red .following-container .following-subcontainer {
  background-color: pink; }
  .red .following-container .following-subcontainer .queues-container .queue-container {
    background-color: red; }

.blue .service-point-inner {
  color: blue; }

.blue .qs-container-inner .brand-subtitle, .blue .qs-container-inner .brand-address {
  color: blue; }

.blue .current-container .current-client {
  background-color: #55a4f5; }
  .blue .current-container .current-client .current-patient-number {
    background-color: #2478cf; }

.blue .following-container .following-subcontainer {
  background-color: #55a4f5; }
  .blue .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #2478cf; }

.green .service-point-inner {
  color: green; }

.green .qs-container-inner .brand-subtitle, .green .qs-container-inner .brand-address {
  color: green; }

.green .current-container .current-client {
  background-color: #2cd98a; }
  .green .current-container .current-client .current-patient-number {
    background-color: #11bf6f; }

.green .following-container .following-subcontainer {
  background-color: #2cd98a; }
  .green .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #11bf6f; }

.green2 .rounded-corners {
  border-radius: 0px !important; }

.green2 .service-point-inner {
  color: green; }

.green2 .qs-container-inner .brand-subtitle, .green2 .qs-container-inner .brand-address {
  color: green; }

.green2 .current-container .current-client {
  background-color: #2cd98a; }
  .green2 .current-container .current-client .current-patient-number {
    background-color: #11bf6f; }

.green2 .following-container .following-subcontainer {
  background-color: #2cd98a; }
  .green2 .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #11bf6f; }

.yellow .service-point .service-point-inner {
  color: #f9f280;
  background-color: #0d0464 !important; }

.yellow .qs-container-inner .inner-box {
  background-color: #0d0464 !important; }
  .yellow .qs-container-inner .inner-box .brand-subtitle, .yellow .qs-container-inner .inner-box .brand-address {
    color: #f9f280; }

.yellow .current-container .current-client {
  background-color: #f3eb1d;
  color: #0d0464; }
  .yellow .current-container .current-client .current-patient-label {
    color: #0d0464; }
  .yellow .current-container .current-client .current-patient-number {
    background-color: #dad30b;
    color: #0d0464; }

.yellow .following-container .following-subcontainer {
  background-color: #f3eb1d; }
  .yellow .following-container .following-subcontainer .following-patients-label {
    color: #0d0464; }
  .yellow .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #dad30b;
    color: #0d0464; }
  .yellow .following-container .following-subcontainer .queue-trinket {
    background-color: #f3eb1d !important; }

.yellow2 .service-point .service-point-inner {
  color: #f9f280;
  background-color: black !important; }

.yellow2 .qs-container-inner .inner-box {
  background-color: black !important; }
  .yellow2 .qs-container-inner .inner-box .brand-subtitle, .yellow2 .qs-container-inner .inner-box .brand-address {
    color: #f9f280; }

.yellow2 .current-container .current-client {
  background-color: #f3eb1d;
  color: black; }
  .yellow2 .current-container .current-client .current-patient-label {
    color: black; }
  .yellow2 .current-container .current-client .current-patient-number {
    background-color: #dad30b;
    color: black; }

.yellow2 .following-container .following-subcontainer {
  background-color: #f3eb1d; }
  .yellow2 .following-container .following-subcontainer .following-patients-label {
    color: black; }
  .yellow2 .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #dad30b;
    color: black; }
  .yellow2 .following-container .following-subcontainer .queue-trinket {
    background-color: black !important; }

.red .service-point-inner {
  color: #bb2028; }

.red .qs-container-inner .brand-subtitle, .red .qs-container-inner .brand-address {
  color: #bb2028; }

.red .current-container .current-client {
  background-color: #e34b52; }
  .red .current-container .current-client .current-patient-number {
    background-color: #bb2028; }

.red .following-container .following-subcontainer {
  background-color: #e34b52; }
  .red .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #bb2028; }

.white .service-point-inner {
  color: #0d0464; }

.white .qs-container-inner .brand-subtitle, .white .qs-container-inner .brand-address {
  color: #0d0464; }

.white .current-container .current-client {
  background-color: #ddd; }
  .white .current-container .current-client .current-patient-label {
    color: #0d0464; }
  .white .current-container .current-client .current-patient-number {
    background-color: #FFFFFF;
    color: #0d0464; }

.white .following-container .following-subcontainer {
  background-color: #ddd; }
  .white .following-container .following-subcontainer .following-patients-label {
    color: #0d0464; }
  .white .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #FFFFFF;
    color: #0d0464; }
  .white .following-container .following-subcontainer .queue-trinket {
    background-color: #0d0464 !important; }

.purple .service-point-inner {
  color: #ac0fba; }

.purple .qs-container-inner .brand-subtitle, .purple .qs-container-inner .brand-address {
  color: #ac0fba; }

.purple .current-container .current-client {
  background-color: #dc2fec; }
  .purple .current-container .current-client .current-patient-number {
    background-color: #ac0fba; }

.purple .following-container .following-subcontainer {
  background-color: #dc2fec; }
  .purple .following-container .following-subcontainer .queues-container .queue-container {
    background-color: #ac0fba; }
