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

@-webkit-keyframes fade {
  from {opacity: .4} 
	to {opacity: 1}
	}


@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

.mySlides {
  display: none;
}

.embed-youtube {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 60px;
    height: 0;
    overflow: hidden;
	
}

.embed-youtube iframe,
.embed-youtube object,
.embed-youtube embed {
    border: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media (min-width: 200px) {
	
.abouttext{
	color: black;
	font-size: 10pt;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
}
	
.landingtitle {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-weight: bold;
	font-size: 28pt;
	margin-left: 0%;
	width: 100%;
	text-decoration: none;
	padding-bottom: 0px;
	}

.button {
	font-size: 11pt;
	color: black;
	text-decoration: none;
	padding-right: 2px;
	}
	
.button2{
	font-size: 11pt;
	color: black;
	text-decoration: none;
	padding-right: 0px;
	}

.button3 {
		color: black;
		hover: blue;		
	}

.button3:hover {
		color: blue;
	}
	
.mobilemenu {
		margin-left: 0%;
		display: block;
		padding-bottom: 2%;
		font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
		font-weight: bold;
	}

.mobilemenu, .button, .button3 {
		hover: blue;
		text-decoration: none;
	}
	
.mobilemenu a, .button a, .button3 a {
	hover: blue;
    text-decoration: none;
}

.mobilemenu a.active, .button a.active, .button3 a.active {
	hover:blue;
}

.mobilemenu a:hover, .button a:hover, .button3 a:hover {
	color: blue;
}
	

.slidecaption {
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 12px;
	padding-bottom: 25px;
	padding-top: 1px;
}
	
.caption {
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 12px;
	padding-bottom: 25px;
	padding-top: 1px;
}

.landingsubtitle, .photography, .film, .projects, .about {
	display: none;
}
	
.prev, .next, .backtotop {
  cursor: pointer;
}

.prev:hover, .next:hover, .backtotop:hover, .button3:hover {
  color: blue;
	}
	
.landingtitle a {
	hover: blue;
    color: black; 
    text-decoration: none;
}

.landingtitle a.active {
	hover: blue;
}

.landingtitle a:hover {
	color: blue;
}

.slideshow-container {
	display: none}

.scroll1-container {
    width: 97%;
	position: absolute;
	margin-left: 0%;
}

.scroll2-container {
    width: 97%;
	position: absolute;
	margin-left: 0%;
}
	
.youtubescroll {
	width: 97%;
	}

.eswtitle {
	width: 97%;
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 16px;
    text-align: left;
	padding-bottom: 10px;
	}
	
.scroll3-container {
		display: block;
		position: absolute;
		width: 97%;
	}
	
.landingsubtitle {
    display: none;
  }
	
.headermain {
		display: none;
	}
	
.slideshowvertical, .speedwayvertical {
	display: none;
	}

.slideshowmobile, .speedwaymobile {
		display: block;
	}

.caption {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 12px;
}
		

.mySlides {
  display: none;
}

.prev, .next, .gallery, .galleryimgs, .list, .gallery2, .backtotop {
  cursor: pointer;
}

.prev:hover, .next:hover, .gallery:hover, .list:hover, .gallery2:hover, .backtotop:hover {
  color: blue;
}

.backtotop {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-variant: normal;
    font-weight: normal;
    font-size: 18pt;
    cursor: pointer;
    color: gray;
    padding-bottom: 40px;
    padding-top: 0px;
    text-align: center;
    margin-left: 37%;
}
}

@media (min-width:320px)  { 
	.abouttext{
}
	
	.landingtitle {
	font-size: 28.5pt;
	}
	
.button {
	font-size: 11pt;
	color: black;
	text-decoration: none;
	padding-right: 6px;
	}
	
	.button2{
	font-size: 11pt;
	color: black;
	text-decoration: none;
	padding-right: 0px;
	}
}
@media (min-width:480px)  {

.landingtitle {
	font-size: 44pt;
	}
	
.button {
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 33.5px;
	}
	
	.button2{
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 0px;
	}

}
@media (min-width:600px)  {
	.eswtitle {
	width: 95%;
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 18px;
    text-align: left;
	padding-bottom: 10px;
	}
	
.landingtitle {
	font-size: 48pt;
	}
	
.button {
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 48.5px;
	}
	
	.button2{
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 0px;
	}
}
@media (min-width:801px)  {
	.eswtitle {
	width: 95%;
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 24px;
    text-align: left;
	padding-bottom: 10px;
	}
	
	
	.landingtitle {
	font-size: 48pt;
	}
	
.button {
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 48.5px;
	}
	
	.button2{
	font-size: 14pt;
	color: black;
	text-decoration: none;
	padding-right: 0px;
	}

}
@media (min-width:1025px) { 
	.eswtitle {
	width: 95%;
	color: grey;
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
    font-weight: normal;
    font-size: 16px;
    text-align: left;
	padding-bottom: 10px;
	}
	
.landingtitle {
		font: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-size: 18pt;
	margin-left: 75px;
	width: 20%;
	margin-top: 12%;
	top: 10px;
	position: sticky;
	padding-bottom: 30px;
	}
	
.scroll1-container {
    width: 65%;
	position: relative;
	margin-left: 30%;
	margin-top: -23%;
	}
	
.scroll2-container {
    width: 65%;
	position: relative;
	margin-left: 30%;
	margin-top: -23%;
	}

.scroll3-container {
	display: none;
	}
	
.slideshow-container {
    margin-left: 30%;
	margin-top: -23%;
    width: 65%;
	position: relative;
	padding-bottom: 0;
	display: block;
}
	
.youtubescroll {
	 margin-left: 30%;
	margin-top: -23%;
    width: 65%;
	}
	
.abouttext{
	margin-left: 30%;
	margin-top: -10%;
    width: 65%;
}
		
.landingsubtitle {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	color: grey;
	font-size: 10pt;
	margin-left: 75px;
	width: 20%;
	display: block;
	top: 66px;
	position: sticky;
	padding-bottom: 30px;
		}
	
.button {
		font-size: 10pt;
		text-decoration: none;
		hover: blue;
		color: black;

	}
	
.button a.active {
	color: black;
	hover:blue;
	text-decoration: none;
	}
	
	
.photography {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
font-weight: bold;
	color: black;
	font-size: 8pt;
	margin-left: 75px;
	width: 20%;
	padding-bottom: 10px;
	display: block;
	text-decoration: none;
	top: 110px;
	position: sticky;
		}
	
.film {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
			font-weight: bold;
	color: black;
	font-size: 10pt;
	margin-left: 75px;
	width: 20%;
	display: block;
	text-decoration: none;
	top: 135px;
	position: sticky;
	padding-bottom: 20px;

		}
	
.projects {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
			font-weight: bold;
	color: black;
	font-size: 10pt;
	margin-left: 75px;
	width: 20%;
	padding-bottom: 20px;
	display: block;
	text-decoration: none;
	top: 170px;
	position: sticky;
		}
	
.about {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	color: black;
	font-size: 10pt;
	margin-left: 75px;
	width: 20%;
	display: block;
	text-decoration: none;
	top: 205px;
	position: sticky;
		}
	
.photography, .film, .projects, .about {
	hover: blue;
	color: black;
}

.photography a.active, .film a.active, .projects a.active, .about a.active  {
	hover:blue;
	color: black;
}

.photography a:hover, .film a:hover, .projects a:hover, .about a:hover {
	color: blue;
}
	
.mobilemenu {
	display: none;
}

.slideshowmobile, .speedwaymobile {
	display: none;
}

.slideshowvertical, .speedwayvertical {
	display: block;
	}
	
.backtotop {
	font-size: 10pt;
	margin-left: 45%;
	}
}
	
@media (min-width:1281px) { /* hi-res laptops and desktops */ 

}