/* Loader
==================================== */
#loader{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100vw;
	height: 100%;
	background-color: inherit;
	overflow-y: hidden;
	-ms-touch-action: none;
		 touch-action: none;
	z-index: 999;
}

/* Global
==================================== */
/*Content Wrapper*/
#content-wrapper{
	width: 100vw;
	min-height: var(--height-viewport);
	display: grid;
	grid-template-rows: min-content 1fr;
}

/*Main*/
main{
	width: 100vw;
	display: grid;
}
.page-project main{
	position: relative;
	min-height: var(--height-viewport);
	padding: var(--margin-sides);
	grid-template-rows: min-content 1fr min-content;
	row-gap: 60px;
}
@media (min-width: 835px){
	.page-work main{
		grid-template-rows: 1fr min-content;
	}
}
@media (max-width: 834px){
	.page-work main{
		position: fixed;
		height: 100%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding-top: var(--height-header);
		grid-template-rows: 1fr calc(60px + var(--height-txt) + var(--margin-sides));
		overflow-x: hidden;
		overflow-y: scroll;
		scroll-snap-type: y mandatory;
		-webkit-overflow-scrolling: touch;
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
}

/* Modules
==================================== */
.module-credits{
	width: fit-content;
	width: -moz-fit-content;
	display: flex;
	flex-wrap: wrap;
	row-gap: 3px;
	text-wrap: balance;
}
.module-credits > span:first-child:not(:only-child){
	margin-right: var(--gap-cols);
}
.module-credits > span:last-child:not(:only-child){
	margin-left: var(--gap-cols);
}
.module-credits wrap{
	white-space: nowrap;
}

/* Hovers
==================================== */
.underlined{
	position: relative;
	-webkit-user-select: none;
		-moz-user-select: none;
		 -ms-user-select: none;
			  user-select: none;
}
.link-active::after,
.desktop .underlined:hover::after,
.mobile .underlined:active::after{
	content: '';
	position: absolute;
	top: 110%;
	left: 0;
	width: 100%;
	height: 1px;
	background-color: var(--color-txt)
}