@import "~styles/mixins";

.contact {
  display: flex;
  > * {
    width: 50%;
    padding: 50px 20px;
    position: relative;
  }
  @include tablet {
    height: auto;
    display: block;
    > * {
      width: 100%;
    }
  }

  .background {
    @include absolute-fill;
    z-index: -1;
    object-fit: cover;
  }
  .title-wrapper {
    position: relative;
    margin-bottom: 20px;
  }
  .left {
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
  }
  .content {
    text-align: center;
    max-width: 410px;
  }
  .right {
    color: $color_secondary;
    .content {
      margin: auto;
    }
  }
  h2 {
    @include heading1;
    margin: 0;
  }
}
