.universal {
  /* margin-top: 25px; */

  /* HERO (merged from #simply-smarter.universal) */
  &#simply-smarter {
    #hero {
      display: flex;
      align-items: center;
      min-height: 265px;
      background-color: #D8D8DA;
      background-image: none;

      h1,h2 {
        width: 100%;
        color: #000000;
        /* text-align: center; */
        margin-left: 20px;
      }
    }
  }
  .lead {
    padding-top:25px;
  }

  .bg-gray {
    background-color: #E6E6E6;
    padding: 35px 0;
    margin-top: 30px;
  }

  .card {
    margin-bottom: 25px;
    padding: 15px;
  }

  .print {
    img {
      width: 26%;
    }

    ul {
      column-count: 1;
    }
  }

  .h4 {
    margin-top: 0;
  }

  .listHeader {
    font-size: 16px;
    line-height: 1.5em;
    letter-spacing: 0;
    color: #000000;
    font-weight: 600;
    font-family: 'Montserrat', Arial, Tahoma, sans-serif;
  }

  .implementation {
    background-color: #00254C;
    color: #ffffff;
    padding: 20px;
    overflow: auto;
    padding: 25px 0px 54px 0px;

    img {
      margin-top: 45px;
    }

    .listHeader {
      color: #ffffff;
    }

    h2,
    h3 {
      color: #ffffff;
    }
  }

  ul {
    li {
      list-style-type: disc;
      margin-bottom:15px;
      padding-right: 20px;
    }
  }

  .solutions {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    padding-bottom: 54px;
    background-image: none;
    padding-top: 25px;

    .lead {
      padding-top: 10px;
    }
  }

  .models {
    padding: 25px;
  }

  .smarter .h2 {
    margin-top: 25px;
  }

  /* MEDIA QUERIES */
  @media only screen and (min-width: 852px) {
    .print {
      ul {
        column-count: 2;
      }
    }
  }

  @media only screen and (min-width: 855px) {
    &#simply-smarter {
      #hero {
        min-height: 225px;
        background-image: url(/portals/0/images/universal-print-hero-fade.webp);
        background-repeat: no-repeat, no-repeat;
        background-position: right center, center top;
        background-size: 48%;

        h1,
        h2 {
          width: 54%;
          /* text-align: left; */
        }
      }
    }
  }

  @media only screen and (min-width: 995px) {
    .print {
      img {
        width: 95%;
      }
    }
  }

  @media only screen and (min-width: 1120px) {
    .solutions {
      min-height: 475px;
      background-image: url(/portals/0/images/solutions-section-background-fade.webp);
      background-repeat: no-repeat, no-repeat;
      background-position: right center, center top;
      background-size: 63%;
    }
  }

  @media only screen and (min-width: 1450px) {
    &#simply-smarter {
      #hero {
        min-height: 400px;
        background-image: url(/portals/0/images/universal-print-hero-fade.webp);
        background-repeat: no-repeat, no-repeat;
        background-position: right center, center top;
        background-size: 46%;
      }
    }
  }
}