.heroBanner_2ypg {
  padding: 5rem 0;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg {
    padding: 26px 0;
    max-height: 540px;
  }
}
@media all and (min-width: 1024px) {
  .heroBanner_2ypg {
    padding: 3rem 0;
  }
}
.heroBanner_2ypg .flex_container {
  display: flex;
  flex-direction: column;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg .flex_container {
    flex-direction: row;
  }
}
.heroBanner_2ypg .flex_container .col-6 {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) {
  margin-top: -50px;
  padding: 0;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg .flex_container .col-6:nth-of-type(1) {
    margin-top: 0;
    padding: 0;
  }
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) p.categories {
  text-transform: uppercase;
  font-family: var(--font-extrabold);
  font-size: 1.5rem;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) h1 {
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 39px;
  line-height: 45px;
  font-family: var(--font-extrabold);
  margin: 16px 0 20px;
  text-shadow: 5px 5px 12px var(--cinder);
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) .buttons {
  display: flex;
  align-items: center;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) .buttons a.cta-button {
  color: var(--marshmallow);
  margin: 30px 0;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) .buttons p {
  display: inline-block;
  color: var(--marshmallow);
  padding-left: 1.4rem;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) .buttons p a {
  color: var(--marshmallow);
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) .buttons p a dsm-arrow {
  margin-left: -6px;
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(1) p.legal {
  display: none;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg .flex_container .col-6:nth-of-type(1) p.legal {
    display: block;
  }
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(2) img {
  pointer-events: none;
  width: 100%;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg .flex_container .col-6:nth-of-type(2) img {
    margin-top: -1px;
  }
}
.heroBanner_2ypg .flex_container .col-6:nth-of-type(2) p {
  display: block;
  margin-top: 1rem;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg .flex_container .col-6:nth-of-type(2) p {
    display: none;
  }
}
.heroBanner_2ypg#danyAutoHop {
  background-color: #781c2b;
  background-image: url("/global/includes/hero-global/2ypg/images/dany-autoHop_mobileBKG.png");
}
@media all and (min-width: 1024px) {
  .heroBanner_2ypg#danyAutoHop {
    background-image: url("/global/includes/hero-global/2ypg/images/dany-autoHop_desktopBKG.png");
  }
}
.heroBanner_2ypg#signalMonitoring {
  display: none;
  background-color: #000010;
  background-image: url("/global/includes/hero-global/2ypg/images/signalMonitoring_mobileBKG.png");
}
@media all and (min-width: 1024px) {
  .heroBanner_2ypg#signalMonitoring {
    background-image: url("/global/includes/hero-global/2ypg/images/signalMonitoring_desktopBKG.png");
  }
}
.heroBanner_2ypg#signalMonitoring .flex_container .col-6:nth-of-type(2) img {
  transform: scale(0.8);
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg#signalMonitoring .flex_container .col-6:nth-of-type(2) img {
    transform: scale(1);
  }
}
.heroBanner_2ypg#signalMonitoring p.categories span:before {
  display: block;
  content: "";
  height: 2px;
  width: 20%;
  background-color: var(--blaze);
  margin: 8px 0;
}
@media all and (min-width: 768px) {
  .heroBanner_2ypg#signalMonitoring p.categories span:before {
    display: inline-block;
    content: "|";
    height: unset;
    width: unset;
    margin: unset;
    background-color: transparent;
  }
}