/* --- START CORE CODE --- */
body {
	margin: 0;
	background-color: black;
}
.link-left {
    width: 50vw;
    height: 100vh;
    display: block;
    position: fixed;
    z-index: 99;
}
.link-right {
    width: 50vw;
    height: 100vh;
    left: 50vw;
    display: block;
    position: fixed;
    z-index: 99;
}
/* --- END CORE CODE --- */
.color-over {
	clip-path: polygon(3% 0, 95% 0, 100% 91%, 0 97%);
	height: 5800px;
	background-color: #000dff;
	mix-blend-mode: multiply;
	position: absolute;
	width: 8000px;
	top: 0;
}
.tri-wrap {
	clip-path: polygon(2% 0, 95% 0, 100% 94%, 0% 100%);
	height: 5800px;
}
.tri {
	position: relative;
	width: 8000px;
	height: auto;
	transform: matrix(2.00,0.00,0.00,2.00,0,0);
	-ms-transform:matrix(2.00,0.00,0.00,2.00,0,0);
	-webkit-transform: matrix(4.00,0.00,0.00,4.00,0,0);
}
.tri-2 {
	position: relative;
	width: 8000px;
	height: auto;
	left: -800px;
	top: 1196px;
	transform: matrix(2.00,0.00,0.00,2.00,0,0);
	-ms-transform:matrix(2.00,0.00,0.00,2.00,0,0);
	-webkit-transform: matrix(4.00,0.00,0.00,4.00,0,0);
}
.tri-3 {
	position: relative;
	width: 8000px;
	height: auto;
	transform: matrix(2.00,0.00,0.00,2.00,0,0);
	-ms-transform:matrix(2.00,0.00,0.00,2.00,0,0);
	-webkit-transform: matrix(4.00,0.00,0.00,4.00,0,0);
	top: 2390px;
}
.tri-4 {
	position: relative;
	width: 8000px;
	height: auto;
	left: -800px;
	top: 3586px;
	transform: matrix(2.00,0.00,0.00,2.00,0,0);
	-ms-transform:matrix(2.00,0.00,0.00,2.00,0,0);
	-webkit-transform: matrix(4.00,0.00,0.00,4.00,0,0);
}
section.main{
	width: 8000px;
	height: 8000px;
	overflow: hidden;
	position: absolute;
	background: rgb(60,32,54);
	background: linear-gradient(0deg, rgba(60,32,54,1) 0%, rgba(200,212,101,1) 100%);
}
.text {
	font-size: 24000px;
	color: blue;
	position: absolute;
	display: block;
	top: -3000px;
}
.text-wrap {
	transform: matrix(2.00,0.00,0.00,2.00,0,0);
	-ms-transform:matrix(2.00,0.00,0.00,2.00,0,0);
	-webkit-transform: matrix(2.00,0.00,0.00,2.00,0,0);
	position: absolute;
	top: -3000px;
}
.triangles-flip {
	-webkit-transform: scale(-1);
    transform: scale(-1);
    top: -4px;
    position: absolute;
    left: -204px;
}
.triangle-wrap {
	width: 400px;
	height: 400px;
	position: relative;
	display: inline-block;
	margin-left: -4px;
}
.triangle-1 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 400px;
	height: 400px;
	position: absolute;
	background-color: #363636;
}
.triangle-2 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 360px;
	height: 400px;
	left: 20px;
	position: absolute;
	background-color: #545454;
}
.triangle-3 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 320px;
	height: 400px;
	left: 40px;
	position: absolute;
	background-color: #6b6b6b;
}
.triangle-4 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 280px;
	height: 400px;
	left: 60px;
	position: absolute;
	background-color: #878787;
}
.triangle-5 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 240px;
	height: 400px;
	left: 80px;
	position: absolute;
	background-color: #a1a1a1;
}
.triangle-6 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 200px;
	height: 400px;
	left: 100px;
	position: absolute;
	background-color: #b5b5b5;
}
.triangle-7 {
	clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
	width: 160px;
	height: 400px;
	left: 120px;
	position: absolute;
	background-color: #d1d1d1;
}