html, body {width:100%;height:100%;margin:0;padding:0;position: absolute;}
body {top:0px;text-align: center;vertical-align: middle;font-family: helvetica;}
/*@keyframes spin {
	from {transform: rotate(0deg);}
	to {transform: rotate(1000deg);}
}*/
@keyframes truckin {
	0% {transform: rotate(5deg);}
	10% {transform: rotate(0deg);}
	15% {transform: rotate(-5deg);}
	20% {transform: rotate(0deg);}
	25% {transform: rotate(7deg);}
	30% {transform: rotate(13deg);}
	30% {transform: rotate(7deg);}
	45% {transform: rotate(13deg);}
	50% {transform: rotate(5deg);}
	60% {transform: rotate(-5deg);}
	65% {transform: rotate(0deg);}
	70% {transform: rotate(5deg);}
	80% {transform: rotate(15deg);}
	90% {transform: rotate(10deg);}
}
header {
	background-color: RGBA(84, 77, 71, .8);
	height: 11vw;
	top: 0px;
	position: fixed;
	width: 100%;
	/*opacity: .5;*/
	font-size: 2vw;
}
header li {
	display: inline-block;
	width: 32%;
}
ul {
	margin-top: .5vw;
	padding: 0px;
}
div {
	width: 80%;
	margin: 10%;
	border-radius: 25px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	height: 84%;
}
div img {
	width: 100%;
}
h1 {	
	border-radius: 25px;
	font-size: 4vw;
}
h1, h2{
	background-color: rgb(255,255,255, .5);
}
h2 {
	font-size: 4vw;
}
a {
	text-decoration: none;
}
p {
	font-size: 3vw;
}
.truck {
	/*animation: truckin 5s 10;*/
	animation-timing-function: linear;
}
#truckImg {
	width: 9vw;
}
#wheel {
	animation-fill-mode: forwards;
	animation: spin 10s infinite;
	animation-timing-function: linear;
	position: relative;
	top: 0px;
	left: -11px;
	width: 14px;
}
#wheelF {
	animation-fill-mode: forwards;
	animation: spin 10s infinite;
	animation-timing-function: linear;
	position: relative;
	top: 0px;
	left: -42px;
	width: 14px;
	}
#back { 
	background-image: url("img/road.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	position: fixed;
	width: 100%;
	height: 100%;
	margin: 0px;
	border-radius: 0px;
	opacity: .85;
	top: 0px;
	z-index: -9;
}

/*main page*/

#intro {background-image: url("img/red-wy-paul.jpg");}
#chris {background-image: url("img/red-chris.jpg");}
#capHill {background-image: url("img/red1.jpg");}
#engPull {background-image: url("img/selfie-eng.jpg");}
#engRebuild {background-image: url("img/stripped-tdi-bolt.jpg");}
#tow {background-image: url("img/red5.jpg");}
#bottom {background-image: url("img/snow-rd.jpg");}

/*unimog history page*/

#introGerman {background-image: url("img/german-flag.jpg");}
#germany {background-image: url("img/germany.jpg");}
#Firetruck1 {background-image: url("img/fire1.jpg");}
#Firetruck2 {background-image: url("img/fire2.jpg");}
#Firetruck3 {background-image: url("img/fire3.jpg");}
#techFacts {background-image: url("img/airBrakes.jpg");}
#winch {background-image: url("img/winch.jpg");}

/*dolphin page*/

#intro-dolphin {background-image: url("img/dolphin-mini.png");}
#why {background-image: url("img/ranger.jpg");}
#bend {background-image: url("img/bend.jpg");}
#tripOne {background-image: url("img/gcnr.jpg");}
#seattle {background-image: url("img/dolphin-jasper.jpg");}
#tripTwo {background-image: url("img/Fam-rv.jpg");}
#downsides {background-image: url("img/dolphin-galley.jpg");}
#upsides {background-image: url("img/rv-comparison.png");}
#rainier {background-image: url("img/rainier.png");}
#above {background-image: url("img/dolphin-above.jpg");}