* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}  

.flex, .triangle, .triangle .section3 .section3icons, .triangle .infoBox {
	display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
}

.flexCenter {
	display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

body {
	padding: 0;
	margin: 0;
	height: 100vh;
	width: 100vw;
	overflow: hidden;
	font-family: 'Roboto Condensed';
	font-family: 'Oswald';
	font-weight: 300;
	font-style: italic;
}

::-moz-selection, ::selection {
	backgrond: transparent;
	color: black;
}

.headerShadow {
	-webkit-box-shadow: 0px 10px 28px rgba(0, 0, 0, 0.5);
	box-shadow: 0px 10px 28px rgba(0, 0, 0, 0.5);
	width: 100%;
	z-index: 6;
	height: 15px;
	top: -15px;
	position: absolute;
}

/* .triangleShadow {
	-webkit-box-shadow: 3px 14px 28px rgba(0, 0, 0, 0.25), 3px 10px 10px rgba(0, 0, 0, 0.22);
	box-shadow: 3px 14px 28px rgba(0, 0, 0, 0.25), 3px 10px 10px rgba(0, 0, 0, 0.22);
} */

.triangle {
	overflow: hidden;
	height: inherit;
	width: inherit;
	position: relative;
	-ms-flex-pack: distribute;
	-webkit-box-pack: space-evenly;
			justify-content: space-evenly;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.triangle .section1, .triangle .section2, .triangle .section3 {
	-webkit-transition: all 180ms ease-in-out;
	transition: all 180ms ease-in-out;
	overflow: hidden;
}

.triangle .section1, .triangle .section2, .triangle .section3icons .icon img {
	cursor: pointer;
}

.triangle .section1 {
	width: 120rem;
	height: 4096px;
	position: absolute;
	z-index: 5;
	right: 54vw;
	top: -2048px;
	min-width: 100vw;
	/* filter: drop-shadow(10px 4px 28px rgba(0, 0, 0, 0.45)); */
	/* -webkit-filter: drop-shadow(10px 4px 28px rgba(0, 0, 0, 0.45)); */
	background-image: -webkit-gradient(linear, left top, right top, from(#f07f00), color-stop(#cf4609), to(#f07f00));
	background-image: linear-gradient(to right, #f07f00, #cf4609, #f07f00);
	-webkit-transform: translatex(-60vw) rotate(35deg);
	transform: translatex(-60vw) rotate(35deg);
}

.triangle .section1:hover {
	-webkit-transform: translatex(20px) rotate(35deg) !important;
	transform: translatex(20px) rotate(35deg) !important;
}

.triangle .section2 {
	width: 120rem;
	height: 4096px;
	min-width: 100vw;
	position: absolute;
	z-index: 5;
	left: 54vw;
	top: -2048px;
	background-image: -webkit-gradient(linear, right top, left top, from(#5d4037), color-stop(#3b221b), to(#5d4037));
	background-image: linear-gradient(to left, #5d4037, #3b221b, #5d4037);
	-webkit-transform: translatex(60vw) rotate(-35deg);
	transform: translatex(60vw) rotate(-35deg);
	z-index: 3;
	/* -webkit-filter: drop-shadow(-10px 4px 28px rgba(0, 0, 0, 0.45)); */
	/* filter: drop-shadow(-10px 4px 28px rgba(0, 0, 0, 0.45)); */
}

.triangle .section2:hover {
	-webkit-transform: translatex(-20px) rotate(-35deg) !important;
	transform: translatex(-20px) rotate(-35deg) !important;
}

.triangle .section3 {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100vw;
	height: calc(17vh + 20px);
	/* background-color: #0f6304; */
	background-image: linear-gradient(to left, #0f6304, #094901);
	margin-bottom: -20px;
	z-index: 4;
	/* -webkit-filter: drop-shadow(-10px -4px 28px rgba(0, 0, 0, 0.45)); */
	/* filter: drop-shadow(-10px -4px 28px rgba(0, 0, 0, 0.45)); */
	-webkit-transform: translateY(20vh);
	transform: translateY(20vh);
}

.triangle .section3:hover {
	-webkit-transform: translateY(-20px) !important;
	transform: translateY(-20px) !important;
}

.triangle .section3 .section3icons {
	-webkit-box-align: center;
		-ms-flex-align: center;
			align-items: center;
	-webkit-box-pack: space-evenly;
		-ms-flex-pack: space-evenly;
			justify-content: space-evenly;
	width: 28vw;
	height: calc(17vh + 20px);
	float: right;
}

.triangle .section3 .section3icons .phoneIcon {
	display: none;
}

.triangle .section3 .section3icons .icon {
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	padding: 0 20px;
}

.triangle .section3 .section3icons .icon img {
	height: 60px;
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	/* -webkit-filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.25));
	filter: drop-shadow(3px 3px 4px rgba(0, 0, 0, 0.25)); */
}

.triangle .section3 .section3icons .icon img:hover {
	-webkit-transform: scale(1.3);
			transform: scale(1.3);
}

.triangle .section1text, .triangle .section2text {
	font-size: calc(40px + (80 - 40) * ((100vw - 300px) / (1920 - 300)));
	z-index: 5;
	pointer-events: none;
	font-weight: 400;
	width: 27%;
}

.triangle .section1text p, .triangle .section2text p {
	-webkit-transition: all 200ms ease-in-out;
	transition: all 200ms ease-in-out;
	font-style: normal;
	color: white;
}

.triangle .section1text {
	-webkit-box-ordinal-group: 2;
	-ms-flex-order: 1;
	order: 1;
	/* padding: 0 5.25vw; */
}

.triangle .section1text p {
	text-shadow: 1px 1px  #995100, 2px 2px  #995100, 3px 3px  #995100, 4px 4px  #995100, 5px 5px  #995100, 6px 6px  #995100, 7px 7px #995100, 8px 8px #995100, 9px 9px #995100;
	text-align: center;
}

.triangle .section2text {
	-webkit-box-ordinal-group: 4;
	-ms-flex-order: 3;
	order: 3;
}

.triangle .section2text p {
	text-shadow: -1px 1px  #42261e, -2px 2px  #42261e, -3px 3px  #42261e, -4px 4px  #42261e, -5px 5px  #42261e, -6px 6px  #42261e, -7px 7px #42261e, -8px 8px #42261e, -9px 9px #42261e, -10px 10px #42261e;
}

.triangle .infoBox {
	-webkit-box-ordinal-group: 3;
  -ms-flex-order: 2;
  order: 2;
  position: relative;
  height: 90%;
  align-self: baseline;
  /* width: 35vw; */
  width: 46%;
  -webkit-box-pack: center;
	  -ms-flex-pack: center;
		  justify-content: center;
  -webkit-box-align: center;
	  -ms-flex-align: center;
		  align-items: center;
}

.triangle .infoBox p, .triangle .infoBox h1 {
	pointer-events: none;
	/* top: 47%; */
	top: 60%;
	padding-right: 7.5%;
	position: absolute;
	text-align: center;
	width: 100%;
	font-size: calc(35px + (120 - 35) * ((100vw - 300px) / (1600 - 300)));
	font-weight: 300;
	text-shadow: 5px 10px 20px rgba(0, 0, 0, 0.18), 3px 6px 12px rgba(0, 0, 0, 0.25);
	margin: 0 !important;
}

.triangle .infoBox .cvStroke, .triangle .infoBox .svsStroke, .triangle .infoBox .fbStroke, .triangle .infoBox .linkedInStroke, .triangle .infoBox .mailStroke, .triangle .infoBox .cvStroke2, .triangle .infoBox .svsStroke2, .triangle .infoBox .fbStroke2, .triangle .infoBox .linkedInStroke2, .triangle .infoBox .mailStroke2, .triangle .infoBox .phoneStroke2, .triangle .infoBox .phoneStroke {
	display: none;
	opacity: 0.8;
	-webkit-transform: scale(1.5);
			transform: scale(1.5);
	-webkit-text-stroke: 2.5px black;
	-webkit-text-fill-color: white;
	z-index: 5;
}

@media only screen and (max-width: 800px) {
	.triangle .infoBox .phoneStroke, .triangle .infoBox .cvStroke, .triangle .infoBox .svsStroke, .triangle .infoBox .fbStroke, .triangle .infoBox .linkedInStroke, .triangle .infoBox .mailStroke, .triangle .infoBox .cvStroke2, .triangle .infoBox .svsStroke2, .triangle .infoBox .fbStroke2, .triangle .infoBox .linkedInStroke2, .triangle .infoBox .mailStroke2 {
		-webkit-text-stroke: 1px black;
		-webkit-text-fill-color: white;
		-webkit-transform: scale(2);
				transform: scale(2);
  }
}

.triangle .infoBox .cvStroke2, .triangle .infoBox .svsStroke2, .triangle .infoBox .fbStroke2, .triangle .infoBox .linkedInStroke2, .triangle .infoBox .mailStroke2, .triangle .infoBox .phoneStroke2 {
	-webkit-transform: scale(2.5);
		  transform: scale(2.5);
		  opacity: 0.7;
}

@media only screen and (max-width: 800px) {
	.triangle .infoBox .cvStroke2, .triangle .infoBox .svsStroke2, .triangle .infoBox .fbStroke2, .triangle .infoBox .linkedInStroke2, .triangle .infoBox .mailStroke2, .triangle .infoBox .phoneStroke2 {
		-webkit-transform: scale(3);
				transform: scale(3);
	}
	.triangle .section3 .section3icons .phoneIcon {
		display: block;
	}
}

.triangle .infoBox .battleTag {
	display: none;
}

.triangle .infoBox .battleTag sup {
	font-size: calc(20px + (30 - 20) * ((100vw - 300px) / (1600 - 300)));
	position: absolute;
	padding-left: 15px;
	padding-top: 15px;
}

.triangle .infoBox .cv {
	display: none;
}

.triangle .infoBox .svs, .triangle .infoBox .fb {
	display: none;
}

.triangle .infoBox .fb, .triangle .infoBox .phone {
	display: none;
}

.triangle .infoBox .linkedIn {
	display: none;
}

.triangle .infoBox .mail {
	display: none;
}

@media only screen and (min-width: 2048px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2048px - 7.5vw);
	}
}

@media only screen and (max-width: 2040px) and (max-height: 970px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2048px - 7.5vw);
	}
}

@media only screen and (max-width: 1920px) and (max-height: 970px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2015px - 5vw);
	}
}

@media only screen and (max-width: 1600px) {
	.triangle .section1 {
		-webkit-transform: translatex(-80vw) rotate(35deg);
		transform: translatex(-80vw) rotate(35deg);
	}
	.triangle .section2 {
		-webkit-transform: translatex(80vw) rotate(-35deg);
		transform: translatex(80vw) rotate(-35deg);
	}
}

@media only screen and (max-width: 1530px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2048px - 10vw);
	}
}

@media only screen and (max-width: 1400px) {
	.triangle .infoBox .battleTag sup {
		padding-top: 0;
	}
}

@media only screen and (max-width: 1366px) and (max-height: 1024px) {
	.triangle .infoBox {
		height: 100%;
	}
	.triangle .infoBox p, .triangle .infoBox h1 {
		top: 60% !important;
	}
}

@media only screen and (max-width: 1440px) and (max-height: 1024px) {
	.triangle .infoBox {
		height: 100%;
	}
	.triangle .infoBox p, .triangle .infoBox h1 {
		top: 60% !important;
	}
}

@media only screen and (max-width: 1280px) and (max-height: 800px) {
	.triangle .infoBox p, .triangle .infoBox h1 {
		/* top: 67% !important; */
	}
}

@media only screen and (max-width: 1080px) {
	.triangle .infoBox {
		height: 100%;
	}
}

@media only screen and (max-width: 970px) {
	.triangle .section3 .section3icons {
		padding-right: 40px;
	}
}

@media only screen and (max-width: 1024px) and (max-height: 768px) {
	.triangle .infoBox p, .triangle .infoBox h1 {
		top: 67% !important;
	}
}

@media only screen and (max-width: 1024px) and (max-height: 600px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2015px - 20vw);
	}
	.triangle .infoBox p, .triangle .infoBox h1 {
		top: 60% !important;
	}
}
@media only screen and (max-width: 800px) and (max-height: 480px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2015px - 25vw);
	}
	.triangle .infoBox {
		height: 92%;
	}
	.triangle .section3 .section3icons {
		width: 40vw;
	}
	.triangle .section3 .section3icons .icon img {
		height: 50px;
	}
}

@media only screen and (max-width: 880px) {
	.infoBox {
		height: 100%;
	}
	.triangle {
		-webkit-box-align: start;
			-ms-flex-align: start;
				align-items: flex-start;
	}
	.triangle .section1text, .triangle .section2text {
		margin-top: 21vh;
	}
	.triangle .infoBox p {
		font-size: calc(55px + (120 - 55) * ((100vw - 300px) / (1600 - 300))) !important;
	}
}

@media only screen and (max-width: 725px) {
	.triangle .section3 {
		height: calc(30vh + 20px);
		-webkit-transform: translateY(30vh);
		transform: translateY(30vh);
	}
	.triangle .section3 .section3icons {
		height: calc(30vh + 20px);
		width: 100vw;
		-webkit-box-pack: center;
			-ms-flex-pack: center;
				justify-content: center;
		padding-right: 0;
	}
	.triangle .section3 .section3icons .icon {
		padding: 0 30px;
	}
}

@media only screen and (max-width: 666px) {
	.triangle .infoBox .battleTag {
		/* display: block !important; */
		/* -webkit-transition: all 180ms ease-in-out; */
		/* transition: all 180ms ease-in-out; */
	}
	.triangle .section1, .triangle .section2 {
		top: calc(-2008px + 6vw);
	}
	.triangle .section1 {
		-webkit-transform: translatex(-100vw) rotate(35deg);
		transform: translatex(-100vw) rotate(35deg);
		right: 65vw;
	}
	.triangle .section2 {
		-webkit-transform: translatex(100vw) rotate(-35deg);
		transform: translatex(100vw) rotate(-35deg);
		left: 65vw;
	}
	.triangle .section3 {
		height: calc(27vh + 20px);
		-webkit-transform: translateY(40vh);
		transform: translateY(40vh);
	}
	.triangle .section3 .section3icons {
		height: calc(27vh + 20px);
		margin-top: -45px;
	}
	.triangle .infoBox {
		position: absolute;
		width: 80vw;
	}
	.triangle .section1text, .triangle .section2text {
		width: 50%;
		padding: 0;
		margin-top: 19vh;
	}
	.triangle .section2text {
		-webkit-transform: translateX(20px);
				transform: translateX(20px);
	}
	.triangle .section1text p, .triangle .section2text p {
		text-align: center;
	}
}

@media only screen and (max-width: 550px) {
	.triangle .section3 .section3icons .icon {
		padding: 0 20px;
	}
	.triangle .section1, .triangle .section2 {
		top: calc(-2008px + 6vw * 2.3);
	}
	.triangle .section1text, .triangle .section2text {
		margin-top: 22vh;
	}
}

@media only screen and (max-width: 768px) {
	.triangle .section3 .section3icons {
		width: 100vw;
	}
}

@media only screen and (max-width: 414px) and (max-height: 736px) {
	.triangle .section1text, .triangle .section2text {
		margin-top: 30vh;
	}
	.triangle .section3 {
		height: calc(20vh + 20px);
	}
	.triangle .section3 .section3icons {
		height: calc(20vh + 20px);
		margin-top: -20px;
	}
	.triangle .infoBox p, .triangle .infoBox h1 {
		top: 67% !important;
	}
}

@media only screen and (max-width: 414px) and (max-height: 736px) {
	
}

@media only screen and (max-width: 375px) and (max-height: 667px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2008px + 5vw);
	}
	.triangle .section1text, .triangle .section2text {
		font-size: calc(30px + (80 - 30) * ((100vw - 300px) / (1920 - 300)));
	}
}


@media only screen and (max-width: 320px) and (max-height: 568px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2008px - 15vw);
	}
	.triangle .infoBox {
		height: 95%;
	}
}

@media only screen and (max-width: 412px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2008px - 4vw);
	}
	.triangle .infoBox {
		height: 95%;
	}
	.triangle .section1text, .triangle .section2text {
		margin-top: 24vh;
	}
}

@media only screen and (max-width: 400px) {
	.triangle .section1 {
		-webkit-transform: translatex(-120vw) rotate(35deg);
		transform: translatex(-120vw) rotate(35deg);
	}
	.triangle .section2 {
		-webkit-transform: translatex(120vw) rotate(-35deg);
		transform: translatex(120vw) rotate(-35deg);
	}
	.triangle .section3 .section3icons .icon img {
		height: 45px;
	}
}
@media only screen and (max-width: 375px) {
	.triangle .section1, .triangle .section2 {
		top: calc(-2048px + 15vw);
	}
	.triangle .infoBox {
		height: 95%;
	}
	.triangle .section1text, .triangle .section2text {
		margin-top: 28vh;
	}
}