@charset "UTF-8";

.spacer { width: 100%; height: 80px;}
.scroll { font-size: 15px; position: absolute; right: calc(50% - 22px); bottom: calc(0% + 50px); color: rgba(64,34,15,1)}
	.scroll::before { background-color: rgba(64,34,15,0.4); bottom: -50px; content: ""; height: 40px; left: 0; margin: auto; position: absolute; right: 0; width: 1px;}
	.scroll::after { animation: scroll 3s infinite; background-color: rgba(64,34,15,1); bottom: -50px; content: ""; height: 40px; left: 0; margin: auto; position: absolute; right: 0; width: 1px;}
@keyframes scroll {
	0% { transform: scale(1, 0); transform-origin: 0 0; }
	50% { transform: scale(1, 1); transform-origin: 0 0; }
	51% { transform: scale(1, 1); transform-origin: 0 100%; }
	100% { transform: scale(1, 0); transform-origin: 0 100%; }
}
.video_wrapper {display: flex; justify-content: center; align-items: center; width: 100%; min-width: 1200px; margin: 0 auto; position: relative; z-index: 1;}
	.video_wrapper:not(.js_active)::before { position: absolute;top: 0; left: 0; right: 0; bottom: 0;background-color: rgba(255, 255, 255, 255.5); content: "";}
	.video_wrapper:not(.js_active)::after {position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); width: 80px; height: 80px; background-image: url("../images/loading.svg"); background-repeat: no-repeat; background-position: center; background-size: contain; content: "";}
.homemovie {width:100%; min-width: 1200px; aspect-ratio: 16 / 9;}
	.homemovie video { background-color: rgb(255, 255, 255); width: 100%; aspect-ratio: 16 / 9; height: 100%; max-height: 100%; pointer-events: none; opacity: 1; overflow: hidden;}

/* 1200 + settings */
@media all and (min-width:1200px){
	.homemovie { max-height: calc(100vh - 140px);}
}