Фоновое видео масштабируется по всей странице

прямо сейчас видео масштабируется по всей странице, например, когда я начинаю прокручивать, оно не фиксируется на первой странице, а масштабируется вниз. Я хочу, чтобы оно было зафиксировано на первой странице главного экрана, например, в разрешении 1920*1080 для пользователей компьютеров

HTML :

<div class="home-video">
        <video autoplay muted loop id="bg-video">
                <source src="{% static 'core/background/background-video.mp4' %}" type="video/mp4">
            </video>
</div>

CSS :

.home-video {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
z-index: -1;
}

#bg-video {
width: auto;
height: auto;
min-width: 100%;
min-height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -1;
}

Скажите, что я делаю не так

Вернуться на верх