@media only screen and (min-width: 767px) and (max-width: 1366px) {
  body {
    zoom: 0.7;
  }
}
@media only screen and (min-width: 320px) and (max-width: 767px) {
  html {
    background: #fff;
  }
  h1 {
    font-size: 28px;
  }
  h2 {
    font-size: 20px;
  }
  .label {
    padding: 2px;
  }
  .error-info-window {
    border-radius: 2px;
    color: #d9534f;
    padding: 5px;
    border: 1px solid #d9534f;
  }
  .error-info-window .error-list-item {
    padding: 5px;
  }
  .map-mobile-width {
    /*width: 318px;*/
    width: 90vw;
  }
  ng-map h3 {
    font-size: 17px;
  }
  .un-attachedvalved-container {
    max-height: none !important;
  }
  .edit-step-container {
    max-height: calc(100vh - 105px);
    overflow-y: auto;
  }
  .mobile-valve-error-window {
    text-align: center;
    font-size: 1em;
    color: #333;
  }
  .mobile-valve-error-window div {
    padding: 2px 5px;
  }
  .mobile-valve-error-inner-container {
    background: #fdf5f4;
    border: 1px solid #ecbbb9;
    border-radius: 2px;
  }
  .mobile-conroller-indicator {
    margin: 7px;
  }
  .mobile-conroller-indicator > div {
    display: inline-block;
  }
  .mobile-conroller-indicator .controller-flow-container {
    color: #fff;
    background: #1a72a2;
    border: 1px solid #000;
    border-radius: 2px;
    text-align: center;
    width: 60px;
    display: inline-block;
  }
  .squer-flow-indicator {
    width: 8px;
    height: 8px;
    background: red;
    border-radius: 2px;
    display: inline-block;
  }
  .mobile-expander-title {
    font-size: 22px;
  }
  .error-name {
    border-bottom: 1px solid #ecbbb9;
  }
  li.hide-on-mobile,
  .fa.hide-on-mobile,
  .hide-on-mobile {
    display: none;
  }
  .only-for-mobile,
  .ui-mobile-menu {
    display: block;
  }
  [class*='col-xs'] {
    padding-right: 7px;
    padding-left: 7px;
  }
  .row {
    margin-right: -7px;
    margin-left: -7px;
  }
  .filters-outer-wrapper {
    position: relative;
  }
  .modal-dialog {
    top: 85px;
    margin-top: 0;
    margin-bottom: 0;
  }
  .modal-body {
    padding: 0;
  }
  .valve-details-modal-body {
    max-height: 70vh;
    overflow: hidden;
    overflow-y: auto;
  }
  .ui-modal .modal-dialog.ap-large {
    width: 95%;
  }
  .valve-details-modal .row {
    margin-bottom: 10px;
  }
  .valve-details-modal input[type="number"] {
    width: 100px;
    margin-left: 5px;
  }
  .region-text {
    width: unset;
    float: left;
  }
  .dots-container-mobile {
    padding: 0;
  }
  .dots-container-mobile .md-button.md-icon-button {
    padding: 0;
    margin: 0;
  }
  .expander-for-more-info {
    outline: none;
    float: left;
  }
  .expander-for-more-info i.fa {
    display: inline-block;
    padding-right: 5px;
    padding-left: 0px;
    margin-left: -2px;
  }
  .expander-for-more-info .right-border {
    border-right: 1px solid #ccc;
  }
  #request-loader {
    padding: 5px;
  }
  #request-loader .list-group {
    width: 355px;
  }
  .ui-breadcrumbs {
    white-space: nowrap;
    /*overflow: hidden;
        text-overflow: ellipsis;*/
  }
  #irrController {
    min-width: 320px;
  }
  #irrController .irrigation-controller-name {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .ui-expander-content-container thead {
    background: #eee;
  }
  .ui-expander-content-container table {
    table-layout: fixed;
  }
  .ui-expander-content-container .small-cell {
    width: 16%;
    white-space: nowrap;
    overflow: hidden;
  }
  .ui-expander-content-container .medium-cell {
    width: 18%;
  }
  .ui-expander-content-container .wide-cell {
    width: 50%;
    padding: 5px;
  }
  .ui-expander-content-container .ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .expander-for-more-info-content .row {
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .modal-body.only-for-mobile .row {
    margin-top: 10px;
  }
  .ui-info-field {
    border: none;
    padding: 3px 5px;
    margin: 0;
  }
  .ui-info-field label {
    font-weight: bold;
  }
  .ui-info-field .region,
  .ui-info-field span,
  .ui-info-field h4 {
    display: inline-block;
  }
  .ui-info-field .region.hide-on-mobile,
  .ui-info-field span.hide-on-mobile,
  .ui-info-field h4.hide-on-mobile {
    display: none;
  }
  .ui-info-field .map-container {
    width: 25px;
    margin-left: 10px;
  }
  .ui-menu {
    display: none;
  }
  .mobile-clear-search {
    background: none;
    border: none;
    left: 0px;
    top: 0px;
    position: absolute;
  }
  .mobile-search-row-width {
    width: 200px;
  }
  .mobile-search-row {
    margin: 15px 0;
    z-index: 9999;
    display: inline-block;
    position: relative;
  }
  .mobile-search-row input {
    margin: 0 5px;
  }
  .mobile-search-row input[type=search] {
    line-height: 20px;
    font-size: 20px;
    border-width: 0 0 1px 0;
    border-color: #999;
  }
  .mobile-search-row input[type=search]:focus {
    outline: none;
  }
  .mobile-search-row input[type=search]::placeholder {
    font-size: 14px;
    color: #ccc;
  }
  .irrigation-summary-info-and-actions {
    margin: 0;
    position: relative;
    height: unset;
  }
  .irrigation-summary-info-and-actions .col-xs-12 {
    padding-left: 0;
    padding-right: 0;
  }
  .header-wrapper {
    height: 55px;
  }
  .ui-notification-area {
    padding: 0px 7px;
    height: 50px;
  }
  .ui-notification-area .user-alert-badge {
    width: 16px;
    height: 16px;
  }
  .ui-notification-area .user-alert-side-panel {
    left: 2%;
    position: fixed;
    width: 96%;
  }
  .user {
    padding: 5px;
    width: 140px;
  }
  .user .user-inner-container {
    line-height: 20px;
  }
  .user .user-inner-container .label-container {
    line-height: 17px;
  }
  .conection-container {
    font-family: Assistant;
    font-size: 16px;
  }
  .waze-button {
    margin-left: 5px;
  }
  /*.main-wrapper .map-element {
        padding: 100px 5px 20px 5px;
    }*/
  .main-wrapper {
    top: 0;
    background: #fff;
  }
  .main-wrapper.show-loader-on-main-wrapper {
    opacity: 0.5;
  }
  .ui-frame {
    min-width: 320px;
    padding: 0;
  }
  .ui-container-panel {
    min-width: 300px;
    padding: 0 5px;
  }
  .ui-grouped-radio-button.controller-mobile-modal label {
    width: 100px;
  }
  .irrigation-plan-h4 {
    display: block;
    padding-right: 7px;
  }
  .app-version {
    display: none;
  }
  #grid-irrigation .k-grid-header {
    display: none;
  }
  #grid-irrigation .k-grid-content {
    max-height: 62vh;
  }
  #grid-irrigation.filter-open .k-grid-content {
    max-height: 50vh;
  }
  .logo {
    width: 125px;
  }
  .rtl .header-wrapper {
    padding: 0 0 0 10px;
  }
  .rtl .logo {
    margin: 10px 5px 0px 0;
    padding: 0 5px 0 0;
  }
  .rtl .ui-expander-content-container .ellipsis {
    padding-left: 10px;
  }
  #map {
    height: calc(100vh - 185px);
    /*height: 70vh;*/
  }
}
@media only screen and (min-width: 320px) and (max-width: 420px) {
  #irrController .irrigation-controller-name {
    /*width: 174px;*/
  }
}
@media only screen and (min-width: 421px) and (max-width: 480px) {
  #irrController .irrigation-controller-name {
    width: 213px;
  }
}
@media only screen and (min-width: 481px) and (max-width: 530px) {
  #irrController .irrigation-controller-name {
    width: 253px;
  }
}
@media only screen and (min-width: 531px) and (max-width: 590px) {
  #irrController .irrigation-controller-name {
    width: 297px;
  }
}
@media only screen and (min-width: 591px) and (max-width: 767px) {
  #irrController .irrigation-controller-name {
    width: 348px;
  }
}
@media only screen and (min-width: 421px) and (max-width: 480px) {
  #irrController .irrigation-controller-name {
    width: 213px;
  }
}