#indexWrapper {
	width: 100%;
	background: #0000009c;
	padding-top: 50px;
	margin-top: 15px;
	min-height: 100vh;
	display: flex;
	flex-flow: column;
	overflow-x: hidden;
	
	--padding1: 50px;
	--padding2: 100px;
	--padding3: 200px;
}

#indexWrapper p {
	overflow-x: scroll;
}

#indexWrapper p::-webkit-scrollbar {
    width: 0px;
	height: 0px;
    background: transparent;
}

#indexWrapper * {
	color: var(--clrTintedText1);
}

#indexWrapper *::selection {
	color: var(--clrSelectionBackground);
	background: var(--clrSelectionText);
}

#barRight {
	display: none;
}

#artsyKnifePose {
	max-width: 922px;
	max-height: 900px;
	width: 100%;
	height: 100%;
	background: url(../resources/artsyknifepose.jpg);
	background-repeat: no-repeat;
	mask-image: linear-gradient(180deg, black, white, black), linear-gradient(90deg, transparent, white 90%, white 93%, transparent);
	padding: 0;
	position: absolute;
	pointer-events: none;
	user-select: none;
	background-size: cover;
	background-position-x: -300px;
	opacity: 1;
	transition: 200ms;  
	mask-mode: luminance;
	mask-size: 100%, 100%;
	mask-repeat: no-repeat;
	mask-composite: intersect;
	filter: hue-rotate(-10deg);
}

#artsyTextWrapper > *, #websiteHistory > * {
	padding-left: var(--padding1);
	font-weight: normal;
}

.blurredBackground {
	backdrop-filter: blur(20px);
}

#artsyTextWrapper {
	z-index: 1;
	width: 100%;
}

#artsyWrapper {
	display: flex;
	justify-content: end;
	height: 100%;
	width: 100%;
	margin-bottom: 25px;
}

#insiders {
	min-height: unset;
}

#artsyTextHeader {
	line-height: 70px;
	padding-bottom: 25px;
	padding-top: 25px;
}

#artsyTextHeader > h1 {
	font-size: 96px;
}

#artsyTextHeader > h2 {
	font-size: 64px;
	padding-left: var(--padding3);
	line-height: 60px;
}

#artsyText {
	font-size: 20px;
	max-width: 900px;
}

#artsyText > ul {
	padding-left: var(--padding2);
}

#websiteHistory {
	z-index: 1;
	position: relative;
	display: flex;
	flex-flow: column;
	padding-bottom: 10px;
}

#websiteHistory > h2 {
	font-size: 36px;
	padding-left: var(--padding2);
	background: linear-gradient(90deg, black, transparent);
}

.darkenedBackground {
	background: #0000003d;
}

@media screen and (max-width: 1200px) {
	#artsyKnifePose {
		opacity: 0.7;
	}
	
	#artsyTextHeader {
		background: #000000ad;
	}
}

@media screen and (max-width: 900px) {
	#indexWrapper {		
		--padding1: 10px;
		--padding2: 50px;
		--padding3: 50px;
	}
	
	#barRight {
		display: flex;
	}
	
	#artsyTextHeader {
		line-height: 90px;
	}
	
	#artsyKnifePose {
		opacity: 0.4;
		background-position-x: calc(0px + 50%);
		mask-image: linear-gradient(0deg, black, white, black);
	}
}