/*
Theme Name: Repair Center
Author: Serg DEV.
Description: Repair Center
Version: 1.0.0
Tags: one-column, two-columns, left-sidebar, right-sidebar, custom-menu, featured-images, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, e-commerce, blog, portfolio
*/

.headbanner-page.high {
    overflow: hidden;
}
.headbanner__img iframe,
.headbanner__img video,
.hero-bg-video {
	left: 0;
	height: 100%;
	object-fit: cover;
	position: absolute;
	pointer-events: none;
	top: 0;
	width: 100%;
	z-index: -1;
}
/*
.hero-bg-video.youtube {
  top: 50%;
  left: 50%;
  width: 210vh;
  height: 100vh;
  transform: translate(-50%, -50%);
}
*/

.main-services__items,
.main-catalog {
    --cols: 3;
    gap: var(--gap);
}
.main-catalog__item__img,
.main-catalog__item {
    position: relative;
}
.main-services__item__img,
.main-catalog__item__img,
.main-catalog__item h3.h3 {
	transition: 0.3s ease 0s;
}
.main-services__item:hover .main-services__item__img,
.main-catalog__item:hover .main-catalog__item__img {
    transform: scale(1.08);
}
.main-services__item__img::after,
.main-catalog__item__img::after {
    background: rgba(33, 33, 33, 0.3);
}

.main-services__item h3.h3,
.main-catalog__item h3.h3 {
	color: #fff;
	left: 18px;
    position: absolute;
    right: 18px;
	top: 18px;
	z-index: 2;
}
.main-services__items .main-services__item .btn,
.main-catalog__item__content .link {
	display: none;
}

.headbanner__img {
	height: 370px;
	position: relative;
}
.headbanner__img video,
.headbanner__img iframe {
	background-color: #000;
    border-radius: inherit;
    object-fit: contain;
    pointer-events: all;
	z-index: 0;
}

.service-page__title-above-gallery {
	margin-bottom: 40px;
}
.process-section.moved {
	padding-bottom: 0;
}

.main-services__item .main-catalog__item__content {
	padding-bottom: 28px;
}
.main-services__item__img {
	min-height: auto;
	margin-bottom: 0;
    padding-bottom: calc(62% + 2px);
}

@media (min-width: 1100px) {
	
	.headbanner__img {
		width: 554px;
		max-width: 50%;
	}
}
@media (max-width: 860px) {
	
	.main-services__items,
	.main-catalog {
		--cols: 2;
		gap: var(--gap);
	}
}
@media (max-width: 480px) {
	
	.headbanner__img {
		height: 270px;
	}
}
@media (max-width: 420px) {
	
	.main-services__items,
    .main-catalog {
        --cols: 1;
        gap: var(--gap);
    }
}