* {
  box-sizing: border-box;
}

body {
  background: #201030;
  width: 100%;
  height: 9000px;
}

.wrapper {
  max-width: 1095px;
  margin: 0 auto;
  position: relative;
}

.Zombone {
  z-index: 30;
  position: absolute;
  top: 390px;
  left: 628px;
   
}

.Zombone img{
  width: 55px;
  height: 115px;
  z-index: 30;
  position: fixed;
}

#square {
  position: absolute;
  top: 390px;
  left: 628px;
	width: 60px;
	height: 6550px;
	background: #323232;
  z-index:25;
}

/*---------Level 1------------*/


.FirstLayer {
    margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -5px;
    
}

.backgroundLevel1 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  
  
}

h1 {
  font-family: Futura, Sans-serif;
  font-size: 5em;
  color: #6f6b67;
  margin: 0;
  position: absolute;
  top: 80px;
  left: 230px;
  z-index: 99;
}



.ZomboneBubble {
	z-index:110;
	position: absolute;
	top: 230px;
	left: 230px;
}

.ZomboneBubble h3{
	z-index: 112;
	position: absolute;
	width: 250px;
	left: 20px;
	color: #d3d3d3;
	font-size: 1em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: center;
}

.ZomboneBubble h2{
	z-index: 112;
	position: absolute;
	width: 255px;
	left: 90px;
	top: 55px;
	color: #d3d3d3;
	font-size: 1em;
	font-family: Futura, sans-serif;
	text-align: center;
}

.ZomboneBubble img {
	position: absolute;
	width: 400px;
	-moz-box-shadow: -6px 4px 6px 2px black;
  -webkit-box-shadow: -6px 4px 6px 2px  black;
  box-shadow: -6px 4px 6px 2px black;
}

.moon img {
  z-index: 5;
  position: absolute;
  left: 40px;
  top: 30px;
  width: 500px;
}
.graveyard img{
    z-index: 100;
    position: absolute;
    width: 100%;
    bottom: 50px;
    left:0;
     
}
.grass {
    z-index: 110;
    position: absolute;
    width: 100%;
	  height: 50px;
    bottom: 85px;
    left:0;
     
}

/* Chrome, Safari, Opera */
@-webkit-keyframes moveup {
    50% {top: 485px;}
}

/* Standard syntax */
@keyframes moveup {
    50% {top: 485px;}
}



.numberOfMovies {
	position: absolute;
	top: 445px;
	left: 150px;
	z-index: 9;
	width: 300px;
	animation-delay: 5s;
  -webkit-animation: moveup 4s 1 5s; /* Chrome, Safari, Opera */
  animation: moveup 4s 1 5s;
	
  
}


/* Chrome, Safari, Opera */
@-webkit-keyframes handmove {
    50% {top: 495px;}
}

/* Standard syntax */
@keyframes handmove {
    50% {top: 495px;}
}

.hand {
	position: absolute;
	top: 510px;
	left: 840px;
	z-index: 109;
	width: 20px;
	
  -webkit-animation: handmove 3s infinite 2s; /* Chrome, Safari, Opera */
  animation: handmove 3s infinite 2s;
}

  



/*#numberOfMovies img{
    display: none;
    position: absolute;
    width: 332px;
    left: 128px;
    top: 436px;
    z-index: 150;
   -webkit-transition: width 2s; /* Safari */
    /*transition: width 2s;
}

a {
  position: absolute;
  z-index: 140;
  width: 400px;
	height: 100px;
	background: #595959;
  opacity: 0.01;
  filter: alpha(opacity=1); /* For IE8 and earlier */
  /*left: 50px;
  top: 430px;
  
}

a:hover + #numberOfMovies img {
    display: block;
}


/*--------Level 2-------------*/

.Level2 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -140px;
}

.backgroundLevel2 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Decay {
	z-index:25;
	position: absolute;
	top: 300px;
	left: 700px;
}

.Decay h3{
	z-index: 30;
	position: absolute;
	width: 180px;
	left: 80px;
	color: #d3d3d3;
	font-size: .90em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: left;
}


.Decay img {
	position: absolute;
	width: 350px;
	-moz-box-shadow: 6px 4px 6px 2px black;
  -webkit-box-shadow: 6px 4px 6px 2px  black;
  box-shadow: 6px 4px 6px 2px black;
}

	
.ZomboneBubble2 {
	z-index:25;
	position: absolute;
	top: 530px;
	left: 270px;
}

.ZomboneBubble2 h3{
	z-index: 30;
	position: absolute;
	width: 200px;
	left: 80px;
	color: #d3d3d3;
	font-size: 1.25em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: center;
}

.ZomboneBubble2 img {
	position: absolute;
	width: 350px;
	-moz-box-shadow: -6px 4px 6px 2px black;
  -webkit-box-shadow: -6px 4px 6px 2px  black;
  box-shadow: -6px 4px 6px 2px black;
}



.putrefaction img{
  position: absolute;
  top: 750px;
  left: 100px;
  width: 500px;
  z-index: 25;
}

/*---------Level 3------------*/

.Level3 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -260px;
    
}

.backgroundLevel3 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

/*---------Level 4------------*/

.Level4 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -400px;
    
}

.backgroundLevel4 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}




/*---------Level 5------------*/

.Level5 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -520px;
    
}

.backgroundLevel5 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Decay2 {
	z-index:25;
	position: absolute;
	top: -140px;
	left: 700px;
}

.Decay2 h3{
	z-index: 30;
	position: absolute;
	width: 170px;
	left: 80px;
	color: #d3d3d3;
	font-size: 1em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: left;
}


.Decay2 img {
	position: absolute;
	width: 350px;
	-moz-box-shadow: 6px 4px 6px 2px black;
  -webkit-box-shadow: 6px 4px 6px 2px  black;
  box-shadow: 6px 4px 6px 2px black;
}


.ZombieSpeed1 {
	
	z-index:15;
	position: absolute;
	width: 550px;
	left: 100px;
	top: 250px;
}

.ZombieSpeed2 {
	
	z-index:15;
	position: absolute;
	left: 690px;
	top: 270px;
	width: 410px;
}

.Rollers {
	z-index:20;
	position: absolute;
	left: 130px;
	top: 200px;
	width: 70px;
}

.Crawlers {
	z-index:20;
	position: absolute;
	left: 215px;
	top: 200px;
	width: 70px;
}

.Walkers {
	z-index:20;
	position: absolute;
	left: 500px;
	top: 200px;
	width: 70px;
}

.Runners {
	z-index:20;
	position: absolute;
	left: 800px;
	top: 200px;
	width: 70px;
}

.Humans {
	z-index:20;
	position: absolute;
	left: 940px;
	top: 200px;
	width: 70px;
}


/*---------Level 6------------*/

.Level6 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -640px;
    
}

.backgroundLevel6 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}


/*---------Level 7------------*/

.Level7 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -760px;
    
}

.backgroundLevel7 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Decay3 {
	z-index:25;
	position: absolute;
	top: -420px;
	left: 700px;
}

.Decay3 h3{
	z-index: 30;
	position: absolute;
	width: 170px;
	left: 80px;
	color: #d3d3d3;
	font-size: 1.2em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: left;
}


.Decay3 img {
	position: absolute;
	width: 350px;
	-moz-box-shadow: 6px 4px 6px 2px black;
  -webkit-box-shadow: 6px 4px 6px 2px  black;
  box-shadow: 6px 4px 6px 2px black;
}


.worldmap{
  position: absolute;
	top: -200px;
	left: 50px;
  width: 50%;
  
  z-index: 100;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes growbig {
    50% {width: 220px;}
}

/* Standard syntax */
@keyframes growbig {
    50% {width: 220px;}
}

.HaitianZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 20px;
	top: -70px;

}

.HaitianZombie:hover {
	z-index: 156;
  position: absolute;
  width: 150px;
	left: 20px;
	top: -70px;
	-webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}

.RevenantZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 110px;
	top: -250px;
}

.RevenantZombie:hover {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 110px;
	top: -250px;
	
	-webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}

.DraZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 310px;
	top: -240px;
}

.DraZombie:hover {
	z-index: 155;
  position: absolute;
  width: 150px;
	left: 310px;
	top: -240px;
	-webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}

.BakeZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 460px;
	top: -130px;
}

.BakeZombie:hover {
	z-index: 155;
  position: absolute;
  width: 150px;
	left: 460px;
	top: -130px;
	
	-webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}

.PontZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 390px;
	top: 10px;
}
.PontZombie:hover {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 390px;
	top: 10px;
	-webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}

.XioZombie {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 210px;
	top: 15px;
}
.XioZombie:hover {
	z-index: 150;
  position: absolute;
  width: 150px;
	left: 210px;
	top: 15px;
	
  -webkit-animation: growbig 11s 1; /* Chrome, Safari, Opera */
  animation: growbig 11s 1;
}


/*---------Level 8------------*/

.Level8 {
 margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -880px;
    
}

.backgroundLevel8 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Think {
	z-index: 150;
	position: absolute;
	left: 690px;
	top: 150px;
  width: 350px;
}

/*---------Level 9------------*/

.Level9 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -1000px;
    
}

.backgroundLevel9 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Poll {
	z-index: 150;
	position: absolute;
	left: 80px;
	top: -150px;
}

/*---------Level 10------------*/

.Level10 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -1200px;
    
}

.backgroundLevel10 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}


/*---------Level 11------------*/

.Level11 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -1400px;
    
}

.backgroundLevel11 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

/*---------Level 12------------*/
.ZomboneBubble3 {
	z-index:25;
	position: absolute;
	top: 440px;
	left: 270px;
}

.ZomboneBubble3 h2{
	z-index: 30;
	position: absolute;
	width: 215px;
	left: 80px;
	top: 2px;
	color: #d3d3d3;
	font-size: 1.25em;
	font-weight: 300;
	font-family: Futura, sans-serif;
	text-align: center;
}

.ZomboneBubble3 img {
	position: absolute;
	width: 350px;
	-moz-box-shadow: -6px 4px 6px 2px black;
  -webkit-box-shadow: -6px 4px 6px 2px  black;
  box-shadow: -6px 4px 6px 2px black;
}

.Level12 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -1545px;
    
}

.backgroundLevel12 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}


/*---------Level 13------------*/

.Level13 {
  margin: 0 auto;
    padding: 0;
    height: 650px;
    width: 1095px;
    position: relative;
    left: 0;
    top: -1680px;
    
}

.backgroundLevel13 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
}

.Level13 h2 {
	position: absolute;
	left: 100px;
	top: -50px;
	z-index: 50;
	padding: 15px;
	background-color: gray;
	color: white;
	font-family: sans-serif;
	font-size: 2em;
	width: 300px;
}

.Underworld {
	z-index: 50;
	position: absolute;
	width: 100%;
	bottom: 0;
}

/*---------Footer------------*/

footer {
  position: relative;
  top: -1800px;
  height: 1200px;
  width: 100%;
  background-color: black;
  z-index: 1000;
}

footer h3, p {
  color: grey;
	text-align: left;
	padding-left: 50px;
}

footer h3{
	font-size: 2em;
	padding-top: 50px;
}