@-webkit-keyframes fadeIn1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem);
  }
}
@keyframes fadeIn1 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem);
  }
}

@-webkit-keyframes fadeIn2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  50% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem);
  }
}

@keyframes fadeIn2 {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  50% {
    opacity: 0;
    -webkit-transform: translateY(20rem);
            transform: translateY(20rem);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem);
  }
}

html {
  font-size: 1px;
}

/* auto scale down elements on mobile */
@media (max-width: 580px) {
  html {
    font-size: 1px;
  }
}

/* auto scale up elements on large displays */
@media (min-width: 2560px) {
  html {
    font-size: 1px;
  }
}

section.u4m-cards-company-values {
  margin-top: 100rem;
  margin-bottom: 100rem;
}

section.u4m-cards-company-values.reverse-text h2.heading,
section.u4m-cards-company-values.reverse-text h3.subheading {
  color: #fff;
}

section.u4m-cards-company-values .heading {
  float: none;
  margin-left: auto;
  margin-right: auto;
  max-width: 1240rem;
  padding-left: 20rem;
  padding-right: 20rem;
  font-family: "Cabin Sketch";
  font-size: 44rem;
  font-weight: bold;
  letter-spacing: .25rem;
  margin-bottom: 30rem;
  line-height: 1.2;
  text-align: center;
  margin-bottom: 5rem;
}

section.u4m-cards-company-values .heading span {
  color: #FF3131;
} /* NEW - red highlighting for header */

@media (max-width: 580px) {
  section.u4m-cards-company-values .heading {
    font-size: 32rem;
    margin-bottom: 20rem;
  }
}

/* NEW REMOVE - section.u4m-cards-company-values .heading:after {
  content: '';
  background-image: url("https://f.hubspotusercontent20.net/hubfs/2599020/line-green.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50%;
  height: 5rem;
  width: 100%;
  display: block;
  margin-top: 10rem;
} */

section.u4m-cards-company-values .subheading {
  float: none;
  margin-left: auto;
  margin-right: auto;
  max-width: 1240rem;
  padding-left: 20rem;
  padding-right: 20rem;
  max-width: 1000rem;
  margin-top: 10rem;
  font-family: "Raleway";
  font-size: 22rem;
  line-height: 1.6;
  letter-spacing: .25rem;
  margin-bottom: 20rem;
  font-weight: normal;
  text-align: center;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .subheading {
    font-size: 17rem;
  }
}

section.u4m-cards-company-values .subheading strong {
  font-size: 25rem;
}

section.u4m-cards-company-values .wrapper {
  float: none;
  margin-left: auto;
  margin-right: auto;
  max-width: 1240rem;
  padding-left: 20rem;
  padding-right: 20rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper {
    display: block;
  }
}

section.u4m-cards-company-values .wrapper div.card {
  margin: 30rem;
  padding: 20rem;
  -webkit-box-shadow: 0rem 1rem 12rem 0 rgba(20, 29, 62, 0.1);
          box-shadow: 0rem 1rem 12rem 0 rgba(20, 29, 62, 0.1);
  background-color: #f3f5f7;
  -ms-flex-preferred-size: calc(33.333% - 60rem);
      flex-basis: calc(33.333% - 60rem);
  -webkit-box-flex: 0;
      -ms-flex-positive: 0;
          flex-grow: 0;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card {
    width: 100%;
    margin: 0 0 30rem 0;
  }
}

section.u4m-cards-company-values .wrapper div.card:hover {
  top: -10rem;
}

section.u4m-cards-company-values .wrapper div.card button {
  display: inline-block;
  font-family: "Raleway";
  color: #ff3131;
  background-color: transparent;
  border: solid 2rem #ff3131;
  border-radius: 50rem;
  padding: 13rem 30rem;
  margin: 20rem 0;
  -webkit-transition: 0.1s ease-in;
  transition: 0.1s ease-in;
  font-weight: bold;
  letter-spacing: .25rem;
  text-decoration: none;
  cursor: pointer;
  text-transform: uppercase;
  padding: 8rem 20rem 7rem 20rem;
  font-size: 12rem;
  line-height: 1.2;
}

section.u4m-cards-company-values .wrapper div.card button:hover {
  background-color: #ff3131;
  color: #fff;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card {
    margin-bottom: 50rem;
  }
}

section.u4m-cards-company-values .wrapper div.card div.image {
  width: 100%;
  height: 152rem;
  background-size: cover;
  background-position: 50% 50%;
  margin: 0 0 20rem;
}

section.u4m-cards-company-values .wrapper div.card div.image.filled {
  width: 100%;
  min-height: 203rem;
  background-size: cover;
  background-position: 50%;
  border-bottom: 1rem solid #f3f5f7;
}

section.u4m-cards-company-values .wrapper div.card div.image a {
  display: block;
  margin: 0 auto;
  background-color: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
}

section.u4m-cards-company-values .wrapper div.card div.image a:hover {
  background-color: transparent;
}

section.u4m-cards-company-values .wrapper div.card div.image img {
/* NEW REMOVE - max-width: 120rem; */
  max-width: 100%;
  height: auto;
  display: block;
/* NEW REMOVE - margin: 50rem auto 0 auto; */
  padding: 20rem 30rem; /* NEW */
/*   margin: auto; */
  /* text-align: center; /* NEW */ 
} /* NEW - controls the image at the top of the card */

@media (max-width: 768px) and (min-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.image img {
    width: 100%;
    height: auto;
    margin-top: -20rem;
  }
} /* NEW - displays card images properly on iPad */

section.u4m-cards-company-values .wrapper div.card div.content {
  padding: 20rem 30rem 0;
  margin-top: 10rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  height: calc(100% - 150rem);
  text-align: center;
}

@media (max-width: 768px) and (min-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.content {
    padding: 20rem 20rem 20rem 30rem;
    margin-top: 225rem;
  }
} /* NEW - displays card text properly on iPad */


@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.content {
    margin-bottom: 20rem;
    padding-left: 30rem;
    padding-right: 30rem;
  }
}

section.u4m-cards-company-values .wrapper div.card div.content span.url {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

section.u4m-cards-company-values .wrapper div.card div.content span.type {
  font-family: "Raleway";
  font-size: 13rem;
  line-height: 1.6;
  letter-spacing: .35rem;
  margin-bottom: 20rem;
  font-weight: bold;
  color: #7C98B6;
  font-weight: bold;
  text-transform: uppercase;
  margin-bottom: 0;
  text-align: center;
  width: 100%;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.content span.type {
    font-size: 13rem;
  }
}

section.u4m-cards-company-values .wrapper div.card div.content span.title {
  font-family: "Cabin Sketch";
  font-size: 24rem;
  font-weight: bold;
  letter-spacing: .25rem;
  margin-bottom: 30rem;
  line-height: 1.2;
  color: #141D3E;
  margin: 0;
  text-align: left;
  margin-bottom: 10rem;
}

section.u4m-cards-company-values .wrapper div.card div.content span.title span {
  color: #FF3131;
} /* NEw */

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.content span.title {
    font-size: 18rem;
    margin-bottom: 10rem;
  }
}

section.u4m-cards-company-values .wrapper div.card div.content span.teaser {
  font-family: "Raleway";
  font-size: 13rem;
  line-height: 1.6;
  letter-spacing: .35rem;
  margin-bottom: 20rem;
  font-weight: bold;
  color: #141d3e;
  text-align: left;
}

@media (max-width: 580px) {
  section.u4m-cards-company-values .wrapper div.card div.content span.teaser {
    font-size: 13rem;
  }
}

section.u4m-cards-company-values .wrapper div.card div.content span.cta,
section.u4m-cards-company-values .wrapper div.card div.content span.url {
  margin-top: auto;
  width: 100%;
}

section.u4m-cards-company-values .wrapper div.card div.content span.cta a,
section.u4m-cards-company-values .wrapper div.card div.content span.url a {
  display: inline-block;
  font-family: "Raleway";
  color: #ff3131;
  background-color: transparent;
  border: solid 2rem #ff3131;
  border-radius: 50rem;
  padding: 13rem 30rem;
  margin: 20rem 0;
  -webkit-transition: 0.1s ease-in;
  transition: 0.1s ease-in;
  font-weight: bold;
  letter-spacing: .25rem;
  text-decoration: none;
  cursor: pointer;
  text-transform: uppercase;
  padding: 8rem 20rem 7rem 20rem;
  font-size: 12rem;
  line-height: 1.2;
}

section.u4m-cards-company-values .wrapper div.card div.content span.cta a:hover,
section.u4m-cards-company-values .wrapper div.card div.content span.url a:hover {
  background-color: #ff3131;
  color: #fff;
}

@media (max-width: 1024px) {
  section.u4m-cards-company-values .wrapper.three div.card {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(50% - 60rem);
            flex: 0 0 calc(50% - 60rem);
  }
}

@media (max-width: 768px) {
  section.u4m-cards-company-values .wrapper.three div.card {
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
  }
}

section.u4m-cards-company-values .wrapper.four div.card {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(25% - 60rem);
          flex: 0 0 calc(25% - 60rem);
}

section.u4m-cards-company-values .wrapper.four div.card .content .title {
  font-size: 18rem;
}

@media (max-width: 1024px) {
  section.u4m-cards-company-values .wrapper.four div.card {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(40% - 60rem);
            flex: 0 0 calc(40% - 60rem);
  }
}

@media (max-width: 768px) {
  section.u4m-cards-company-values .wrapper.four div.card {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 60rem);
            flex: 0 0 calc(100% - 60rem);
  }
}

section.u4m-cards-company-values .wrapper.two div.card {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(50% - 60rem);
          flex: 0 0 calc(50% - 60rem);
}

@media (max-width: 1024px) {
  section.u4m-cards-company-values .wrapper.two div.card {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(40% - 60rem);
            flex: 0 0 calc(40% - 60rem);
  }
}

@media (max-width: 768px) {
  section.u4m-cards-company-values .wrapper.two div.card {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 60rem);
            flex: 0 0 calc(100% - 60rem);
  }
}