@import url('https://fonts.googleapis.com/css?family=Abel|Advent+Pro|Akronim|Arvo|Alegreya+Sans+SC|Kalam|Rubik|Share+Tech+Mono&display=swap');


body {

	margin: 0;
	overflow-x: hidden;

	font-size: 25px;

	font-family: "Rubik";

	color: #333;

}

a {

	text-decoration: none;

}

#nav {

	position: fixed;
	top: 0;
	display: flex;
	justify-content: space-around;
	align-items: center;
	width: 100vw;
	height: 10vh;
	margin: none;
	background: rgba(51, 51, 51, 0);
	transition: all 0.5s;
	transition-timing-function: ease;

	padding-bottom: 20px;

	z-index: 100;

}

#nav a {

	display: flex;
	align-items: center;
	justify-content: center;
	color: #333;

	font-family: "Advent Pro";
	font-size: 1.2em;
	text-transform: uppercase;
	transition: all 0.2s;
	height: 100%;
	width: 100%;

}

#nav a:hover {

	color: #F44336;
	background: rgba(51, 51, 51, 0.4);

}

#navV2 {

	position: fixed;
	display: flex;
	flex-direction: column;
	right: 0;
	top: 5vh;
	padding-right: 50px;
	z-index: 200;

}

#navV2 a {

	color: #222;
	font-weight: bold;
	font-family: "Share Tech Mono";
	transform-origin: bottom;
	transition: all 0.1s;

}
#navV2 a:hover {

	position: relative;
	transform: translate(-10px);
	color: #fff;

}

.eduSectionNav a {

	color: #fff !important;

}
.eduSectionNav a:hover {

	color: #FF851B !important;

}

.navLogo {
  background: url("./images/GDLogo02.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  height: 100%;
  min-width: 100px;

}

.navLogoV2 {

	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 10vh;
	padding-top: 3vh;

	z-index: 200;

}


.scrolledNav {
	background: rgba(255, 255, 255, 1) !important;
	border-bottom: 5px solid #eee;
	box-shadow: 0 -10px 20px 5px #666;

	padding-bottom: initial !important;

}
.scrolledNav a {



}
.scrolledNav a:hover {
	color: #fff;
}

.container {

	width: 100vw;
	min-height: 100vh;

}

.container .section {

	display: flex;
	justify-content: space-around;
	align-items: center;
	min-height: 100vh;
	width: 100%;

}

h1 {

	font-family: "Akronim";
	font-size: 5em;
	color: #fff;
	cursor: default;

}

h2 {

	font-family: "Akronim";
	font-size: 4em;
	color: #fff;
	cursor: default;

}

p {



}

.section:nth-child(odd) {

	flex-direction: row-reverse;

}

.section h2 {

	text-align: center;
	width: 50%;
	transition: margin-right 0.5s, margin-left 0.5s, transform 0.8s;
	transform: rotate3d(2,0,1, 180deg);

}

.section p {

	text-align: center;
	width: 50%;
	padding: 3%;
	box-sizing: border-box;

}

#headerSection {

	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	min-height: 100vh;
	width: 100vw;
	left: 0;

	background: url("./images/MainIMGBlur.png");

	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;


}
#headerSection h1 {

	background: rgba(0, 0, 0, 0.6);
	padding: 40px;
	border-radius: 10px;

}
#headerSection p {

	color: #fff;

}

#aboutMeSection {

	background: #0074D9;

	flex-direction: column;
	justify-content: center;

}

.section h1 {

	position: fixed;
	top: 20px;
	left: 20px;
	margin: 0;
	font-size: 30pt;

	z-index: 201;

}

#aboutMeSection div h2 {

	transform: rotate3d(90deg,45deg,0deg);
	margin-left: -100%;
	transition-timing-function: ease-in-out;


}

.aboutSplitDiv {

	display: flex;
	justify-content: space-around;
	align-items: baseline;

}

#educationSection {

	position: relative;

	background: #222;

	height: 130vh;

}

.educationSectionV2 {

	position: static;

	height: 100vh !important;

}

#educationSection h2 {

	color: #FF851B;

	margin-right: -100%;
	transition-timing-function: ease-in-out;

}
#educationSection p {

	color: #fff;

}

#aboutMeSectionImg {

	background: url("images/Me01ForWeb.png");
	background-size: cover;
	height: 30vh;
	width: 30vh;
	border-radius: 1000px;
	box-shadow: inset 0 0 50px 0px #000;
	z-index: 50;
	border: 5px solid #FFf;

}

#curveEdgeWorkSection {
	position: absolute;
	bottom: 0;
	left: 0;

}
#curveEdgeAboutMeSection {
	position: absolute;
	top: 0;
	left: 0;

}


#workSection {

background: #FF4136;

}
#workSection h2 {

	color: #333;

	margin-left: -100%;
	transition-timing-function: ease-in-out;

}
#workSection p {

	color: #fff;

}

.slideH2 {

	transform: rotate3d(0,0,0,0deg) !important;
	margin-left: 0 !important;
	margin-right: 0 !important;

}