html {
  background: white; }

* {
  font-family: 'Exo 2', sans-serif; }

body {
  margin: 0;
  height: 100%; }

p, ul {
  margin: 0;
  padding: 0; }

.admin-panel-link {
  position: absolute;
  right: 4px;
  top: 4px;
  height: 36px;
  width: 36px;
  background: url(/img/settings.png) no-repeat 50% 50%;
  background-size: cover; }

.admin-panel-delivery-link {
  position: absolute;
  right: 44px;
  top: 4px;
  height: 36px;
  width: 36px;
  background: url(/img/delivery.png) no-repeat 50% 50%;
  background-size: cover; }

.admin-panel-home-link {
  position: absolute;
  right: 44px;
  top: 4px;
  height: 36px;
  width: 36px;
  background: url(/img/home.png) no-repeat 50% 50%;
  background-size: cover; }

.admin-panel-loader {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  background: url(/img/ajax-loader.gif) no-repeat 50% 50% white;
  background-size: cover;
}
.admin-panel-loader-transparent {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 1;
  background: url(/img/ajax-loader.gif) no-repeat 50% 50% rgba(255,255,255,0.3);
  background-size: cover;
}
.admin-user-delete {
  height: 24px;
  width: 24px;
  display: inline-block;
  cursor: pointer;
  background: url(/img/delete.png) no-repeat 50% 50%;
  background-size: contain; }

.admin-user-edit {
  height: 24px;
  width: 24px;
  display: inline-block;
  cursor: pointer;
  background: url(/img/edit.png) no-repeat 50% 50%;
  background-size: contain; }

.remodal .body input {
  display: block;
  width: 300px;
  margin: 10px auto; }

.remodal .body input[type="checkbox"] {
  display: inline-block;
  width: initial; }

.remodal .body label {
  display: inline-block; }

.remodal .body select {
  width: 300px; }

body .main-container {
  /*margin-top: 44px;*/
  /*position: absolute;*/
  /*box-sizing: border-box;*/
  height: 100%;
  width: 100%; }

body .main-container #map {
  position: fixed;
  top: 44px;
  bottom: 0;
  right: 0;
  left: 300px; }

body .main-container .sidebar {
  height: auto;
  position: fixed;
  top: 44px;
  bottom: 0;
  /*right: 0;*/
  box-sizing: border-box;
  left: 0;
  width: 300px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
  z-index: 1;
  padding: 5px 0; }

body .main-container .sidebar > div {
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box; }

body .main-container .sidebar li {
  list-style: none; }

body .main-container .sidebar li.highPriority {
  background-color: rgba(255, 0, 0, 0.5); }

body .main-container .sidebar li.not-working {
  background-color: rgba(255, 0, 0, 0.5); }

body .main-container .sidebar li.pinned-stock-missing {
  background-color: rgba(0, 0, 255, 0.5); }


body .main-container .sidebar input {
  margin-right: 5px;
  padding-top: 10px; }

body .main-container .sidebar .zone-search {
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 100%;
  margin: 0;
  padding: 8px 10px;
  border: 0;
  border-bottom: 1px solid #ddd;
  outline: none;
  font-family: inherit; }

body .main-container .sidebar .side-balloons {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  margin: 0; }

body .main-container .sidebar .side-balloons li {
  cursor: pointer;
  height: 30px; }

body .main-container .sidebar .side-balloons li .placemark-item-container {
  height: 24px;
  padding: 3px 0;
  position: relative; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-circle-icon {
  position: absolute;
  display: inline-block;
  border-color: black;
  border: 2px solid;
  border-radius: 100%;
  height: 24px;
  width: 24px;
  line-height: 19px; }

body .main-container .sidebar .side-balloons li .placemark-item-container i.glyphicon::before {
  padding-left: 3px; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-circle-icon.yellow {
  color: orange; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-circle-icon.red {
  color: red; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-circle-icon.blue {
  color: blue; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-circle-icon.skyblue {
  color: skyblue; }

body .main-container .sidebar .side-balloons li .placemark-item-container .placemark-name {
  line-height: 18px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden; }

body .main-container .sidebar .side-balloons .placemark-item {
  padding: 3px 10px; }

body .main-container .sidebar .side-balloons .placemark-item.selected {
  background-color: lemonchiffon; }

body .main-container .header {
  z-index: 2;
  position: fixed;
  right: 0;
  left: 0;
  height: 44px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19); }

/* ==========  Select Field Variables ========== */
/* ==========  Select Field ========== */
/* Style Select Field */
select {
  font-family: inherit;
  width: 100%;
  padding: 3px;
  color: black;
  border: 1px solid rgba(0, 0, 0, 0.5);
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px; }

/* Remove focus */
select:focus {
  outline: none; }

/* Hide label */
.mdl-selectfield label {
  display: none; }

/* Use custom arrow */
.mdl-selectfield select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none; }

.mdl-selectfield {
  position: relative; }

.mdl-selectfield:after {
  position: absolute;
  top: 1.6em;
  right: 0.7em;
  width: 0;
  height: 0;
  padding: 0;
  content: '';
  border-left: .4em solid transparent;
  border-right: .4em solid transparent;
  border-top: 0.5em solid rgba(0, 0, 0, 0.5);
  pointer-events: none; }

.dropdown-with-checkboxes .dropdown {
  margin-left: 0px;
  margin-top: -4px; }

.dropdown-with-checkboxes a {
  color: #fff; }

.dropdown-with-checkboxes .dropdown dd,
.dropdown-with-checkboxes .dropdown dt {
  margin: 0px;
  padding: 0px; }

.dropdown-with-checkboxes .dropdown ul {
  margin: -1px 0 0 0; }

.dropdown-with-checkboxes .dropdown dd {
  position: relative; }

.dropdown-with-checkboxes .dropdown a,
.dropdown-with-checkboxes .dropdown a:visited {
  color: #fff;
  text-decoration: none;
  outline: none;
  font-size: 12px; }

.dropdown-with-checkboxes .dropdown dt a {
  background-color: #4F6877;
  display: block;
  padding: 8px 20px 5px 10px;
  min-height: 25px;
  line-height: 24px;
  overflow: hidden;
  border: 0; }

.dropdown-with-checkboxes .dropdown dt a span,
.dropdown-with-checkboxes .multiSel span {
  cursor: pointer;
  display: inline-block;
  padding: 0 3px 2px 0; }

.dropdown-with-checkboxes .dropdown dd ul {
  background-color: #4F6877;
  border: 0;
  color: #fff;
  display: none;
  left: 0px;
  padding: 2px 5px 2px 5px;
  position: absolute;
  top: 2px;
  list-style: none;
  overflow: auto;
  z-index: 100; }

.dropdown-with-checkboxes .dropdown span.value {
  display: none; }

.dropdown-with-checkboxes .dropdown dd ul li a {
  padding: 5px;
  display: block; }

.dropdown-with-checkboxes .dropdown dd ul li a:hover {
  background-color: #fff; }

.dropdown-with-checkboxes button {
  background-color: #6BBE92;
  width: 272px;
  border: 0;
  padding: 10px 0;
  margin: 5px 0;
  text-align: center;
  color: #fff; }

.dropdown-with-checkboxes li {
  padding: 3px;
  margin: 6px; }

.point-balloon h4 {
  margin: 5px; }

.task-balloon, .point-ballon .polygon-balloon {
  width: 270px;
  margin-top: 6px; }

.task-balloon textarea, .point-ballon .polygon-balloon textarea {
  margin-top: 10px;
  resize: vertical;
  width: 100%; }

.task-balloon select, .point-ballon .polygon-balloon select {
  margin: 10px 0; }

.task-balloon h4, .point-ballon .polygon-balloon h4 {
  margin: auto 0px;
  color: #343434;
  font-weight: normal; }

.task-balloon h3, .point-ballon .polygon-balloon h3 {
  margin: auto 0px;
  color: #343434;
  font-weight: normal; }

.task-balloon .loading-container, .point-ballon .polygon-balloon .loading-container {
  top: -10px;
  bottom: -10px;
  right: -12px;
  left: -12px;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.5);
  display: none; }

.task-balloon .buttons-row, .point-ballon .polygon-balloon .buttons-row {
  text-align: center; }

.task-balloon .custom-field, .point-ballon .polygon-balloon .custom-field {
  min-height: 32px; }

.task-balloon input, .point-ballon .polygon-balloon input {
  width: 100%; }

.polygon-balloon {
  text-align: center; }

.polygon-balloon input {
  display: inline-block;
  margin: 15px; }

.task-balloon.loading .loading-container, .point-balloon.loading .loading-container, .polygon-balloon.loading .loading-container {
  display: block; }

.task-balloon.loading .loading-container .floatingCirclesG, .point-balloon.loading .loading-container .floatingCirclesG, .polygon-balloon.loading .loading-container .floatingCirclesG {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  margin: auto;
  transform: scale(0.6);
  -o-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6); }

.task-balloon.loading .loading-container .floatingCirclesG .f_circleG, .point-balloon.loading .loading-container .floatingCirclesG .f_circleG, .polygon-balloon.loading .loading-container .floatingCirclesG .f_circleG {
  position: absolute;
  background-color: white;
  height: 22px;
  width: 22px;
  border-radius: 12px;
  -o-border-radius: 12px;
  -ms-border-radius: 12px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  animation-name: f_fadeG;
  -o-animation-name: f_fadeG;
  -ms-animation-name: f_fadeG;
  -webkit-animation-name: f_fadeG;
  -moz-animation-name: f_fadeG;
  animation-duration: 1.2s;
  -o-animation-duration: 1.2s;
  -ms-animation-duration: 1.2s;
  -webkit-animation-duration: 1.2s;
  -moz-animation-duration: 1.2s;
  animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  animation-direction: normal;
  -o-animation-direction: normal;
  -ms-animation-direction: normal;
  -webkit-animation-direction: normal;
  -moz-animation-direction: normal; }

.task-balloon.loading .loading-container .floatingCirclesG .frotateG_01, .point-balloon.loading .loading-container .floatingCirclesG .frotateG_01, .polygon-balloon.loading .loading-container .floatingCirclesG .frotateG_01 {
  left: -41px;
  top: 0;
  animation-delay: 0.45s;
  -o-animation-delay: 0.45s;
  -ms-animation-delay: 0.45s;
  -webkit-animation-delay: 0.45s;
  -moz-animation-delay: 0.45s; }

.task-balloon.loading .loading-container .floatingCirclesG .frotateG_02, .point-balloon.loading .loading-container .floatingCirclesG .frotateG_02, .polygon-balloon.loading .loading-container .floatingCirclesG .frotateG_02 {
  left: -11px;
  top: 0;
  animation-delay: 0.6s;
  -o-animation-delay: 0.6s;
  -ms-animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s; }

.task-balloon.loading .loading-container .floatingCirclesG .frotateG_03, .point-balloon.loading .loading-container .floatingCirclesG .frotateG_03, .polygon-balloon.loading .loading-container .floatingCirclesG .frotateG_03 {
  left: 19px;
  top: 0;
  animation-delay: 0.75s;
  -o-animation-delay: 0.75s;
  -ms-animation-delay: 0.75s;
  -webkit-animation-delay: 0.75s;
  -moz-animation-delay: 0.75s; }

@keyframes f_fadeG {
  0% {
    background-color: black; }
  100% {
    background-color: white; } }

@-o-keyframes f_fadeG {
  0% {
    background-color: black; }
  100% {
    background-color: white; } }

@-ms-keyframes f_fadeG {
  .task-balloon.loading .loading-container .floatingCirclesG 0%, .point-balloon.loading .loading-container .floatingCirclesG 0%, .polygon-balloon.loading .loading-container .floatingCirclesG 0% {
    background-color: black; }
  .task-balloon.loading .loading-container .floatingCirclesG 100%, .point-balloon.loading .loading-container .floatingCirclesG 100%, .polygon-balloon.loading .loading-container .floatingCirclesG 100% {
    background-color: white; } }

@-webkit-keyframes f_fadeG {
  0% {
    background-color: black; }
  100% {
    background-color: white; } }

@-moz-keyframes f_fadeG {
  0% {
    background-color: black; }
  100% {
    background-color: white; } }

#map button {
  outline: none;
  margin: 5px;
  border-radius: 2px;
  padding: 4px 8px;
  border: 1px solid; }

#map button.cancel {
  background: transparent;
  border-color: gray; }

#map button.ok {
  background: #5DB92E;
  border-color: #5DB92E;
  color: white; }

#map button.delete {
  background: #F50000;
  border-color: #F50000;
  color: white; }

.remodal button {
  padding: 5px; }

.color-magenta {
  color: #ca00be; }

.color-red {
  color: red; }

.centroid {
  text-align: center; }

.login-form h2 {
  margin-top: 50px; }

.login-form form {
  max-width: 320px;
  margin: 50px auto 10px; }

.login-form .color-danger {
  color: red; }

.polygon-balloon input.comment {
  width: 70%; }


body .main-container .sidebar .zone-search {
  box-sizing: border-box;
  width: 100%;
  height: 32px;
  margin: 0;
  padding: 6px 10px;
  border: none;
  border-bottom: 1px solid #ddd;
  outline: none;
  font-family: inherit;
}

body .main-container .sidebar .side-balloons {
  top: 72px;
}
