/* Start:/local/templates/v1/components/bitrix/news/staff/style.css?178937520175*/
/* Стили комплексного шаблона bitrix:news:staff */

/* End */


/* Start:/local/templates/v1/components/bitrix/news/staff/bitrix/news.list/.default/style.css?17932496302267*/
/* Стили блока bitrix:news:staff */

/* Видео на карточке: ролик лежит поверх фотографии в том же окне и проявляется
   по наведению. Ролики вертикальные (9:16), а окно фото почти квадратное, так
   что кадр заполняет его по ширине и обрезается по высоте. Держим верх кадра:
   лицо в таких роликах в верхней трети, а низ окна при наведении всё равно
   закрывает растворяющаяся полоса панели со специализацией. Горизонтальный
   ролик встанет так же — по высоте, с обрезкой боков по центру. */

.specialists__item-video {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s linear;
}

/* С обложкой ролик показываем сразу при наведении — пока он грузится, видна
   обложка (первый кадр). Без обложки ждём первого кадра, иначе мелькнёт пустое
   окно. Классы ставит script.js. */

.specialists__item.is-video-on .specialists__item-video[poster],
.specialists__item.is-video-playing .specialists__item-video {
    opacity: 1;
}

/* Кадр ролика и обложки, которая стоит в карточке вместо фото, — одно значение
   на двоих: разойдутся — при наведении картинка сдвинется. */

.specialists__item-video,
.specialists__item-image .specialists__item-poster {
    object-position: 50% 15%;
}

/* На тач-экранах и в адаптиве наведения нет — ролик не грузим и не показываем
   (те же условия, что у всплывающей панели). */

@media (hover: none), (max-width: 992px) {
    .specialists__item-video {
        display: none;
    }
}

/* End */
/* /local/templates/v1/components/bitrix/news/staff/style.css?178937520175 */
/* /local/templates/v1/components/bitrix/news/staff/bitrix/news.list/.default/style.css?17932496302267 */