
@charset "UTF-8";
/* CSS Document */

.selectedcolor {
	color:#B1DDF1;
}



#navigation{  
  /* This section calls the slideInFromLeft animation we defined above */
	 animation: 1s ease-out 0s 1 slideInFromTop;

  
}

	#navigation a:hover {
		
		
		
		animation: 0.6s 1 forwards fadeincolor;
	}

@keyframes fadeincolor{
  0% {
  color:fff;
  }
	
  99% {
  color:#B1DDF1;
  }
	 100% {
  color:#B1DDF1;
  }
}
@keyframes slideInFromTop {
  0% {
    transform: translateY(-300%);
  }
  100% {
    transform: translateY(0);
  }
}

@keyframes slideInFromLeft {
  0% {
    transform: translateX(-300%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes fadein{
  0% {
   opacity:0;
  }
	 40% {
   opacity:0;
  }
  100% {
   opacity:1;
  }
}
#scottdurrant{  
  /* This section calls the slideInFromLeft animation we defined above */
	
  animation: 2s ease-out 0s 1 fadein;
}

#scottdurrant img:hover {
	
	cursor: alias;
	
}

html {
  background-color: #2a2a2a;
  color: #FFF;
  font-family: 'dm_sans9pt_regular';
  height: 100%;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
#makeblack {
  position: relative;
  top: 0vw;
  width: 100vw;
  left: 0vw;
  height: 14vw;
  background-color: #2a2a2a;
  z-index: 990;
}
@font-face {
  font-family: 'dm_sans9pt_italic';
  src: url('dmsans-italic-variablefont_opszwght.woff2') format('woff2'), url('dmsans-italic-variablefont_opszwght.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'dm_sans9pt_regular';
  src: url('dmsans-variablefont_opszwght.woff2') format('woff2'), url('dmsans-variablefont_opszwght.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}
ul {
  list-style-type: none;
}

/*-----------------------------------------------------START NAVIAGATION---------------------------------------
-------------------------------------------------------START NAVIAGATION---------------------------------------
-------------------------------------------------------START NAVIAGATION---------------------------------------*/

#scottdurrant {
  position: absolute;
  top: 2.1vw;
  left: 36.9vw;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
  font-size: 3vw;
  width: 25vw;
}
#scottdurrant img {
  width: 25vw;
  height: auto;
}
.nav-collapse {
  display: none;
  z-index: 999;
  font-family: 'dm_sans9pt_regular';
}
#mobilenav {
  display: none;
  z-index: 999;
  font-family: 'dm_sans9pt_regular';
}
a { /*  links*/
  text-decoration: none;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
}
.navigation a {
  float: left;
  padding: 4vw;
  width: 20%; /* Four equal-width links. If you have two links, use 50%, and 33.33% for three links, etc.. */
  text-align: center; /* If you want the text to be centered */
  z-index: 999;
}
#navbar {
  position: absolute;
  top: 7vw;
  height: 6vw;
  /*background-color:#0E13A4;*/
  font-family: 'dm_sans9pt_regular';
  z-index: 999;
}
#navigation {
  position: absolute;
  left: 0vw;
  width: 98.4vw;
  top: 2.9vw;
  /*font-size: 1vw;*/
  letter-spacing: 0.1vw;
  color: #fff;
  font-size: 1.25vw;
  font-family: 'dm_sans9pt_regular';
  text-align: center;
  z-index: 999;
}
#navigation li a.current {
  width: 12vw;
  height: 2.3vw;
  font-weight: bold; /******************************** THIS PIECE ISN'T WORKING ONLINE. I WANT THE CURRENT PAGE TITLE TO APPEAR BOLD. SEEMS TO WORK IN DREAMWEAVER PREVIEW, NOT ONLINE THOUGH***** maybe because the font doens't have bold variation in stylesheet.css? *****/
  /*background-color:#F4A40F;
	border-radius:1vw;*/
  z-index: 900;
  /*color: #ffffff;*/
}
.navi li a:active {
  background-color: darkblue;
  color: #fff;
}
#navigation li {
  display: inline;
  padding-left: 3vw;
  padding-right: 3vw;
  z-index: 999;
}


/*-----------------------------------------------------END NAVIAGATION---------------------------------------
-------------------------------------------------------END NAVIAGATION---------------------------------------
-------------------------------------------------------END NAVIAGATION---------------------------------------*/

#ExperienceWord img{
	position: absolute;
	margin-top: 52vw;
	margin-left: 70vw;
	width: 40vw;
	height: auto;
	transform: rotate(90deg);
}
#EDUWord img{
	position: absolute;
	margin-top: 108.5vw;
	margin-left: 5vw;
	width: 14vw;
	height: auto;
	transform: rotate(90deg);
}

.image-and-text{
	width: 100vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
}

#firstimg {
	position:relative;
	top:0.5vw;
	left:-1vw;
	width:50vw;
}

#firstimg img {
	position:relative;
	width:50vw;
	height:auto;
}

.about-text-box-top{
	font-size: 3vw;
	color: #FF8600;
	font-weight: bold;
	margin-top: 4vw;
}

.about-text-box-bottom {
	font-size: .9vw;
	color: white;
	line-height: 1.3;
	width: 26vw;
}

#motiondesigner img{
	width:23vw;
	height: auto;
	margin-top: 2vw;
}
.workExperienceOne{
	width: 70vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 6vw;
}
.workExperienceTwo{
	width: 70vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 4vw;
}
#EDUExperienceOne{
	width: 70vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 4vw;
}

#workExpLogoOne img{
	width: 13vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 3vw;
}
#workExpLogoTwo img{
	width: 13vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 2.5vw;
}
#workExpLogoThree img{
	width: 13vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 3.5vw;
}
#workExpLogoFour img{
	width: 13vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 3vw;
	margin-top: 3vw;
}
#EDULogoOne img{
	width: 11vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 4vw;
	margin-top: 2.5vw;
	margin-bottom: 1vw;
}

.workExpOneTextContainer{
	width: 60vw;
	margin-left: 0vw;
	margin-right: 5vw;
}
.workEDUOneTextContainer{
	width: 60vw;
	margin-left: 0vw;
	margin-right: 5vw;
	margin-top: 3vw;
	border: #CE3A3C;
}

.workExpFourTextContainer{
	width: 60vw;
	margin-left: -1vw;
	margin-right: 5vw;
}

.workExpOneHeaderCompanyAndDates{
	display: flex;
	width: auto;
}

.workExpOneCompany, .workExpTwoCompany, .workExpThreeCompany, .workExpFourCompany, .EDUExpOneCompany{
	color: white;
	font-weight: bold;
	font-size: 1vw;
}
.workExpOneDates, .workExpTwoDates, .workExpThreeDates, .workExpFourDates, .EDUExpOneDates{
	color: white;
	font-size: .7vw;
	margin-left: auto;
}

.workExpOneTitle, .workExpTwoTitle, .workExpThreeTitle, .workExpFourTitle, .EDUExpOneTitle{
	color: white;
	font-size: .7vw;
}
.workExpOneBulletsContainer{
	width: auto;
	margin-top: 1vw;
}
.workExpOneBulletOne, .workExpOneBulletTwo, .workExpOneBulletThree, .workExpTwoBulletOne, .workExpTwoBulletTwo, .workExpThreeBulletOne, .workExpThreeBulletTwo, .workExpFourBulletOne, .workExpFourBulletTwo{
	color: white;
	font-size: .8vw;
	margin-bottom: .3vw;
}

.seperatorLine img{
	position: absolute;
	margin-top: 1vw;
	margin-left: 0;
	width: 100vw;
}

.smallWhiteLine {
	width:auto;
	height:.1vw;
	background-color: white;
}
.longWhiteLine {
	width: 70vw;
	background-color:#939393;
	height: .1vw;
	margin: auto;
	margin-top: 3vw;
}

#scottdurrant {
  position: absolute;
  top: 2.1vw;
  left: 41.9vw;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
  font-size: 3vw;
  width: 25vw;
}
#scottdurrant img {
  width: 15vw;
  height: auto;
}
.nav-collapse {
  display: none;
  z-index: 999;
  font-family: 'dm_sans9pt_regular';
}
#mobilenav {
  display: none;
  z-index: 999;
  font-family: 'dm_sans9pt_regular';
}
a { /*  links*/
  text-decoration: none;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
}
.navigation a {
  float: left;
  padding: 4vw;
  width: 20%; /* Four equal-width links. If you have two links, use 50%, and 33.33% for three links, etc.. */
  text-align: center; /* If you want the text to be centered */
  z-index: 999;
}
#navbar {
  position: absolute;
  top: 6.4vw;
  height: 6vw;
  /*background-color:#0E13A4;*/
  font-family: 'dm_sans9pt_regular';
  z-index: 999;
}
#navigation {
  position: absolute;
  left: 0vw;
  width: 98.4vw;
  top: .0vw;
  letter-spacing: 0.1vw;
  color: #fff;
  font-size: 0.6vw;
  font-family: 'dm_sans9pt_regular';
  text-align: center;
  z-index: 999;
}
#navigation li a.current {
  width: 12vw;
  height: 2.3vw;
  font-weight: bold;
  z-index: 900;
}
.navi li a:active {
  background-color: darkblue;
  color: #fff;
}
#navigation li {
  display: inline;
  padding-left: 1vw;
  padding-right: 1vw;
  z-index: 999;
}
#makeblack {
  position: absolute;
  top: 0vw;
  width: 100vw;
  left: 0vw;
  height: 8vw;
  background-color: #2a2a2a;
  z-index: 990;
}

.copyrightBottom{
	position: relative;
	margin-top: 5vw;
	width:100vw;
	}
	
	#bigbluebottom {
	height:2vw;
	background-color: rgba(255, 255, 255, 0.1);
	z-index:998;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
	#copyright {
	z-index:999;
	color:#fff;
	font-size:0.7vw;
}

/* ONE */
@media screen and (min-width: 1750px) {
  #content {
    position: relative;
    top: 8vw;
	  /*top: 6.2vw;*/
    font-family: 'dm_sans9pt_regular';
    background-color: #2a2a2a;
	  border:#FF0004 thick;
  }
  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
  }
  /* remember to define focus styles! */ :focus {
    outline: 0;
  }
  body {
    line-height: 1;
    color: black;
    background-color: #2a2a2a;
    overflow-x: hidden;
  }
  ol, ul {
    list-style: none;
  }
  /* tables still need 'cellspacing="0"' in the markup */
  table {
    border-collapse: separate;
    border-spacing: 0;
  }
  caption, th, td {
    text-align: left;
    font-weight: normal;
  }
  blockquote:before, blockquote:after, q:before, q:after {
    content: "";
  }
  blockquote, q {
    quotes: """";
  }
  /* Make HTML 5 elements display block-level for consistent styling */
  main, article, section, aside, hgroup, nav, header, footer, figure, figcaption {
    display: block;
  }
  /* ============ *\
   GENERAL TAGS
\* ============ */
  * {
    box-sizing: border-box;
  }
  html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #2a2a2a;
  }
  body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 26px;
    background-color: #2a2a2a;
    overflow-x: hidden;
  }
  p {
    padding: 10px 0;
  }
  h1, h2, h3 {
    font-family: 'Open Sans Condensed', sans-serif;
  }
  h1, h2 {
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: bold;
  }
  h3 {
    font-size: 30px;
    line-height: 30px;
    padding-top: 5px;
    text-transform: uppercase;
    left: 0.75px;
  }
  ::selection {
    background-color: #2a2a2a;
    color: #ffffff;
  }
  ::-moz-selection {
    background-color: #2a2a2a;
    color: #ffffff;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  		
  .container > div {
    display: grid;
    min-height: 440px;/* This is the height of one row in the grid ---------*/
    align-items: center;
    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    background-color: #2a2a2a;
    border-right: 0.5vw solid #2a2a2a;
    border-top: 0vw solid #2a2a2a;
    border-bottom: 0.5vw solid #2a2a2a;
  }
}
/*TWO*/
@media screen and (min-width:1141px) and (max-width:1750px) {
	
#scottdurrant {
  position: absolute;
  top: 2.1vw;
  left: 40vw;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
  font-size: 3vw;
}
#scottdurrant img {
  width: 20vw;
  height: auto;
}
	#navbar {
  position: absolute;
  top: 7vw;
  height: 6vw;
  /*background-color:#0E13A4;*/
  font-family: 'dm_sans9pt_regular';
  z-index: 999;
}
	#navigation {
  position: absolute;
  left: 0vw;
  width: 98.4vw;
  top: .4vw;
  /*font-size: 1vw;*/
  letter-spacing: 0.1vw;
  color: #fff;
  font-size: .8vw;
  font-family: 'dm_sans9pt_regular';
  text-align: center;
  z-index: 999;
}
	
	#content {
    position: relative;
    top: 10.2vw;
	width: 100vw;
    font-family: 'dm_sans9pt_regular';
    background-color: #2a2a2a;
  }
	
	#firstimg {
	position:relative;
	top:0.5vw;
	left:-19vw;
	width: 70vw;
}

#firstimg img {
	position:relative;
	width:78vw;
	height:auto;
}
	
	
	.about-text-box-top{
	font-size: 4vw;
	color: #FF8600;
	font-weight: bold;
	margin-top: 5vw;
}

.about-text-box-bottom {
	font-size: 1.2vw;
	color: white;
	line-height: 1.3;
	width: 28vw;
}

#motiondesigner img{
	width:28vw;
	height: auto;
	margin-top: 7vw;
}
	
	.text-box-container{
		margin-left: -11vw;
		margin-top: 2.6vw;
		width: 33vw;
	}
	
	#ExperienceWord img{
	position: absolute;
	margin-top: 69.5vw;
	margin-left: 72vw;
	width: 40vw;
	height: auto;
	transform: rotate(90deg);
}
#EDUWord img{
	position: absolute;
	margin-top: 150.5vw;
	margin-left: 0vw;
	width: 14vw;
	height: auto;
	transform: rotate(90deg);
}
	
	.workExperienceOne{
	width: 80vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 6vw;
}
.workExperienceTwo{
	width: 80vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 4vw;
}
#EDUExperienceOne{
	width: 80vw;
	display: flex;
	align-items: flex-start;
	gap: 2vw;
	margin: auto;
	margin-top: 4vw;
}

#workExpLogoOne img{
	width: 16vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 5.5vw;
}
#workExpLogoTwo img{
	width: 16vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 5vw;
}
#workExpLogoThree img{
	width: 16vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 2vw;
	margin-top: 6vw;
}
#workExpLogoFour img{
	width: 16vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 3vw;
	margin-top: 5vw;
}
#EDULogoOne img{
	width: 12vw;
	height: auto;
	margin-right: 5vw;
	margin-left: 4vw;
	margin-top: 2.5vw;
	margin-bottom: 1vw;
}

.workExpOneTextContainer{
	width: 60vw;
	margin-left: 0vw;
	margin-right: 5vw;
}
.workEDUOneTextContainer{
	width: 60vw;
	margin-left: 0vw;
	margin-right: 5vw;
	margin-top: 3vw;
	border: #CE3A3C;
}

.workExpFourTextContainer{
	width: 60vw;
	margin-left: -1vw;
	margin-right: 5vw;
}

.workExpOneHeaderCompanyAndDates{
	display: flex;
	width: auto;
}

.workExpOneCompany, .workExpTwoCompany, .workExpThreeCompany, .workExpFourCompany, .EDUExpOneCompany{
	color: white;
	font-weight: bold;
	font-size: 1.5vw;
}
.workExpOneDates, .workExpTwoDates, .workExpThreeDates, .workExpFourDates, .EDUExpOneDates{
	color: white;
	font-size: 1vw;
	margin-left: auto;
}

.workExpOneTitle, .workExpTwoTitle, .workExpThreeTitle, .workExpFourTitle, .EDUExpOneTitle{
	color: white;
	font-size: 1vw;
}
.workExpOneBulletsContainer{
	width: auto;
	margin-top: 1vw;
}
.workExpOneBulletOne, .workExpOneBulletTwo, .workExpOneBulletThree, .workExpTwoBulletOne, .workExpTwoBulletTwo, .workExpThreeBulletOne, .workExpThreeBulletTwo, .workExpFourBulletOne, .workExpFourBulletTwo{
	color: white;
	font-size: 1.1vw;
	margin-bottom: .3vw;
}
	
.copyrightBottom{
	position: relative;
	margin-top: 10vw;
	width:100vw;
	}
	
	#bigbluebottom {
	height:2vw;
	background-color: rgba(255, 255, 255, 0.1);
	z-index:998;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
	#copyright {
	z-index:999;
	color:#fff;
	font-size:1vw;
}
}
/* THREE */
@media screen and (min-width:801px) and (max-width:1140px) {
	
	#scottdurrant {
  position: absolute;
  top: 2.1vw;
  left: 39vw;
  color: #fff;
  font-family: 'dm_sans9pt_regular';
  font-size: 3vw;
}
#scottdurrant img {
  width: 22vw;
  height: auto;
}

#navbar {
  position: absolute;
  top: 7.5vw;
  height: 7vw;
  /*background-color:#0E13A4;*/
  font-family: 'dm_sans9pt_regular';
  z-index: 999;
}
#navigation {
  position: absolute;
  left: 0vw;
  width: 98.4vw;
  top: .4vw;
  /*font-size: 1vw;*/
  letter-spacing: 0.1vw;
  color: #fff;
  font-size: 1.2vw;
  font-family: 'dm_sans9pt_regular';
  text-align: center;
  z-index: 999;
}
#content {
    position: relative;
    top: 11vw;
    font-family: 'dm_sans9pt_regular';
    background-color: #2a2a2a;
  }
	
		#firstimg {
	position:relative;
	top:0.5vw;
	left:-38vw;
	width: 70vw;
}

#firstimg img {
	position:relative;
	width:95vw;
	height:auto;
}
	
	
	.about-text-box-top{
	font-size: 5vw;
	color: #FF8600;
	font-weight: bold;
	margin-top: 5vw;
}

.about-text-box-bottom {
	font-size: 1.6vw;
	color: white;
	line-height: 1.3;
	width: 35vw;
}

#motiondesigner img{
	width:35vw;
	height: auto;
	margin-top: 4vw;
}
	
	.text-box-container{
		margin-left: -13vw;
		margin-top: 2.6vw;
		width: 33vw;
	}
	
	#ExperienceWord img{
	position: absolute;
	margin-top: 84vw;
	margin-left: 73vw;
	width: 45vw;
	height: auto;
	transform: rotate(90deg);
}
#EDUWord img{
	position: absolute;
	margin-top: 196.5vw;
	margin-left: -4vw;
	width: 15vw;
	height: auto;
	transform: rotate(90deg);
}
	
	.workExperienceOne{
	width: 85vw;
	display: flex;
	align-items: flex-start;
	margin-top: 8vw;
	margin-left: 6vw;
}
.workExperienceTwo{
	width: 85vw;
	display: flex;
	align-items: flex-start;
	margin: auto;
	margin-top: 4vw;
	margin-left: 6vw;
}
#EDUExperienceOne{
	width: 85vw;
	display: flex;
	align-items: flex-start;
	margin: auto;
	margin-top: 6vw;
	margin-left: 9vw;
}

#workExpLogoOne img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -1vw;
	margin-top: 9vw;
}
#workExpLogoTwo img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -1vw;
	margin-top: 9vw;
}
#workExpLogoThree img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -1vw;
	margin-top: 10vw;
}
#workExpLogoFour img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -1vw;
	margin-top: 8vw;
}
#EDULogoOne img{
	width: 12vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -1vw;
	margin-top: 2.5vw;

}

.workExpOneTextContainer{
	width: 67vw;
	margin-left: -5vw;
	margin-right: -5vw;

}
	.workExpFourTextContainer{
	width: 67vw;
	margin-left: -5vw;
	margin-right:-5vw;
	margin-bottom: 3vw;
}
.workEDUOneTextContainer{
	width: 67vw;
	margin-left: -2vw;
	margin-right: -5vw;
	margin-top: 4vw;
}

.workExpOneHeaderCompanyAndDates{
	display: flex;
	width: auto;
}

.workExpOneCompany, .workExpTwoCompany, .workExpThreeCompany, .workExpFourCompany, .EDUExpOneCompany{
	color: white;
	font-weight: bold;
	font-size: 1.8vw;
}
.workExpOneDates, .workExpTwoDates, .workExpThreeDates, .workExpFourDates, .EDUExpOneDates{
	color: white;
	font-size: 1.6vw;
	margin-left: auto;
}

.workExpOneTitle, .workExpTwoTitle, .workExpThreeTitle, .workExpFourTitle, .EDUExpOneTitle{
	color: white;
	font-size: 1.6vw;
}
.workExpOneBulletsContainer{
	width: auto;
	margin-top: 1vw;
}
.workExpOneBulletOne, .workExpOneBulletTwo, .workExpOneBulletThree, .workExpTwoBulletOne, .workExpTwoBulletTwo, .workExpThreeBulletOne, .workExpThreeBulletTwo, .workExpFourBulletOne, .workExpFourBulletTwo{
	color: white;
	font-size: 1.6vw;
	margin-bottom: .3vw;
}
	
.copyrightBottom{
	position: relative;
	margin-top: 12vw;
	width:100vw;
	}
	
	#bigbluebottom {
	height:3vw;
	background-color: rgba(255, 255, 255, 0.1);
	z-index:998;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
	#copyright {
	z-index:999;
	color:#fff;
	font-size:1.4vw;
}
}

/* FIVE ** NEW FOUR ***/
@media screen and (min-width:1px) and (max-width:800px) {
		
#content {
    position: relative;
    top: 6.2vw;
    font-family: 'dm_sans9pt_regular';
    background-color: #2a2a2a;
  }
  html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, font, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: inherit;
    font-style: inherit;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
  }
  /* remember to define focus styles! */ :focus {
    outline: 0;
  }
  body {
    line-height: 1;
    color: black;
    background-color: #2a2a2a;
    overflow-x: hidden;
  }
  ol, ul {
    list-style: none;
  }
  /* tables still need 'cellspacing="0"' in the markup */
  table {
    border-collapse: separate;
    border-spacing: 0;
  }
  caption, th, td {
    text-align: left;
    font-weight: normal;
  }
  blockquote:before, blockquote:after, q:before, q:after {
    content: "";
  }
  blockquote, q {
    quotes: """";
  }
  /* Make HTML 5 elements display block-level for consistent styling */
  main, article, section, aside, hgroup, nav, header, footer, figure, figcaption {
    display: block;
  }
  /* ============ *\
   GENERAL TAGS
\* ============ */
  * {
    box-sizing: border-box;
  }
  html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #2a2a2a;
  }
  body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 26px;
    background-color: #2a2a2a;
    overflow-x: hidden;
  }
  p {
    padding: 10px 0;
  }
  h1, h2, h3 {
    font-family: 'Open Sans Condensed', sans-serif;
  }
  h1, h2 {
    font-size: 60px;
    line-height: 60px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    font-weight: bold;
  }
  h3 {
    font-size: 30px;
    line-height: 30px;
    padding-top: 5px;
    text-transform: uppercase;
    left: 0.75px;
  }
  ::selection {
    background-color: #2a2a2a;
    color: #ffffff;
  }
  ::-moz-selection {
    background-color: #2a2a2a;
    color: #ffffff;
  }
  sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
	
	.image-and-text{
	width: 100vw;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
	#firstimg {
	position:relative;
	margin-top: -4vw;
	left:-70vw;
	width: 165vw;
}

#firstimg img {
	position:relative;
	width:165vw;
	height:auto;
}
		.text-box-container{
		width: 97.5vw;
		align-items: center;
		margin-top: -5vw;
	}
	
.about-text-box-top{
	font-size: 10vw;
	color: #FF8600;
	font-weight: bold;
	text-align: center;

}

.about-text-box-bottom {
	font-size: 3vw;
	width: auto;
	color: white;
	line-height: 1.3;
	text-align: center;
	margin-top: 3vw;
}

#motiondesigner img{
	width:90vw;
	height: auto;
	margin-top: 4vw;
	margin-bottom: 3vw;
	margin-left: 3vw;
}
		
	#ExperienceWord img{
	position: absolute;
	margin-top: 210vw;
	margin-left: 71vw;
	width: 50vw;
	height: auto;
	transform: rotate(90deg);
}
#EDUWord img{
	position: absolute;
	margin-top: 450vw;
	margin-left: 88vw;
	width: 15vw;
	height: auto;
	transform: rotate(90deg);
}
	
	.workExperienceOne{
	width: 85vw;
	display: flex;
	align-items: flex-start;
	margin-top: 16vw;
	margin-left: 6vw;
}
.workExperienceTwo{
	width: 85vw;
	display: flex;
	align-items: flex-start;
	margin: auto;
	margin-top: 4vw;
	margin-left: 6vw;
}
#EDUExperienceOne{
	width: 90vw;
	display: flex;
	align-items: flex-start;
	margin: auto;
	margin-top: 14vw;
	margin-left: 9vw;
	margin-bottom: 3vw;
}

#workExpLogoOne img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -5vw;
	margin-top: 0vw;
}
#workExpLogoTwo img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -5vw;
	margin-top: -.9vw;
}
#workExpLogoThree img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -5vw;
	margin-top: -1vw;
}
#workExpLogoFour img{
	width: 18vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -5vw;
	margin-top: 0vw;
}
#EDULogoOne img{
	width: 12vw;
	height: auto;
	margin-right: 5vw;
	margin-left: -5vw;
	margin-top: 2.5vw;

}

.workExpOneTextContainer{
	width: 70vw;
	margin-left: -5vw;
	margin-right: -5vw;
}
	.workExpFourTextContainer{
	width: 70vw;
	margin-left: -5vw;
	margin-right:-5vw;
	margin-bottom: 3vw;
}
.workEDUOneTextContainer{
	width: 70vw;
	margin-left: -2vw;
	margin-right: -5vw;
	margin-top: 3vw;
}

.workExpOneHeaderCompanyAndDates{
	display: flex;
	width: auto;
}

.workExpOneCompany, .workExpTwoCompany, .workExpThreeCompany, .workExpFourCompany, .EDUExpOneCompany{
	color: white;
	font-weight: bold;
	font-size: 3vw;
}
.workExpOneDates, .workExpTwoDates, .workExpThreeDates, .workExpFourDates, .EDUExpOneDates{
	color: white;
	font-size: 1.6vw;
	margin-left: auto;
}

.workExpOneTitle, .workExpTwoTitle, .workExpThreeTitle, .workExpFourTitle, .EDUExpOneTitle{
	color: white;
	font-size: 1.6vw;
}
.workExpOneBulletsContainer{
	width: auto;
	margin-top: 1vw;
}
.workExpOneBulletOne, .workExpOneBulletTwo, .workExpOneBulletThree, .workExpTwoBulletOne, .workExpTwoBulletTwo, .workExpThreeBulletOne, .workExpThreeBulletTwo, .workExpFourBulletOne, .workExpFourBulletTwo{
	color: white;
	font-size: 2.5vw;
	margin-bottom: .3vw;
}
.workExpOneBulletOne li, .workExpOneBulletTwo li, .workExpOneBulletThree li, .workExpTwoBulletOne li, .workExpTwoBulletTwo li, .workExpThreeBulletOne li, .workExpThreeBulletTwo li, .workExpFourBulletOne li, .workExpFourBulletTwo li{
    margin-bottom: 1.5vw;
	}
	
.smallWhiteLine {
	width:auto;
	height:.1vw;
	margin-top: 2vw;
	margin-bottom: 2vw;
	background-color: white;
}
	
	.longWhiteLine {
	width: 91vw;
	background-color:#939393;
	height: .1vw;
	margin-left: 0;
	margin-top: 3vw;
}
	
.copyrightBottom{
	position: relative;
	margin-top: 16vw;
	width:100vw;
	}
	
	#bigbluebottom {
	height:5vw;
	background-color: rgba(255, 255, 255, 0.1);
	z-index:998;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
	#copyright {
	z-index:999;
	color:#fff;
	font-size:1.7vw;
}	
		
}
/* SIX */
@media screen and (max-width: 60em){
#scottdurrant {
	position:absolute;
	top:3.vw;
	left:5.5vw;
	color:#fff;
	font-family: 'dm_sans9pt_regular';
	font-size:4vw;
}
	
#navbar {
	Display: none;
} 	

#navigation {
	Display: none;
}

#mobilenav {
	display:block;
	z-index:999;
}
}
/* SEVEN */
@media screen and (max-width: 1px){
		h1,
	h2 {
		font-size: 50px;
		line-height: 50px;}
	
	h3 {
		font-size:24px;
		line-height: 24px;}	
}
 