html, body {
    font-family: 'Roboto', sans-serif !important;
}

.box {
    margin-top: -20px !important;
    background-color: white;
    width: 100%;
    border-left: solid 40px transparent;
    border-right: solid 40px transparent;
    border-bottom: solid 50px #fff;
    box-shadow: 0 15px 0 0 #333;
    box-shadow: 0 12px 34px -12px #333;
    margin-bottom: 20px;
}

.angular-google-map-container {
    height: 400px;
}

.map-frame {
    background-color: rgba(245, 245, 245, 0.5);
    padding: 4px;
    margin: 5px;
}

.gly-intimidate {
    -webkit-animation: intimidate 3s infinite cubic-bezier(.16, 1, .81, 0);
    -moz-animation: intimidate 3s infinite cubic-bezier(.16, 1, .81, 0);
    -o-animation: intimidate 3s infinite cubic-bezier(.16, 1, .81, 0);
    animation: intimidate 3s infinite cubic-bezier(.16, 1, .81, 0);
}

@-moz-keyframes intimidate {
    0% {
        -moz-transform: scale(0.9, 0.9);
    }
    50% {
        -moz-transform: scale(1.4, 1.4);
    }
    100% {
        -moz-transform: scale(0.9, 0.9);
    }
}

@-webkit-keyframes intimidate {
    0% {
        -webkit-transform: scale(0.9, 0.9);
    }
    50% {
        -webkit-transform: scale(1.4, 1.4);
    }
    100% {
        -webkit-transform: scale(0.9, 0.9);
    }
}

@-o-keyframes intimidate {
    0% {
        -o-transform: scale(0.9, 0.9);
    }
    50% {
        -o-transform: scale(1.4, 1.4);
    }
    100% {
        -o-transform: scale(0.9, 0.9);
    }
}

@keyframes intimidate {
    0% {
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
    }
    50% {
        -webkit-transform: scale(1.4, 1.4);
        transform: scale(1.4, 1.4);
    }
    100% {
        -webkit-transform: scale(0.9, 0.9);
        transform: scale(0.9, 0.9);
    }
}

.gly-spin {
    -webkit-animation: spin 2s infinite linear;
    -moz-animation: spin 2s infinite linear;
    -o-animation: spin 2s infinite linear;
    animation: spin 2s infinite linear;
}

@-moz-keyframes spin {
    0% {
        -moz-transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(359deg);
    }
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
    }
}

@-o-keyframes spin {
    0% {
        -o-transform: rotate(0deg);
    }
    100% {
        -o-transform: rotate(359deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.gly-rotate-90 {
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=1);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    transform: rotate(90deg);
}

.gly-rotate-180 {
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=2);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.gly-rotate-270 {
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=3);
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    transform: rotate(270deg);
}

.gly-flip-horizontal {
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
    -webkit-transform: scale(-1, 1);
    -moz-transform: scale(-1, 1);
    -ms-transform: scale(-1, 1);
    -o-transform: scale(-1, 1);
    transform: scale(-1, 1);
}

.gly-flip-vertical {
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
    -webkit-transform: scale(1, -1);
    -moz-transform: scale(1, -1);
    -ms-transform: scale(1, -1);
    -o-transform: scale(1, -1);
    transform: scale(1, -1);
}

.grid .ui-grid-row .red {
    color: red;
}

.angularGrid {
    width: 100%;
    height: 550px;
}

.angularGridPopup {
    width: 100%;
    height: 200px;
}

.row {
    margin: 0 !important;
}
.inBasketCloseButton {
    position: absolute;
    top: 10px;
    right: 10px
}

.warningAlertOrange {
    background-color: rgba(255, 165, 0, 0.2);
    color: white;
}

.valueNotFoundRed {
  position: relative; /* needed for absolute positioning of tooltip */
  background-color: red;
  color: white;
  cursor: help; /* indicates there's more info */
}

.valueNotFoundRed::after {
  content: attr(data-tooltip); /* Pulls content dynamically */
  position: absolute;
  bottom: 100%; /* Position above the element */
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  font-size: 12px;
  z-index: 1000;
}

.valueNotFoundRed:hover::after {
  opacity: 1;
}

.is-existing-duplicate {
  position: relative; /* needed for absolute positioning of tooltip */
  background-color: #eca655 !important;
  color: white;
  cursor: help; /* indicates there's more info */
}

.is-existing-duplicate::after {
  content: attr(data-tooltip); /* Pulls content dynamically */
  position: absolute;
  bottom: 100%; /* Position above the element */
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  font-size: 12px;
  z-index: 1000;
}

.is-existing-duplicate:hover::after {
  opacity: 1;
}