:root {
  --animate-duration: 1s;
}

sl-hero-old .modal-container {
  width: 100% !important;
  height: auto;
  min-height: auto;
  overflow-x: hidden;
  overflow-y: hidden;
  background-color: var(--sdx-color-horizon-tint-2);
}
sl-hero-old .partner-gradient {
  background: rgb(4, 66, 146);
  background: linear-gradient(270deg, rgb(4, 66, 146) 0%, rgb(51, 158, 226) 100%);
  background-size: cover;
}
sl-hero-old .bg-gradient-1 {
  background: linear-gradient(145deg, rgb(150, 7, 50) 0%, rgb(0, 17, 85) 30%, rgb(0, 17, 85) 60%, rgb(4, 69, 200) 100%) !important;
  background-size: cover;
}
sl-hero-old .modal-container-partner {
  width: 100% !important;
  height: auto;
  min-height: auto;
  overflow-x: hidden;
  overflow-y: hidden;
}
sl-hero-old .modal-header {
  display: flex;
  height: 184px;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid #adadad;
}
sl-hero-old .header-banner {
  color: var(--sdx-color-sc-white);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
sl-hero-old .modal-detail-container {
  margin-top: -125px;
  background-color: var(--sdx-color-horizon-tint-2);
  min-height: calc(100vh - 260px);
}
sl-hero-old .modal-detail-container-partner {
  margin-top: -125px;
  background-color: var(--sdx-color-horizon-tint-2);
  margin-bottom: var(--sdx-baseline-2);
}
sl-hero-old .center-contents {
  justify-content: center;
}
sl-hero-old .iot-background {
  background: transparent;
}
sl-hero-old .flex-align {
  display: flex;
  align-items: baseline;
}

@media (min-width: 1440px) {
  sl-hero-old .container {
    padding-left: 50px;
    padding-right: 50px;
  }
}