@use "../../mixins" as *;
@use "../../variables" as *;

.organizers {
  margin-bottom: 50px;
  @include responsive(lg) {
    margin-bottom: 75px;
  }

  &__content {
    position: relative;

    background-color: $bg-color-light;
    padding: 1rem;
    min-height: 442.83px;

    @include responsive(md) {
      padding: 2rem 3rem;
    min-height: 642.83px;

    }
  }


  &__block {
    position: relative;
    z-index: 1;

    background-color: $primary-color;
    display: grid;
    place-items: start;
    grid-template-columns: 1fr;
    padding: 1rem;
    gap: 0.75rem;

    @include responsive(md) {
      grid-template-columns: 1fr 3fr;
    gap: 1.75rem;

      padding: 2rem 3rem;
    }
  }

  &__title {
    color: $white-color;
    margin-bottom: 0;
  }

  &__text {
    color: $white-color;
  }

  &__img {
    width: 100%;
    min-height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    right: 0;
  }
}