main.post{
	display:flex;
	justify-content:center;
	width:100%;
}

/*
.content-wrapper{
	width:100%;
	max-width:800px;
	margin-top:128px!important;
}
*/

header{
	background-color:rgba(0,0,0,0.444)!important;
	backdrop-filter:blur(16px);
	max-width:1280px;
}

/* hero video cropping */

.hero-video-container{
	position:relative;
	height:100vh;
	width:100%;
}

.hero-video{
	height:100vh;
}

.hero-video-overlay{
	background-image:url("./assets/images/pattern3_black.png");
	background-blend-mode:lighten;
	background-size:3px;
	position:absolute;
	height:100vh;
	width:100%;
	top:0px;
	left:0px;
	opacity:0.3;
}

/* post hero video and content */

.post-hero-title{
	font-size:6em;
	margin-bottom:0px;
	text-shadow:0px 3px 2px rgba(0,0,0,1);
}

.post-hero-category{
	display:inline-block;
	margin-top:0px;
	font-size:2em;
	text-shadow:0px 3px 2px rgba(0,0,0,1);
}

.post-hero-year{
	display:inline-block;
	margin-top:0px;
	font-size:2em;
	text-shadow:0px 3px 2px rgba(0,0,0,1);
}

.post-hero-desc{
	margin-top:2em;
	padding-left:2em;
	padding-right:2em;
	font-size:1.5em;
	text-shadow:0px 2px 1px rgba(0,0,0,1);
}

.post-hero-video-text-container{
	position: absolute;
	bottom:20%;
	left:0px;
	width:100%;
	height:auto;
	text-align:center;
}

.post-hero-video-text-container-inner{
	max-width:800px;
	display:inline-block;
}

/* frost header */

.menu-menu-container{
	height:100%;
}

.custom-logo-link{
	height:100%;
	display:block;
}

.frost-header{
	width:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	position:fixed;
	top:0px;
	left:0px;
	z-index:10000;
	padding:1em;
	background-color:rgba(0,0,0,0.444);
	backdrop-filter:blur(16px);
	transition: transform 1s;
}

.frost-header[hidden="1"]{
	transform:translatey(-100%);
}

.frost-header-container{
	width:100%;
	max-width:1280px;
	display:grid;
	grid-template-columns: 1fr 1fr;
}

/* interactive logo start */

@keyframes logo_shrink {
  from {width: 100%;}
  to {width: 100px; }
}

.frost-logo-box{
	width:100px;
	display:flex;
	flex-wrap:nowrap;
	justify-content:flex-start;
	transition: width 10s;
	cursor:pointer;
	animation: logo_shrink;
	animation-duration: 3s;
}

.frost-logo-start{
	background-image:url("./assets/images/logo_start.svg");
	background-repeat:no-repeat;
	height:40px;
	width:38px;
	display:block;
}

.frost-logo-middle{
	background-image:url("./assets/images/logo_middle.svg");
	background-repeat:repeat-x;
	height:40px;
	width:auto;
	flex-grow:1;
	display:block;
}

.frost-logo-end{
	background-image:url("./assets/images/logo_end.svg");
	background-repeat:no-repeat;
	height:40px;
	width:57px;
	display:block;
}



.frost-logo-box:hover{
	width:100%;
}

/* interactive logo end */

.header-menu{
	list-style:none;
	display:grid;
	padding:0px;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	align-items:center;
	height:100%;
}

.header-menu li{
	text-align:center;
	display:block;
	position:relative;
}

.header-menu li a{
	position:relative;
	display:inline-block;
	margin-bottom:0em;
	font-size:16px;
	color:rgb(200,200,200);
}

.header-menu-highlight{
	border-top: solid 2px;
	border-bottom: solid 2px;
	border-color:rgba(255,255,255,0);
	position:absolute;
	width:50%;
	height:100%;
	margin-left:25%;
	margin-right:25%;
	top:0px;
	left:0px;
	transition: width 0.5s, margin-left 0.5s, margin-right 0.5s, border-color 0.5s;
}

.header-menu li a:hover{
	color:white;
}

.header-menu li a:hover .header-menu-highlight{
	width:100%;
	margin-left:0%;
	margin-right:0%;
	border-color:rgba(255,255,255,1);
}

.frost-header-nav-burger{
	display:none;
	background-image:url("./assets/images/burger.svg");
	background-color:rgba(255,255,255,0);
	background-size:100%;
	width:64px;
	height:64px;
	cursor:pointer;
}

.frost-header-nav-burger:hover{
	background-color:rgba(255,255,255,0.0);
	transform:scale(1.1,1.1);
}

@media only screen and (max-width: 900px){
	.frost-header{
		display:block;
	}

	.header-menu{
		margin-top:80px;
		height:0px;
		
		display:block;
		transition: height 0.444s ease-in-out;
		overflow:hidden;
	}
	
	.header-menu[visible="0"]{
		height:0px;
		margin-top:0px;
	}
	.header-menu[visible="1"]{
		height:100vh;
	}
	
	.header-menu li{
		text-align:right;
		padding-top:1em;
		padding-bottom:1em;
	}
	
	.header-menu li a{
		margin-top: 0.2em;
		margin-bottom: 0em;
	}
	
	.frost-header-nav-burger{
		display:block;
		position:absolute;
		right:1em;
		top:1em;
		height:40px;
		width:40px;
	}
	
	/* post hero video */
	
	.post-hero-title{
		font-size:4em;
	}
	
	.post-hero-category{
		font-size:1em;
	}
	
	.post-hero-desc{
		font-size: 0.9em;
	}
	
	.post-hero-year{
		font-size:1em;
	}
}

/* layout test 0 */

.layout-test-0-item{
	padding:4px;
}

.layout-test-0-item video{
	border-radius:8px;
}

/* layout test 1 */

.layout-test-1-grid{
	column-count:3;
	column-gap:0px;
}

.layout-test-1-item{
	width:100%;
	height:auto;
	max-height:90vh;
	padding:2px;
	display:block;
}

.layout-test-1-item video{
	border-radius:8px;
	height:100%;
	display:block;
}

@media only screen and (max-width: 900px){
	.layout-test-1-grid{
		column-count:2;
	}
}

@media only screen and (max-width: 400px){
	.layout-test-1-grid{
		column-count:1;
	}
}

/* layout test 2 */

.layout-test-2-grid{
	display:flex;
	flex-wrap: wrap;
	justify-content:center;
}

.layout-test-2-item{
	height:300px;
	padding:2px;
}

.layout-test-2-item video{
	border-radius:8px;
	display:block;
}