/* Общие стили для блока с видео фоном */
.videobg {
  position: relative; /* Относительное позиционирование для дочерних элементов */
  padding: 0;
  height: 100vh; /* Высота на весь экран */
  overflow: hidden; /* Скрываем всё, что выходит за пределы блока */
  min-height: 640px; /* Минимальная высота блока */
  background-size: cover; /* Фоновое изображение или видео покрывает всю область */
}

/* Расширение для кросс-браузерности */
.videobg {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}

/* Общий стиль для сообщения и оверлея */
.videobg__video,.videobg__overlay,.videoMessage
 {
  width: 100%; /* Ширина на всю доступную область */
}

/* Позиционирование видео и оверлея */
.videobg,
.videobg__overlay {
  top: 0;
  left: 0;
}

/* Абсолютное позиционирование для видео, оверлея и текстового сообщения */
.videobg__video,
.videobg__overlay,
.videoMessage {
  position: absolute;
}

/* Стили для видео */
.videobg__video {
  z-index: 0; /* Устанавливаем слой ниже других элементов */
  opacity: 1; /* Полная непрозрачность */
  display: block; /* Блоковый элемент */
  margin: 0 auto; /* Центрирование по горизонтали */
  object-fit: cover; /* Масштабирование видео под размер блока */
  height: auto; /* Автоматическая высота */
  max-height: 100%; /* Ограничение максимальной высоты */
  min-height: 100vh; /* Минимальная высота равна высоте экрана */
}

/* Стили для затемнения (overlay) */
.videobg__overlay {
  background-color: #000; /* Чёрный цвет фона */
  opacity: 0.7; /* Прозрачность 70% */
  bottom: 0;
  right: 0;
  height: 100%; /* Высота на весь блок */
}

/* Сообщение поверх видео */
.videoMessage {
  text-align: center; /* Текст по центру */
  display: flex; /* Используем Flexbox для центрирования */
  flex-flow: column wrap; /* Размещаем элементы в колонку */
  top: 40%; /* Отступ сверху */
  bottom: 0;
  margin: auto; /* Центрирование по вертикали */
  color: #fff; /* Белый цвет текста */
}

/* Кнопка в сообщении */
.videoMessage__button {
  box-sizing: border-box; /* Учитываем границы и отступы в размерах */
  background-color: transparent; /* Прозрачный фон */
  align-self: center; /* Центрирование внутри Flex контейнера */
  padding: 10px 30px; /* Внутренние отступы */
  border-radius: 0.6em; /* Закругление углов */
  border: 2px solid #3399ff; /* Голубая рамка */
  overflow: hidden; /* Скрываем лишнее содержимое */
  margin-top: 40px; /* Отступ сверху */
  color: #fff; /* Белый цвет текста */
}

/* Убираем обводку при фокусе или наведении */
.videoMessage__button:hover,
.videoMessage__button:focus {
  outline: 0;
}

/* Добавляем эффект при наведении */
.videoMessage__button:hover {
  box-shadow: 0 0 40px 40px #3399ff inset; /* Внутренняя тень */
}
/*-----about-company-----*/
/* Общий контейнер для блоков */
.about-company {
 background-color: #eaeaea;
 height: auto;
 overflow: hidden;
}
 /* Блоки внутри обертки */
 .production {
 margin-bottom: 40px;
 }
.production__header,.join_us{
 display: -webkit-flex;
 display: -ms-flexbox;
 display: flex;}
.production__header,.partners__header{
    display: block;
    width:100%; 
    height: 108px;
    background-color: #3399ff;
    overflow: hidden;
    padding: 0px 20px;
    margin-bottom: 1rem;             
    word-wrap: break-word; 
    align-content: space-around;
    -webkit-align-content: space-around;
    -ms-flex-line-pack: distribute;
 }
.production__header,.join_us{width: 100%;}
.production__header--blue, .partners__header--blue{
    background-color: #3399ff;
}
.production__description,.partners__title{
    color: #fff;
    text-align: center; 
    font-size: calc((100vw - 280px) /(1600 - 280)*(24 - 18) + 18px);
    margin:0;
}
.production__body,.partners__body {
 position: relative;
 background-color: #fff;
 color: #808080;
 width: 100%;
 height: 500px;
 padding: 15px 20px;}
.production__item,.production__item:first-letter{
 text-transform: uppercase; }
.production__item{
 list-style:circle;            
 color: #3399ff;}       
.partners__content {
 width: 100%;
 height: 100%;
 overflow: hidden; 
 flex-wrap: wrap;}
 .partners__img{
 width:19%;
 vertical-align: middle; }
.image-blok{
 background-color: #fff;
 padding:60px 40px;
 margin: 0 auto;
 text-align: center;}
.image-block__image{
    vertical-align: middle;}
.about-company__flex,  .join_us {
  margin: 0 auto;}
.about-company__flex {
 margin-bottom: 40px; }

@media screen and (max-width: 1100px) {
    .videoMessage {
        top:25%;}
    .about-company__flex{
        flex-direction: column;
     }
    .production {
        -webkit-flex-flow: row wrap;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start; }
    .production,.partners{
        width:100%;
    }
}
@media screen and (max-width: 800px) and (orientation: landscape) {
    .production{
        flex-flow: column wrap;
        justify-content: center; }
    .about-company__flex{
        flex-flow: column wrap;
        justify-content: center; }
    .image-block__image{
        width: 100%;
        height: auto;
        max-width: 857px;}
}