/**
 * Deps: magnific-popup
 */
.hero-row {
  position: relative; }
  .hero-row > .container {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
    padding-top: 90px;
    padding-bottom: 90px; }
    .hero-row > .container > .left-side,
    .hero-row > .container > .right-side {
      width: 50%; }
    .hero-row > .container .left-side {
      padding-right: 100px;
      min-width: 640px;
      flex-shrink: 0; }
    .hero-row > .container .pretitle {
      text-transform: uppercase;
      font-weight: bold;
      letter-spacing: 0.05em; }
      .hero-row > .container .pretitle + .title {
        margin-top: .5em; }
    .hero-row > .container .title {
      background: -webkit-linear-gradient(270deg, #29A9E0 0%, #1E3C4D 100%);
      background: -moz-linear-gradient(270deg, #29A9E0 0%, #1E3C4D 100%);
      background: -o-linear-gradient(270deg, #29A9E0 0%, #1E3C4D 100%);
      background: linear-gradient(270deg, #29A9E0 0%, #1E3C4D 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      margin-bottom: 0;
      font-size: 60px; }
      .hero-row > .container .title + .button-group {
        margin-top: 30px; }
      @media (max-width: 1399px) {
        .hero-row > .container .title {
          font-size: 48px; } }
      @media (max-width: 991px) {
        .hero-row > .container .title {
          font-size: 40px; } }
    .hero-row > .container .button-group {
      margin-top: 20px; }
    .hero-row > .container .image-container {
      transform-style: preserve-3d;
      transform: translateZ(20px); }
      .hero-row > .container .image-container img {
        box-shadow: 40px 40px 60px #00000063;
        border-radius: 10px;
        display: block; }
      .hero-row > .container .image-container .video-popup-link {
        position: relative;
        width: 100%;
        height: 100%;
        transform-style: preserve-3d;
        display: block; }
        .hero-row > .container .image-container .video-popup-link:before {
          content: '';
          position: absolute;
          top: 50%;
          left: 50%;
          margin-top: 0px;
          margin-left: -8px;
          width: 34px;
          height: 24px;
          background: rgba(0, 0, 0, 0.5);
          transform: scale(2);
          border-radius: 5px;
          transform-style: preserve-3d;
          transition: .2s ease all;
          transform: scale(2) translateZ(60px); }
        .hero-row > .container .image-container .video-popup-link > .play-button {
          position: absolute;
          top: 50%;
          left: 50%;
          border-top: 12px solid transparent;
          border-bottom: 12px solid transparent;
          border-left: 24px solid #ffffff;
          transform-style: preserve-3d;
          transform: translateZ(60px);
          transition: .3s ease all;
          z-index: 1; }
          .hero-row > .container .image-container .video-popup-link > .play-button:active {
            transform: scale(0.95); }
        .hero-row > .container .image-container .video-popup-link:active:before {
          transform: scale(2.5) translateZ(60px); }
        .hero-row > .container .image-container .video-popup-link:hover:before, .hero-row > .container .image-container .video-popup-link:focus:before {
          background: #29A9E0; }
  .hero-row .slanty-lines {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    opacity: 0;
    transition: .3s ease all; }
    .hero-row .slanty-lines .slanty-line-1,
    .hero-row .slanty-lines .slanty-line-2 {
      position: absolute;
      bottom: 0vw;
      right: 0;
      width: 100%; }
      .hero-row .slanty-lines .slanty-line-1 span,
      .hero-row .slanty-lines .slanty-line-2 span {
        position: absolute;
        bottom: 100px;
        right: 0;
        width: 100%;
        max-height: 170px;
        height: 10vw;
        background: #29A9E0;
        opacity: .5;
        transform: skewY(-10deg); }
    .hero-row .slanty-lines .slanty-line-2 span {
      background: #3b6e8f;
      opacity: .5;
      width: calc( 100% - 60px);
      transform: translateY(8vw) skewY(-10deg); }
  .hero-row.initialized .slanty-lines {
    opacity: 1; }
  article > .hero-row:first-child {
    margin-bottom: 9vw; }
    article > .hero-row:first-child .slanty-lines {
      overflow: visible; }
      article > .hero-row:first-child .slanty-lines .slanty-line-1,
      article > .hero-row:first-child .slanty-lines .slanty-line-2 {
        bottom: -6vw; }
      article > .hero-row:first-child .slanty-lines .slanty-line-2 span {
        transform: translateY(5vw) skewY(-10deg); }
  .hero-row.no-image {
    padding-bottom: 15vw; }
    .hero-row.no-image > .container .left-side {
      min-width: none; }
  @media (min-width: 768px) {
    .hero-row.no-image {
      padding-bottom: 0; }
      .hero-row.no-image .slanty-lines {
        width: 50%; }
        .hero-row.no-image .slanty-lines .slanty-line-1,
        .hero-row.no-image .slanty-lines .slanty-line-2 {
          bottom: 30%; }
        .hero-row.no-image .slanty-lines .slanty-line-2 span {
          width: calc( 100% - 30%);
          transform: translateY(40%) skewY(-10deg); } }
  @media (max-width: 1170px) {
    .hero-row > .container .left-side {
      padding-right: 40px; } }
  @media (max-width: 991px) {
    .hero-row > .container .title {
      font-size: 32px; }
    .hero-row > .container .left-side {
      min-width: auto; } }
  @media (max-width: 767px) {
    article > .hero-row:first-child .slanty-lines .slanty-line-1,
    article > .hero-row:first-child .slanty-lines .slanty-line-2 {
      bottom: -12vw; }
    .hero-row > .container {
      display: flex;
      flex-wrap: wrap;
      padding-top: 60px;
      padding-bottom: 60px; }
      .hero-row > .container > .left-side {
        width: 100%;
        padding-right: 0;
        min-width: none; }
      .hero-row > .container > .right-side {
        order: -1;
        width: 100%;
        margin-bottom: 30px; } }
