.hero_banner_block {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
}

.hero_banner_block__column {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: center;
    
    background-image: var(--hero-banner-column-image);
    background-repeat: no-repeat;
    background-size: cover;

    gap: 15px;
    /* padding: 15px; */
    color:#fff;
    padding: 10rem 40px 10rem 40px;

    position: relative;
}

@media screen and (max-width: 767px) {
    .hero_banner_block {
        flex-direction: column;
    }

    .hero_banner_block__column--center {
        align-items: flex-start!important;
        text-align: left!important;
    }

    .hero_banner_block__column--right {
        align-items: flex-end!important;
        text-align: right!important;
    }

    .hero_banner_block__column--right .hero_banner_block__column--description {
        margin: 0!important;
        text-align: right!important;
    }

    .hero_banner_block__column .hero_banner_block__column--description {
        margin: auto 0!important;
    }
}

.hero_banner_block__column--center {
    align-items: center;
    text-align: center;
}

.hero_banner_block__column--left {
    align-items: start;
}

.hero_banner_block__column--right {
    align-items: end;
}

.hero_banner_block__cta {
    display: flex;
}

.hero_banner_block__cta--horizontal {
    flex-direction: row;
}

.hero_banner_block__cta--vertical {
    flex-direction: column;
}

.hero_banner_block__column--overlay{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    opacity: .5;
    z-index: 0;
}

.hero_banner_block__column .hero_banner_block__column--title {
    font-weight: 400;
    font-size: 24px;
    line-height: 34px;
    z-index:1;
    padding: 10px 0px;
}

.hero_banner_block__column .hero_banner_block__column--description {
    font-weight: 400;
    z-index:1;

    position: relative;
    /* width: 90%; */
    width: 100%;
    margin: auto;

    font-size: 16px;
    line-height: 26px;

    /* padding: 10px 0px; */
    padding: 0px;
}

.single .hero_banner_block__column .hero_banner_block__column--description {
  font-size: 12px!important;
}

/* button */
.hero_banner_block__column .button {
    position: relative;
  
    display: inline-block;
    padding: 20px;  
    cursor: pointer;
    overflow: hidden;
    
    transition: color 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    text-transform: uppercase;
    font-weight: 400;
    font-size: 11.2px;
    cursor: pointer;
    overflow: hidden;
  }

  .hero_banner_block__column .button:hover {
    color: #00A3E0;
  }

  .hero_banner_block__column .button:before, .hero_banner_block__column .button:after {
    content: "";
    position: absolute;
    left: -13px;
    height: 2px;
    width: 105%;
    background-color: #FFF;
  }
  .hero_banner_block__column .button:before {
    top: 0;
  }
  .hero_banner_block__column .button:after {
    bottom: 0;
  }
  .hero_banner_block__column .button:hover > * > *:before, .hero_banner_block__column .button:hover > * > *:after {
    transform: translate3d(0, 0, 0);
  }
  .hero_banner_block__column .button:hover > * > * > *:before, .hero_banner_block__column .button:hover > * > * > *:after {
    transform: translate3d(0, 0, 0);
  }
  .hero_banner_block__column .button > *:before, .hero_banner_block__column .button > *:after {
    content: "";
    position: absolute;
    top: 0;
    height: 100%;
    width: 2px;
    background-color: #FFF;
  }
  .hero_banner_block__column .button > *:before {
    left: 0;
  }
  .hero_banner_block__column .button > *:after {
    right: 0;
  }
  .hero_banner_block__column .button > * > *:before, .hero_banner_block__column .button > * > *:after {
    content: "";
    position: absolute;
    left: 0;
    z-index: 9;
    height: 2px;
    width: 100%;
    background-color: #00A3E0;
  }
  .hero_banner_block__column .button > * > *:before {
    top: 0;
    transform: translate3d(-105%, 0, 0);
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .hero_banner_block__column .button > * > *:after {
    bottom: 0;
    transform: translate3d(105%, 0, 0);
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .hero_banner_block__column .button > * > * > *:before, .hero_banner_block__column .button > * > * > *:after {
    content: "";
    position: absolute;
    top: 0;
    z-index: 9;
    height: 100%;
    width: 2px;
    background-color: #00A3E0;
  }
  .hero_banner_block__column .button > * > * > *:before {
    left: 0;
    transform: translate3d(0, 105%, 0);
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .hero_banner_block__column .button > * > * > *:after {
    right: 0;
    transform: translate3d(0, -105%, 0);
    transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .hero_banner_block--secondary {
    /* background-size: contain!important; */
  }

  .hero_banner_block--secondary .hero_banner_block__column--title, .hero_banner_block--secondary .hero_banner_block__column--description {
    color:#000!important;
  }

  .hero_banner_block--secondary .hero_banner_block__column--description {
    font-size: 12px;
  }


  

  .hero_banner_column_image {
    display: none;
  }

  @media screen and (max-width: 767px) {
    .hero_banner_column_image {
      display: none;
    }

    .single .hero_banner_block {
      background-image: unset!important;
    }

    .hero_banner_block__column {
      padding: 20px 40px!important;
    }
  }



  .hero_banner_block__column__more {
    /* display: none; */
    font-size: 12px;
  }

  .hero_banner_block__column__more--image {
    max-width: 100%;
    height: auto;
  }

  .hero_banner_block__column__more--title {
    padding: 20px;
    line-height: 22px;
    font-weight: 800;
  }

  .hero_banner_block__column__more--text {
    padding: 20px;
    line-height: 22px;
  }