.content-block.hero:after {
  background-image: url("/img/what_hero_01@1x.jpg"); }
  @media only screen and (min-width: 721px) {
    .content-block.hero:after {
      background-image: url("/img/what_hero_01@2x.jpg"); } }

.content-block.hero:before, .content-block.hero:after {
  background-position: center top;
  background-size: cover; }
  @media only screen and (min-width: 721px) {
    .content-block.hero:before, .content-block.hero:after {
      background-position: center 30%; } }

#apps .app {
  border-top: 1px #ededed solid;
  padding: 40px 0; }
  @media only screen and (min-width: 721px) {
    #apps .app {
      padding: 60px 0; } }
  #apps .app:first-of-type {
    border-top: 0 none;
    padding: 0; }
  #apps .app .app-icon img, #apps .app .app-icon svg {
    width: 56px;
    height: auto;
    margin-right: 40px; }
    @media only screen and (max-width: 720px) {
      #apps .app .app-icon img, #apps .app .app-icon svg {
        float: left;
        margin-right: 24px; } }
    @media only screen and (min-width: 721px) {
      #apps .app .app-icon img, #apps .app .app-icon svg {
        width: 96px; } }
    @media only screen and (min-width: 988px) {
      #apps .app .app-icon img, #apps .app .app-icon svg {
        width: 150px;
        height: auto;
        margin-right: 64px; } }
  #apps .app .heading {
    font-weight: 600;
    margin-bottom: 24px; }
    @media only screen and (max-width: 720px) {
      #apps .app .heading {
        font-size: 16px; } }
    #apps .app .heading h2, #apps .app .heading h3 {
      font-weight: 600;
      margin: 0; }
      @media only screen and (max-width: 720px) {
        #apps .app .heading h2, #apps .app .heading h3 {
          font-size: 22px; } }
  @media only screen and (max-width: 720px) {
    #apps .app h3 {
      font-size: 18px;
      line-height: 22px;
      margin-bottom: 0; } }
  #apps .app .feature-list {
    font-size: 16px;
    line-height: 19px; }
    @media only screen and (min-width: 988px) {
      #apps .app .feature-list {
        font-size: 18px;
        line-height: 22px; } }
    #apps .app .feature-list ul.arrow-list {
      margin-right: 2em; }
      @media only screen and (min-width: 988px) {
        #apps .app .feature-list ul.arrow-list {
          margin-right: 4em; } }
    #apps .app .feature-list .col:last-of-type ul.arrow-list {
      margin-right: 0; }
  #apps .app .laptop-ipad {
    width: 100%;
    height: auto;
    margin-top: 32px; }
    @media only screen and (min-width: 988px) {
      #apps .app .laptop-ipad {
        width: 390px;
        height: 320px; } }

#capabilities {
  text-align: center; }
  #capabilities h2 {
    margin-bottom: 48px; }
  #capabilities .flexgrid.flexgrid--1of3 {
    margin-bottom: 2em; }
    #capabilities .flexgrid.flexgrid--1of3 .col {
      padding-bottom: 1em; }
      @media only screen and (min-width: 721px) {
        #capabilities .flexgrid.flexgrid--1of3 .col {
          padding-bottom: 0; }
          #capabilities .flexgrid.flexgrid--1of3 .col .pad-wrapper {
            padding-left: 16px;
            padding-right: 16px; }
          #capabilities .flexgrid.flexgrid--1of3 .col:first-of-type .pad-wrapper {
            padding-left: 0;
            padding-right: 32px; }
          #capabilities .flexgrid.flexgrid--1of3 .col:last-of-type .pad-wrapper {
            padding-left: 32px;
            padding-right: 0; } }
    #capabilities .flexgrid.flexgrid--1of3 figure {
      margin: 0 auto 32px;
      width: 152px;
      height: 150px;
      padding-left: 18px; }

#scalability {
  text-align: center; }
  #scalability .flexgrid {
    text-align: left; }
    @media only screen and (max-width: 720px) {
      #scalability .flexgrid .col:first-child {
        float: left; } }
    #scalability .flexgrid .hand-image {
      position: relative;
      width: 100px;
      height: 150px;
      margin-right: 24px;
      overflow: hidden;
      border-top-left-radius: 15px;
      border-bottom-right-radius: 15px; }
      @media only screen and (min-width: 721px) {
        #scalability .flexgrid .hand-image {
          width: 246px;
          height: 369px;
          margin-right: 56px; } }
      @media only screen and (min-width: 1140px) {
        #scalability .flexgrid .hand-image {
          margin-right: 92px; } }
      #scalability .flexgrid .hand-image .cloud {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: auto; }
    #scalability .flexgrid .service-images {
      padding-top: 24px; }
      @media only screen and (min-width: 721px) {
        #scalability .flexgrid .service-images {
          padding-top: 60px; } }
      #scalability .flexgrid .service-images .aws {
        margin-right: 48px;
        width: auto;
        height: 60px; }
      #scalability .flexgrid .service-images .ms-azure {
        width: auto;
        height: 60px; }

#integration {
  text-align: center; }
  #integration h2 {
    margin-bottom: 24px; }
    @media only screen and (min-width: 988px) {
      #integration h2 {
        margin-bottom: 60px; } }
  @media only screen and (min-width: 721px) {
    #integration .col ul.stat-list {
      margin-right: 0.5em; } }
  @media only screen and (min-width: 988px) {
    #integration .col ul.stat-list {
      margin-right: 1em; } }
  @media only screen and (min-width: 721px) {
    #integration .col:last-of-type ul.stat-list {
      margin-left: 0.5em;
      margin-right: 0; } }
  @media only screen and (min-width: 988px) {
    #integration .col:last-of-type ul.stat-list {
      margin-left: 1em; } }
  #integration ul.stat-list {
    text-align: left;
    margin-bottom: 0;
    padding-bottom: 0;
    border: 0 none; }
    #integration ul.stat-list li {
      font-size: 16px;
      height: 50px;
      line-height: 50px; }
      @media only screen and (min-width: 988px) {
        #integration ul.stat-list li {
          height: 60px;
          line-height: 60px;
          font-size: 1rem; } }
      #integration ul.stat-list li h3 {
        font-size: 18px;
        line-height: 50px; }
        @media only screen and (min-width: 988px) {
          #integration ul.stat-list li h3 {
            font-size: 24px;
            line-height: 60px; } }
      #integration ul.stat-list li.no-link,
      #integration ul.stat-list li a {
        display: block;
        padding-left: 100px;
        height: 50px;
        line-height: 50px; }
        @media only screen and (min-width: 988px) {
          #integration ul.stat-list li.no-link,
          #integration ul.stat-list li a {
            height: 60px;
            line-height: 60px;
            padding-left: 128px; } }
      #integration ul.stat-list li a {
        color: #323232;
        text-decoration: none;
        cursor: pointer; }
        #integration ul.stat-list li a:hover {
          background-color: white; }
      #integration ul.stat-list li img {
        position: absolute;
        left: 0;
        top: 0;
        width: auto;
        height: 50px; }
        @media only screen and (min-width: 988px) {
          #integration ul.stat-list li img {
            top: 0;
            height: 60px; } }
      #integration ul.stat-list li.heading {
        padding-left: 12px; }