.logotypes {
  margin-top: 40px;
  margin-bottom: 40px;
}
@media (min-width: 768px) {
  .logotypes {
    margin-top: 64px;
    margin-bottom: 64px;
  }
}
.logotypes .general-container {
  /*  display: flex;
        flex-direction: column;
        gap: 32px;

        @media (min-width: @bp-m) {
            gap: 64px;
        } */
}
.logotypes .general-container .logotypesTitle {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
  margin-bottom: 32px;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypesTitle {
    gap: 32px;
    margin-bottom: 64px;
  }
}
.logotypes .general-container .logotypesTitle h2 {
  font-family: 'N27 Bold';
  font-weight: 700;
  font-style: normal;
  font-size: 40px;
  line-height: 48px;
  color: #333f48;
  text-transform: uppercase;
  width: 100%;
  hyphens: auto;
  word-break: auto-phrase;
}
@media (min-width: 1024px) {
  .logotypes .general-container .logotypesTitle h2 {
    font-size: 48px;
    line-height: 56px;
  }
}
@media (min-width: 1600px) {
  .logotypes .general-container .logotypesTitle h2 {
    font-size: 64px;
    line-height: 72px;
  }
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypesTitle h2 {
    hyphens: none;
    word-break: normal;
  }
}
.logotypes .general-container .logotypesTitle p {
  font-size: 20px;
  line-height: 28px;
  /* 140% */
  font-family: 'N27 Regular';
  font-weight: 400;
  font-style: normal;
  color: #333f48;
}
.logotypes .general-container .logotypes-container {
  mix-blend-mode: color-burn;
}
.logotypes .general-container .logotypes-container.logo-left,
.logotypes .general-container .logotypes-container.logo-fluid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.logotypes .general-container .logotypes-container.logo-fluid {
  row-gap: 24px;
  column-gap: 16px;
  justify-content: space-evenly;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.logo-fluid {
    row-gap: 40px;
    column-gap: 90px;
  }
}
.logotypes .general-container .logotypes-container.logo-fluid img {
  max-height: 38px;
  min-width: 24%;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.logo-fluid img {
    max-height: 58px;
    min-width: 10%;
  }
}
.logotypes .general-container .logotypes-container.logo-left {
  row-gap: 16px;
  column-gap: 24px;
  justify-content: flex-start;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.logo-left {
    row-gap: 40px;
    column-gap: 48px;
  }
}
.logotypes .general-container .logotypes-container.logo-left img {
  max-height: 40px;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.logo-left img {
    max-height: 46px;
  }
}
.logotypes .general-container .logotypes-container.js-carousel {
  display: flex;
  overflow: auto;
  gap: 40px;
  /* Hide scrollbar for Chrome, Safari and Opera */
  /* Hide scrollbar for IE, Edge and Firefox */
  scrollbar-width: none;
  /* Firefox */
  -ms-overflow-style: none;
  /* IE and Edge */
}
.logotypes .general-container .logotypes-container.js-carousel::-webkit-scrollbar {
  display: none;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.js-carousel {
    gap: 80px;
  }
}
.logotypes .general-container .logotypes-container.js-carousel img {
  max-height: 40px;
}
@media (min-width: 768px) {
  .logotypes .general-container .logotypes-container.js-carousel img {
    max-height: 58px;
  }
}