@keyframes vimeofadein {

	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}

}



.spire-youtube-bg{
	position: relative;
	z-index: 0;
	margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    max-width: 100vw;
	height: 100vh;
    width: 100vw;
	overflow: hidden;
    padding-left: 0;
    padding-right: 0;
    clear: both;
	background-color: black;
	/* border: 1px solid red; */
}
	.spire-youtube-container{
		/* bottom: 0;
		right: 0;
		top: 0;
		left: 0;
		position: absolute;
		overflow: hidden;	 */
		animation: vimeofadein 6s;

		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		position: absolute;
		height: 100%;
	}
	.spire-youtube-container .spire-player{
		width: 100vw;
		min-height: 100vh;

		height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
		min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */

		position: absolute;
		/* top: 50%;
		left: 50%;
		transform: translate(-50%, -50%); */

		/* position: absolute;
		pointer-events: none;
		margin: 0 auto;
		
		height: 300vh;  
		width: 120vw; */
	}
	@media (max-width: 767px) {
		
		.spire-youtube-container .spire-player{
			/* 
			width="640" height="947"  
			947/640*100 = 147,96875
			640/947*100 = 67,5818373812
			*/
			height: 147.97vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
			min-width: 67.58vh; 
			/* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
		}


	}




/*Content */
.spire-youtube-content-wrapper{
	bottom: 0px;
	right: 0;
	top: 35vh;
	left: 0;

	padding-bottom: 80px;

	position: absolute;
	z-index: 10000;
	overflow: hidden;

	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	animation: vimeofadein 6s;

	color: #fff;
	/* border: 1px solid red; */
	background: linear-gradient(0deg, rgba(24,24,24,1) 0%, rgba(24,24,24,1) 10%, rgba(24,24,24,0) 15%);
}

	.spire-youtube-content-heading{
		flex-grow: 1;
		max-width: 850px;
		padding: 0 25px;
		/* border: 1px solid red; */
	}
		:root .spire-youtube-content-wrapper h1{
			color: #fff;
			text-align: center;
			font-size: 32px;
			line-height: 1em;
			font-weight: 300;
			font-family: trasandina;
			text-transform: uppercase;
			/* text-shadow: 0px 0px 3px #000; */
			/* border: 1px solid red; */
		}
@media (min-width: 768px) {
	.spire-youtube-content-wrapper{
		top: 38vh;
		
	}
	:root .spire-youtube-content-wrapper h1{
		font-size: 86px;
	}
}


.spire-youtube-content-inner-blocks{
	/* border: 1px solid gray; */
	padding: 0 5px;
}



	

	.spire-youtube.scroll-link{
		/* margin-top: 40px; */
		margin-top: 10px;
		margin-bottom: 30px;
		display: block;
		text-decoration: none;
		text-align: center;
		font-size: 14px;
		color: #fff;
		/* border: 1px solid red; */
	}
	.spire-youtube.scroll-link:hover{
		color: var(--global-palette1);
	}

	.spire-youtube.scroll-link path{
		fill: #fff;
	}
	.spire-youtube.scroll-link:hover path{
		fill: var(--global-palette1);
	}



/*
Legg til "center-vertical" klasse for senterere
*/
.spire-youtube-bg.center-vertical{}

.spire-youtube-bg.center-vertical .spire-youtube-content-wrapper{
	top: 0;
	justify-content: center;
}
.spire-youtube-bg.center-vertical .spire-youtube-content-wrapper .spire-youtube-content-heading {
	flex-grow:0;
}