@media (max-width: 1199px) {
  .d-md-blast {
    display: block !important;
  }
}
/* ==========================================================================
   Background
   ========================================================================== */
.bg-primary {
  background-color: #598eca !important;
}
.bg-medium {
  background-color: #b8babc !important;
}
.bg-success {
  background-color: #648e4d !important;
}
.bg-light {
  background-color: #eef3f6 !important;
}
.bg-darkgrey {
  background-color: #989898 !important;
}
#learn-more {
  background: url("/img/bg-sewer-lg.jpg") no-repeat;
}
/* ==========================================================================
   Text
   ========================================================================== */
body {
  font-family: "Open Sans", sans-serif;
  color: #666667;
  font-size: 16px;
  overflow-x: hidden;
  max-width: 1200px;
  margin: 0 auto;
  box-shadow: 0 0 722px gray;
}
.container,
.container-fluid {
  padding-left: 3rem;
  padding-right: 3rem;
}
.container.no-padding,
.container-fluid.no-padding {
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
}
p {
  font-weight: 600;
  line-height: 1.7rem;
}
.fw-semibold {
  font-weight: 600;
}
.fw-extrabold {
  font-weight: 900;
}
.text-danger {
  color: #e91e27 !important;
}
.text-grey {
  color: #666;
}
.text-darkgrey {
  color: #4d4e4e;
}
.text-primary {
  color: #0085cc !important;
}
h1,
h2,
h3 {
  color: #0085cc;
}
.h0 {
  font-size: 3.275rem;
}
/* ==========================================================================
   Button
   ========================================================================== */
.btn {
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 1px;
  transition: 0.3s;
  padding: 1rem 2.2rem;
}
.btn-primary {
  background-color: #0085cc !important;
  border-color: #0085cc !important;
}
.btn-primary:hover {
  opacity: 0.8;
}
.btn-outline-secondary {
  color: #808080 !important;
  border-color: #808080 !important;
}
.btn-outline-secondary:hover {
  background-color: #808080;
  color: white !important;
}
.btn-orange {
  background-color: #f79320;
  border-color: #f79320;
  color: white;
}
.btn-orange:hover {
  color: white;
  opacity: 0.9;
}
/* ==========================================================================
   Nav
   ========================================================================== */
.navbar .dropdown-menu {
  top: 61px;
  padding: 0;
  left: -105px;
}
.navbar .dropdown-menu .dropdown-item {
  padding: 10px 50px;
}
.navbar .dropdown-menu .dropdown-item img {
  padding-right: 12px;
}
.navbar .dropdown-menu .dropdown-item:active {
  color: #1e2125;
  background-color: #e9ecef;
}
/* ==========================================================================
   Hero
   ========================================================================== */
#hero {
  background-repeat: no-repeat;
  background-size: cover;
  padding: 50px 0;
}
body.home #hero {
  background-image: url("/img/hero/hero-home.png");
  min-height: 440px;
  background-position: bottom right;
}
body.i-i-micro-detection #hero {
  background-image: url("/img/hero/i-i.png");
  min-height: 365px;
}
body.condition-assessment #hero {
  background-image: url("/img/hero/hero-condition-assessment.png");
  min-height: 365px;
}
body.real-time-alerts #hero {
  background-image: url("/img/hero/hero-real-time.png");
  min-height: 365px;
}
body.on-demand-intelligence #hero {
  background-image: url("/img/hero/hero-on-demand.png");
  min-height: 466px;
  background-position: bottom center;
}
body.case-studies #hero {
  background-image: url("/img/hero/hero-sewer.png");
  min-height: 175px;
  background-position: bottom right;
}
body.contact #hero {
  background-image: url("/img/hero/hero-sewer.png");
  min-height: 175px;
  background-position: bottom right;
}
body.itracking #hero {
  background-image: url("/img/hero/hero-itracking.png");
  min-height: 175px;
  background-position: top right;
}
body.sewerwatch #hero {
  background-image: url("/img/hero/hero-sewerwatch.png");
  min-height: 175px;
  background-position: top right;
}
/* ==========================================================================
   Backgrounds
   ========================================================================== */
.parallax {
  background-attachment: fixed !important;
  background-position: center;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
.bg-image {
  background-size: cover;
  min-height: 600px;
}
.bg-itracker {
  background: url("/img/img-itracker.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center center;
  min-height: 700px;
}
#itracker-desc {
  background-image: url("/img/bg-itracker-lg.png");
  background-size: 1200px !important;
  background-position: 70% !important;
}
@media screen and (max-width: 1199px) {
  #itracker-desc {
    background-image: url("/img/img-itracker-crop-light.png");
    background-size: 870px !important;
    background-position: 0 !important;
  }
}
/* ==========================================================================
   Parallax
   ========================================================================== */
.itracker-anim {
  box-shadow: 20px 0 15px -15px rgba(0, 0, 0, 0.2);
}
.itracker-shadow {
  z-index: 2;
}
.itracker-ghost {
  position: absolute;
  top: 2px;
  right: 150px;
  z-index: -1;
}
@media (max-width: 1399px) {
  .itracker-ghost {
    right: 120px;
  }
}
@media (max-width: 1199px) {
  .itracker-shadow {
    position: relative;
    left: -90%;
  }
  .itracker-ghost {
    left: 0;
  }
}
@media (max-width: 991px) {
  .itracker-shadow {
    position: relative;
    left: -125%;
  }
}
.micro-detection-devices-laptop {
  position: absolute;
  top: -200px;
  right: 50px;
}
.micro-detection-devices-tablet {
  position: absolute;
  top: 0;
  right: 50px;
}
.real-time-alerts-devices-laptop {
  position: absolute;
  top: -200px;
  right: 20px;
}
.real-time-alerts-devices-phone {
  position: absolute;
  top: -50px;
  right: 3%;
}
.condition-playback-laptop {
  position: absolute;
  bottom: 150px;
  right: 0;
}
.condition-playback-ipad {
  position: absolute;
  bottom: 100px;
  right: 20%;
}
.on-demand-devices-img {
  position: absolute;
  top: -200px;
  right: 50px;
}
.on-demand-devices-phone {
  position: absolute;
  top: 0;
  right: 380px;
}
.playback-laptop {
  position: absolute;
  top: -300px;
  right: -100px;
}
.playback-ipad {
  position: absolute;
  top: -50px;
  right: 10%;
}
.img-reporting-ipad {
  position: absolute;
  bottom: -100px;
  right: 20%;
}
.autoreports-laptop {
  position: absolute;
  top: -200px;
  right: 0;
}
.autoreports-window {
  position: absolute;
  top: 0;
  right: 0;
}
.realtime-playback-laptop {
  position: absolute;
  top: -100px;
  right: 0;
}
.realtime-playback-ipad {
  position: absolute;
  top: 0;
  left: 100px;
}
/* ==========================================================================
   Call Outs
   ========================================================================== */
body.home #call-outs-bg h3 {
  position: absolute;
  bottom: 60px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}
body.home #call-outs-bg #installation {
  background-image: url("/img/img-20-min-install.png");
  min-height: 260px;
  background-size: cover;
  background-repeat: no-repeat;
}
body.home #call-outs-bg #setup {
  background-image: url("/img/img-simple-setup.png");
  min-height: 260px;
  background-size: cover;
  background-repeat: no-repeat;
}
body.home #call-outs-bg #maintenance-free {
  background-image: url("/img/img-maintenance-free.png");
  min-height: 260px;
  background-size: cover;
  background-repeat: no-repeat;
}